📸 Vorschau • ✨ Funktionen • 🚀 Bereitstellungsanleitung • 🔧 Technologie-Stack • 💻 Entwicklung • 📄 Lizenz
![]() | ![]() |
![]() | ![]() |
![]() | ![]() |
![]() | ![]() |
Bevor Sie mit der Bereitstellung beginnen, stellen Sie bitte sicher, dass Sie Folgendes vorbereitet haben:
S3_ACCESS_KEY_ID
S3_SECRET_ACCESS_KEY
S3_BUCKET_NAME
S3_ENDPOINT
Die Verwendung von GitHub Actions ermöglicht die automatische Bereitstellung der Anwendung nach dem Pushen von Code.
Secret Name | Erforderlich | Zweck |
---|---|---|
CLOUDFLARE_API_TOKEN | ✅ | Cloudflare API-Token (erfordert Workers, D1 und Pages-Berechtigungen) |
CLOUDFLARE_ACCOUNT_ID | ✅ | Cloudflare-Konto-ID |
ENCRYPTION_SECRET | ❌ | Schlüssel zur Verschlüsselung sensibler Daten (falls nicht angegeben, wird einer automatisch generiert) |
Besuchen Sie Cloudflare Dashboard
Erstellen Sie ein neues API-Token
Wählen Sie die Vorlage "Edit Cloudflare Workers" und fügen Sie D1-Datenbank-Bearbeitungsberechtigung hinzu
Forken Sie das Repository, füllen Sie die Secrets aus und führen Sie dann den Workflow aus!!!
Die Bereitstellung wird automatisch ausgelöst, wenn Dateien im backend
-Verzeichnis geändert und auf den main
- oder master
-Branch gepusht werden. Der Workflow verläuft wie folgt:
⚠️ Merken Sie sich Ihren Backend-Domainnamen
Forken Sie das Repository, füllen Sie die Secrets aus und führen Sie dann den Workflow aus.
Die Bereitstellung wird automatisch ausgelöst, wenn Dateien im frontend
-Verzeichnis geändert und auf den main
- oder master
-Branch gepusht werden. Nach der Bereitstellung müssen Sie Umgebungsvariablen im Cloudflare Pages-Kontrollpanel setzen:
Melden Sie sich bei Cloudflare Dashboard an
Navigieren Sie zu Pages → Ihr Projekt (z.B. "cloudpaste-frontend")
Klicken Sie auf "Settings" → "Environment variables"
Fügen Sie die Umgebungsvariable hinzu:
Name: VITE_BACKEND_URL
Wert: Ihre Backend-Worker-URL (z.B. https://cloudpaste-backend.your-username.workers.dev
) ohne abschließendes "/". Es wird empfohlen, eine benutzerdefinierte Worker-Backend-Domain zu verwenden.
Stellen Sie sicher, dass Sie den vollständigen Backend-Domainnamen im Format "https://xxxx.com" eingeben
Wichtiger Schritt: Führen Sie dann den Frontend-Workflow erneut aus, um das Laden der Backend-Domain abzuschließen!!!
Bitte folgen Sie den Schritten strikt, andernfalls schlägt das Laden der Backend-Domain fehl
Für Vercel wird die Bereitstellung wie folgt empfohlen:
Framework Preset: Vite
Build Command: npm run build
Output Directory: dist
Install Command: npm install
☝️ Wählen Sie eine der oben genannten Methoden
git clone https://github.com/ling-drag0n/CloudPaste.git
cd CloudPaste/backend
Installieren Sie Abhängigkeiten
npm install
Melden Sie sich bei Cloudflare an
npx wrangler login
Erstellen Sie eine D1-Datenbank
npx wrangler d1 create cloudpaste-db
Notieren Sie sich die Datenbank-ID aus der Ausgabe.
Ändern Sie die wrangler.toml-Konfiguration
[[d1_databases]]
binding = "DB"
database_name = "cloudpaste-db"
database_id = "YOUR_DATABASE_ID"
Stellen Sie den Worker bereit
npx wrangler deploy
Notieren Sie sich die URL aus der Ausgabe; dies ist Ihre Backend-API-Adresse.
Initialisieren Sie die Datenbank (automatisch) Besuchen Sie Ihre Worker-URL, um die Initialisierung auszulösen:
https://cloudpaste-backend.your-username.workers.dev
⚠️ Sicherheitshinweis: Bitte ändern Sie das Standard-Administratorpasswort unmittelbar nach der Systeminitialisierung (Benutzername: admin, Passwort: admin123).
Bereiten Sie den Frontend-Code vor
cd CloudPaste/frontend
npm install
Konfigurieren Sie Umgebungsvariablen
Erstellen oder ändern Sie die .env.production
-Datei:
VITE_BACKEND_URL=https://cloudpaste-backend.your-username.workers.dev
VITE_APP_ENV=production
VITE_ENABLE_DEVTOOLS=false
Bauen Sie das Frontend-Projekt
npm run build
Stellen Sie auf Cloudflare Pages bereit
Methode 1: Über Wrangler CLI
npx wrangler pages deploy dist --project-name=cloudpaste-frontend
Methode 2: Über Cloudflare Dashboard
dist
-Verzeichnis hochBereiten Sie den Frontend-Code vor
cd CloudPaste/frontend
npm install
Installieren und melden Sie sich bei Vercel CLI an
npm install -g vercel
vercel login
Konfigurieren Sie Umgebungsvariablen, wie für Cloudflare Pages
Bauen und bereitstellen
vercel --prod
Folgen Sie den Anweisungen, um das Projekt zu konfigurieren.
Registrierungslink: Claw Cloud (kein #AFF) Keine Kreditkarte erforderlich, solange Ihr GitHub-Registrierungsdatum mehr als 180 Tage zurückliegt, erhalten Sie jeden Monat $5 Guthaben.
Nach der Registrierung klicken Sie auf der Startseite auf APP Launchpad und dann rechts oben auf "create app"
Zuerst stellen Sie das Backend bereit, wie in der Abbildung gezeigt (nur zur Veranschaulichung):
Backend-Datenspeicherung befindet sich hier:
Dann das Frontend, wie in der Abbildung gezeigt (nur zur Veranschaulichung):
CloudPaste-Backend kann schnell mit dem offiziellen Docker-Image bereitgestellt werden.
Erstellen Sie ein Datenverzeichnis
mkdir -p sql_data
Führen Sie den Backend-Container aus
docker run -d --name cloudpaste-backend \
-p 8787:8787 \
-v $(pwd)/sql_data:/data \
-e ENCRYPTION_SECRET=your-encryption-key \
-e NODE_ENV=production \
-e RUNTIME_ENV=docker \
dragon730/cloudpaste-backend:latest
Notieren Sie sich die Bereitstellungs-URL (z.B. http://your-server-ip:8787
), die für die Frontend-Bereitstellung benötigt wird.
⚠️ Sicherheitstipp: Passen Sie ENCRYPTION_SECRET unbedingt an und bewahren Sie es sicher auf, da dieser Schlüssel zur Verschlüsselung sensibler Daten verwendet wird.
Das Frontend verwendet Nginx zum Bereitstellen und konfiguriert die Backend-API-Adresse beim Start.
docker run -d --name cloudpaste-frontend \
-p 80:80 \
-e BACKEND_URL=http://your-server-ip:8787 \
dragon730/cloudpaste-frontend:latest
⚠️ Hinweis: BACKEND_URL muss die vollständige URL enthalten (einschließlich Protokoll http:// oder https://) ⚠️ Sicherheitshinweis: Bitte ändern Sie das Standard-Administratorpasswort unmittelbar nach der Systeminitialisierung (Benutzername: admin, Passwort: admin123).
Wenn eine neue Version des Projekts veröffentlicht wird, können Sie Ihre Docker-Bereitstellung wie folgt aktualisieren:
Laden Sie die neuesten Images herunter
docker pull dragon730/cloudpaste-backend:latest
docker pull dragon730/cloudpaste-frontend:latest
Stoppen und entfernen Sie alte Container
docker stop cloudpaste-backend cloudpaste-frontend
docker rm cloudpaste-backend cloudpaste-frontend
Starten Sie neue Container mit den gleichen Run-Befehlen wie oben (unter Beibehaltung des Datenverzeichnisses und der Konfiguration)
Die Verwendung von Docker Compose ermöglicht die Bereitstellung sowohl von Frontend- als auch Backend-Diensten mit einem Klick, was die einfachste empfohlene Methode ist.
docker-compose.yml
-Dateiversion: "3.8"
services:
frontend:
image: dragon730/cloudpaste-frontend:latest
environment:
- BACKEND_URL=https://xxx.com # Fill in the backend service address
ports:
- "8080:80" #"127.0.0.1:8080:80"
depends_on:
- backend # Depends on backend service
networks:
- cloudpaste-network
restart: unless-stopped
backend:
image: dragon730/cloudpaste-backend:latest
environment:
- NODE_ENV=production
- RUNTIME_ENV=docker
- PORT=8787
- ENCRYPTION_SECRET=custom-key # Please modify this to your own security key
volumes:
- ./sql_data:/data # Data persistence
ports:
- "8787:8787" #"127.0.0.1:8787:8787"
networks:
- cloudpaste-network
restart: unless-stopped
networks:
cloudpaste-network:
driver: bridge
docker-compose up -d
⚠️ Sicherheitshinweis: Bitte ändern Sie das Standard-Administratorpasswort unmittelbar nach der Systeminitialisierung (Benutzername: admin, Passwort: admin123).
Frontend: http://your-server-ip:80
Backend: http://your-server-ip:8787
Wenn Sie auf eine neue Version aktualisieren müssen:
Laden Sie die neuesten Images herunter
docker-compose pull
Erstellen Sie Container mit neuen Images neu (unter Beibehaltung von Datenvolumes)
docker-compose up -d --force-recreate
💡 Tipp: Bei Konfigurationsänderungen müssen Sie möglicherweise Daten sichern und die docker-compose.yml-Datei ändern
server {
listen 443 ssl;
server_name paste.yourdomain.com; # Replace with your domain name
# SSL certificate configuration
ssl_certificate /path/to/cert.pem; # Replace with certificate path
ssl_certificate_key /path/to/key.pem; # Replace with key path
# Frontend proxy configuration
location / {
proxy_pass http://localhost:80; # Docker frontend service address
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
}
# Backend API proxy configuration
location /api {
proxy_pass http://localhost:8787; # Docker backend service address
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
client_max_body_size 0;
# WebSocket support (if needed)
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
# WebDAV Configuration
location /dav {
proxy_pass http://localhost:8787/dav; # Points to your backend service
# WebDAV necessary headers
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# WebDAV method support
proxy_pass_request_headers on;
# Support all WebDAV methods
proxy_method $request_method;
# Necessary header processing
proxy_set_header Destination $http_destination;
proxy_set_header Overwrite $http_overwrite;
# Handle large files
client_max_body_size 0;
# Timeout settings
proxy_connect_timeout 3600s;
proxy_send_timeout 3600s;
proxy_read_timeout 3600s;
}
}
⚠️ Sicherheitstipp: Es wird empfohlen, HTTPS und einen Reverse-Proxy (wie Nginx) zu konfigurieren, um die Sicherheit zu erhöhen.
Melden Sie sich beim Cloudflare Dashboard an
Klicken Sie auf R2 Storage und erstellen Sie einen Bucket.
Erstellen Sie einen API-Token
Speichern Sie alle Daten nach der Erstellung; Sie werden sie später benötigen
Konfigurieren Sie Cross-Origin-Regeln: Klicken Sie auf den entsprechenden Bucket, klicken Sie auf Einstellungen, bearbeiten Sie die CORS-Richtlinie wie unten gezeigt:
[
{
"AllowedOrigins": ["http://localhost:3000", "https://replace-with-your-frontend-domain"],
"AllowedMethods": ["GET", "PUT", "POST", "DELETE", "HEAD"],
"AllowedHeaders": ["*"],
"ExposeHeaders": ["ETag"],
"MaxAgeSeconds": 3600
}
]
Wenn Sie kein B2-Konto haben, registrieren Sie zuerst eines, dann erstellen Sie einen Bucket.
Klicken Sie in der Seitenleiste auf Application Key, klicken Sie auf Create Key und folgen Sie der Abbildung.
Konfigurieren Sie B2 Cross-Origin; die B2 Cross-Origin-Konfiguration ist komplexer, beachten Sie dies
Sie können zuerst Option 1 oder 2 ausprobieren, gehen Sie zur Upload-Seite und prüfen Sie, ob Sie hochladen können. Wenn die F12-Konsole Cross-Origin-Fehler anzeigt, verwenden Sie Option 3. Für eine dauerhafte Lösung verwenden Sie direkt Option 3.
Bezüglich der Option 3-Konfiguration, da das Panel dies nicht konfigurieren kann, müssen Sie manuell konfigurieren, indem Sie das B2 CLI-Tool herunterladen. Weitere Details finden Sie unter: "https://docs.cloudreve.org/zh/usage/storage/b2".
Nach dem Herunterladen geben Sie im entsprechenden Download-Verzeichnis CMD die folgenden Befehle ein:
b2-windows.exe account authorize //Log in to your account, following prompts to enter your keyID and applicationKey
b2-windows.exe bucket get <bucketName> //You can execute to get bucket information, replace <bucketName> with your bucket name
Windows-Konfiguration, Verwenden Sie ".\b2-windows.exe xxx", Python CLI wäre ähnlich:
b2-windows.exe bucket update <bucketName> allPrivate --cors-rules "[{\"corsRuleName\":\"CloudPaste\",\"allowedOrigins\":[\"*\"],\"allowedHeaders\":[\"*\"],\"allowedOperations\":[\"b2_upload_file\",\"b2_download_file_by_name\",\"b2_download_file_by_id\",\"s3_head\",\"s3_get\",\"s3_put\",\"s3_post\",\"s3_delete\"],\"exposeHeaders\":[\"Etag\",\"content-length\",\"content-type\",\"x-bz-content-sha1\"],\"maxAgeSeconds\":3600}]"
Ersetzen Sie mit Ihrem Bucket-Namen. Für allowedOrigins in der Cross-Origin-Erlaubnis können Sie basierend auf Ihren Bedürfnissen konfigurieren; hier erlaubt es alles.
MinIO Server bereitstellen
Verwenden Sie die folgende Docker Compose-Konfiguration (Referenz), um MinIO schnell bereitzustellen:
version: "3"
services:
minio:
image: minio/minio:RELEASE.2025-02-18T16-25-55Z
container_name: minio-server
command: server /data --console-address :9001 --address :9000
environment:
- MINIO_ROOT_USER=minioadmin # Admin-Benutzername
- MINIO_ROOT_PASSWORD=minioadmin # Admin-Passwort
- MINIO_BROWSER=on
- MINIO_SERVER_URL=https://minio.example.com # S3 API-Zugriffs-URL
- MINIO_BROWSER_REDIRECT_URL=https://console.example.com # Konsolen-Zugriffs-URL
ports:
- "9000:9000" # S3 API-Port
- "9001:9001" # Konsolen-Port
volumes:
- ./data:/data
- ./certs:/root/.minio/certs # SSL-Zertifikate (falls benötigt)
restart: always
Führen Sie docker-compose up -d
aus, um den Dienst zu starten.
Reverse-Proxy konfigurieren (Referenz)
Um sicherzustellen, dass MinIO korrekt funktioniert, insbesondere Dateivorschauen, konfigurieren Sie den Reverse-Proxy ordnungsgemäß. Empfohlene OpenResty/Nginx-Einstellungen:
MinIO S3 API Reverse-Proxy (minio.example.com):
location / {
proxy_pass http://127.0.0.1:9000;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
# HTTP-Optimierung
proxy_http_version 1.1;
proxy_set_header Connection ""; # HTTP/1.1 Keepalive aktivieren
# Kritisch: Behebt 403-Fehler & Vorschauprobleme
proxy_cache off;
proxy_buffering off;
proxy_request_buffering off;
# Keine Dateigrößenbeschränkung
client_max_body_size 0;
}
MinIO Console Reverse-Proxy (console.example.com):
location / {
proxy_pass http://127.0.0.1:9001;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
# WebSocket-Unterstützung
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# Kritische Einstellungen
proxy_cache off;
proxy_buffering off;
# Keine Dateigrößenbeschränkung
client_max_body_size 0;
}
Auf Konsole zugreifen, um Buckets & Zugriffsschlüssel zu erstellen
Detaillierte Konfiguration finden Sie in der offiziellen Dokumentation:
https://min.io/docs/minio/container/index.html
CN: https://min-io.cn/docs/minio/container/index.html
Zusätzliche Konfiguration (Optional)
Erlaubte Ursprünge müssen Ihre Frontend-Domain enthalten.
MinIO in CloudPaste konfigurieren
https://minio.example.com
)Fehlerbehebung
proxy_set_header Accept-Encoding "identity"
hinzufügen, und es gibt Caching-Probleme zu beachten. Es wird empfohlen, nur DNS-Auflösung zu verwenden.proxy_cache off
& proxy_buffering off
enthältMINIO_SERVER_URL
& MINIO_BROWSER_REDIRECT_URL
korrekt gesetzt sindConnection "upgrade"
CloudPaste bietet einfache WebDAV-Protokollunterstützung, mit der Sie Speicherbereiche als Netzwerklaufwerke einbinden können, um bequem über Dateimanager auf Dateien zuzugreifen und sie zu verwalten.
https://your-backend-domain/dav
Verwenden Sie Administrator-Benutzername und Passwort, um direkt auf den WebDAV-Dienst zuzugreifen:
Für eine sicherere Zugriffsmethode wird empfohlen, einen dedizierten API-Schlüssel zu erstellen:
Wenn Sie NGINX als Reverse-Proxy verwenden, müssen spezifische WebDAV-Konfigurationen hinzugefügt werden, um sicherzustellen, dass alle WebDAV-Methoden korrekt funktionieren:
# WebDAV Configuration
location /dav {
proxy_pass http://localhost:8787; # Points to your backend service
# WebDAV necessary headers
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# WebDAV method support
proxy_pass_request_headers on;
# Support all WebDAV methods
proxy_method $request_method;
# Necessary header processing
proxy_set_header Destination $http_destination;
proxy_set_header Overwrite $http_overwrite;
# Handle large files
client_max_body_size 0;
# Timeout settings
proxy_connect_timeout 3600s;
proxy_send_timeout 3600s;
proxy_read_timeout 3600s;
}
Verbindungsprobleme:
Berechtigungsfehler:
⚠️⚠️ WebDAV-Upload-Probleme:
Server Direct File Upload API-Dokumentation - Detaillierte Beschreibung der Server-Direktdatei-Upload-Schnittstelle
Projekt-Repository klonen
git clone https://github.com/ling-drag0n/cloudpaste.git
cd cloudpaste
Backend einrichten
cd backend
npm install
# D1-Datenbank initialisieren
wrangler d1 create cloudpaste-db
wrangler d1 execute cloudpaste-db --file=./schema.sql
Frontend einrichten
cd frontend
npm install
Umgebungsvariablen konfigurieren
backend
-Verzeichnis erstellen Sie eine wrangler.toml
-Datei, um Entwicklungsumgebungsvariablen festzulegenfrontend
-Verzeichnis konfigurieren Sie die .env.development
-Datei, um Frontend-Umgebungsvariablen festzulegenEntwicklungsserver starten
# Backend
cd backend
npm run dev
# Frontend (in einem anderen Terminal)
cd frontend
npm run dev
CloudPaste/
├── frontend/ # Frontend Vue.js application
│ ├── src/ # Source code
│ │ ├── components/ # Vue components
│ │ ├── api/ # API clients and services
│ │ ├── i18n/ # Internationalization resource files
│ │ ├── utils/ # Utility functions
│ │ └── assets/ # Static assets
│ └── ...
└── backend/ # Cloudflare Workers backend
├── worker.js # Main Worker file
├── schema.sql # D1 database schema
└── ...
Wenn Sie Docker-Images anpassen oder während der Entwicklung debuggen möchten, können Sie diese Schritte zum manuellen Build befolgen:
Backend-Image erstellen
# Im Projektstammverzeichnis ausführen
docker build -t cloudpaste-backend:custom -f docker/backend/Dockerfile .
# Das benutzerdefinierte Image ausführen
docker run -d --name cloudpaste-backend \
-p 8787:8787 \
-v $(pwd)/sql_data:/data \
-e ENCRYPTION_SECRET=development-test-key \
cloudpaste-backend:custom
Frontend-Image erstellen
# Im Projektstammverzeichnis ausführen
docker build -t cloudpaste-frontend:custom -f docker/frontend/Dockerfile .
# Das benutzerdefinierte Image ausführen
docker run -d --name cloudpaste-frontend \
-p 80:80 \
-e BACKEND_URL=http://localhost:8787 \
cloudpaste-frontend:custom
Entwicklungsumgebung Docker Compose
Erstellen Sie eine docker-compose.dev.yml
-Datei:
version: "3.8"
services:
frontend:
build:
context: .
dockerfile: docker/frontend/Dockerfile
environment:
- BACKEND_URL=http://backend:8787
ports:
- "80:80"
depends_on:
- backend
backend:
build:
context: .
dockerfile: docker/backend/Dockerfile
environment:
- NODE_ENV=development
- RUNTIME_ENV=docker
- PORT=8787
- ENCRYPTION_SECRET=dev_secret_key
volumes:
- ./sql_data:/data
ports:
- "8787:8787"
Starten Sie die Entwicklungsumgebung:
docker-compose -f docker-compose.yml up --build
Apache License 2.0
Dieses Projekt ist unter der Apache License 2.0 lizenziert - siehe LICENSE für Details.
Sponsoring: Die Pflege eines Projekts ist nicht einfach. Wenn Ihnen dieses Projekt gefällt, erwägen Sie, dem Autor eine kleine Ermutigung zu geben. Jeder Teil Ihrer Unterstützung ist meine Motivation, weiterzumachen~
Wenn Sie das Projekt gut finden, hoffe ich, dass Sie einen kostenlosen Star✨✨ geben können, Vielen Dank!