Featured image of post Cloudpaste部署——在线剪贴板、图床、文件中转站

Cloudpaste部署——在线剪贴板、图床、文件中转站

基于 Cloudflare 的在线剪贴板和文件分享服务

随便写写 ~ 项目在下面:

基于 Cloudflare 的在线剪贴板和文件分享服务,支持 Markdown 编辑和文件上传
JavaScript

✨ 特点

📝 Markdown 编辑与分享

  • 强大的编辑器:集成 Vditor,支持 GitHub 风格的 Markdown、数学公式、流程图、思维导图等
  • 安全分享:内容可设置访问密码保护
  • 灵活时效:支持设置内容过期时间
  • 访问控制:可限制最大查看次数
  • 个性化:自定义分享链接及备注
  • 支持文本 Raw 直链:类似 gihub 的 Raw 直链,用于 yaml 配置文件来启动的服务
  • 多格式导出:支持 PDF、Markdown、HTML、PNG 图片、Word 文档 导出
  • 便捷分享:一键复制分享链接和生成二维码
  • 自动保存:支持自动保存草稿功能

📤 文件上传与管理

  • 多存储支持:兼容多种 S3 存储服务 (Cloudflare R2、Backblaze B2、AWS S3 等)
  • 存储配置:可视化界面配置多个存储空间,灵活切换默认存储源
  • 高效上传:通过预签名 URL 直接上传至 S3 存储,多文件上传
  • 实时反馈:上传进度实时显示
  • 自定义限制:单次上传限制和最大容量限制
  • 元数据管理:文件备注、密码、过期时间、访问限制
  • 数据分析:文件访问统计与趋势分析
  • 服务器直传:支持调接口进行文件上传、下载等操作

🛠 便捷的文件/文本操作

  • 统一管理:支持文件/文本创建、删除和属性修改
  • 在线预览:常见文档、图片和媒体文件的在线预览与直链生成
  • 分享工具:生成短链接和二维码,便于跨平台分享
  • 批量管理:文件/文本批量操作与显示

🔄 WebDAV 和挂载点管理

  • WebDAV 协议支持:通过标准 WebDAV 协议访问和管理文件系统
  • 网络驱动器挂载:支持 部分第三方客户端直接挂载
  • 灵活的挂载点:支持创建多个挂载点,连接不同的存储服务
  • 权限控制:精细的挂载点访问权限管理
  • API 密钥集成:通过 API 密钥授权 WebDAV 访问
  • 大文件支持:自动使用分片上传机制处理大文件
  • 目录操作:完整支持目录创建、上传、删除、重命名等操作

🔐 轻量权限管理

管理员权限控制

  • 系统管理:全局系统设置配置
  • 内容审核:所有用户内容的管理
  • 存储管理:S3 存储服务的添加、编辑与删除
  • 权限分配:API 密钥的创建与权限管理
  • 数据分析:完整的统计数据访问

API 密钥权限控制

  • 文本权限:创建/编辑/删除文本内容
  • 文件权限:上传/管理/删除文件
  • 存储权限:可选择特定的存储配置
  • 读写分离:可设置只读或读写权限
  • 时效控制:自定义有效期(从小时到月)
  • 安全机制:自动失效与手动撤销功能

💫 系统功能

  • 适配性强:响应式设计,适配移动设备和桌面
  • 多语言:中/英文双语界面支持
  • 视觉模式:明亮/暗黑主题切换
  • 安全认证:基于 JWT 的管理员认证系统
  • 离线体验:PWA 支持,可离线使用和安装到桌面

🚀 部署教程

前期准备

在开始部署前,请确保您已准备以下内容:

  • Cloudflare 账号(必需)
  • 如使用 R2:开通 Cloudflare R2 服务并创建存储桶(需绑定支付方式)
  • 其他 S3 存储服务的配置信息:
    • S3_ACCESS_KEY_ID
    • S3_SECRET_ACCESS_KEY
    • S3_BUCKET_NAME
    • S3_ENDPOINT

开始部署

获取 Cloudflare API 令牌

  1. 访问 Cloudflare Dashboard
  2. 创建新的 API 令牌
  3. 选择"编辑 Cloudflare Workers"模板,并添加 D1 数据库编辑权限

  1. 获取cloudflare account ID:

配置 GitHub 仓库

  1. Fork 或克隆仓库 https://github.com/ling-drag0n/CloudPaste
  2. 进入您的 GitHub 仓库设置
  3. 转到 Settings → Secrets and variables → Actions → New Repository secrets
  4. 添加以下 Secrets:
Secret 名称 必需 用途
CLOUDFLARE_API_TOKEN Cloudflare API 令牌(需要 Workers、D1 和 Pages 权限)
CLOUDFLARE_ACCOUNT_ID Cloudflare 账户 ID
ENCRYPTION_SECRET 用于加密敏感数据的密钥(如不提供,将自动生成)

  1. 后端部署:

  1. 然后按照同样的步骤,部署前端:

  1. 后端部署完成后,在cloudflare pages里查看后端地址:

  1. 复制地址,回到前端 Cloudflare Pages 控制面板设置环境变量:

  • 名称:VITE_BACKEND_URL
  • 值:刚刚部署的后端 Worker URL(如 https://cloudpaste-backend.your-username.workers.dev),末尾不带"/", 同时建议使用自定义的 worker 后端域名。
  • 一定要完整的填写后端域名, https://xxxx.com 格式
  1. 重要步骤: 随后要再次运行一遍前端的工作流,以便完成后端域名加载!!!

⚠️ 安全提示:请在系统初始化后立即修改默认管理员密码(用户名: admin, 密码: admin123)。

R2 API 相关获取及跨域配置

  1. 登录 Cloudflare Dashboard
  2. 点击 R2 存储,创建一个存储桶
  3. 创建 API 令牌

  1. 创建后把全部数据都保存好,后续要填写密钥ID和密钥
  2. 配置跨域规则:点击对应存储桶,点击设置,编辑 CORS 策略,如下所示:
1[
2  {
3    "AllowedOrigins": ["http://localhost:3000", "https://根据自己的前端域名来替代"],
4    "AllowedMethods": ["GET", "PUT", "POST", "DELETE", "HEAD"],
5    "AllowedHeaders": ["*"],
6    "ExposeHeaders": ["ETag"],
7    "MaxAgeSeconds": 3600
8  }
9]
注意!!!
编辑 CORS 策略那一块的前端域名最后不能有 /,否则跨域配置会失败!我配置报错查了好久都没查到什么原因,最后莫名把反斜杠去掉就好了。

最后在管理页配置一下s3存储和挂载,就可以当文件中转站使用啦!

Licensed under CC BY-NC-SA 4.0
最后更新于 2025-09-16 11:05 +0800
给博主施舍一个赞吧(;へ:) ❤️