V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
740moe
V2EX  ›  分享发现

利用 CloudFlare R2 搭建图床/视频床!无服务器快速部署!

  •  
  •   740moe · 3 天前 · 767 次点击

    支持 worker && pages 部署!使用 pages 部署可以 fork 仓库,或者下载_worker.js 文件打包成压缩文件上传!

    免费套餐介绍

    • 存储: 每月 10 GB
    • A 类操作: 每月 100 万次请求
    • B 类操作: 每月 1000 万次请求
    • 出口(数据传输到互联网): 免费

    个人使用完全足够!图床默认开启压缩,可以储存更多的图片文件!

    功能特点

    • 查看本地历史记录
    • 可选的访客验证功能
    • 单文件最大支持 20MB
    • 支持多文件上传和粘贴上传
    • 支持批量操作和显示上传时间
    • 图片自动压缩( GIF 和视频除外)
    • Cloudflare Cache API 缓存支持
    • 基于 Cloudflare R2 的文件存储
    • 支持多种链接格式( URL 、BBCode 、Markdown )
    • 支持常见的图片和视频格式( jpg 、png 、gif 、mp4 )

    部署教程:

    1. 环境变量说明

    需要在 Cloudflare Workers 中配置以下环境变量:

    变量名 说明 必填 示例
    DOMAIN 自定义域名 example.workers.dev
    DATABASE D1 数据库绑定变量名称 DATABASE
    USERNAME 管理员用户名 admin
    PASSWORD 管理员密码 password123
    ADMIN_PATH 管理后台路径 admin
    ENABLE_AUTH 访客验证(设置为 true 开启,不设置或设置为 false 则关闭) false
    R2_BUCKET R2 存储桶名称 R2_BUCKET

    2. 创建 R2 存储桶

    1. 登录 Cloudflare Dashboard
    2. 进入 R2 对象储存创建存储桶
    3. 设置存储桶名称和区域
    4. 保存存储桶的名称以便后续使用

    3. 创建 D1 数据库

    1. 登录 Cloudflare Dashboard
    2. 进入 Workers & PagesD1 SQL 数据库
    3. 点击 创建 创建数据库
      • 数据库名称可自定义,例如 images
      • 建议选择数据库位置为 亚太地区,可以获得更好的访问速度
    4. 创建数据表:
      • 点击数据库名称进入详情页
      • 选择 控制台 标签
      • 执行以下 SQL 语句:
    CREATE TABLE media (
        url TEXT PRIMARY KEY
    );
    

    4. 创建 Worker

    1. 进入 Workers & Pages
    2. 点击 创建
    3. 选择 创建 Worker
    4. 为 Worker 设置一个名称
    5. 点击 部署 创建 Worker
    6. 点击继续处理项目

    5. 配置环境变量

    1. 在 Worker 的 设置变量和机密
    2. 点击 添加 添加变量
    3. 点击 部署

    6. 绑定数据库和 R2 储存

    1. 在 Worker 设置页面找到 设置绑定
    2. 点击 添加
    3. 选择 D1 数据库
    4. 设置变量名为 DATABASE
    5. 选择之前创建的数据库
    6. 点击 部署
    7. 重复上述步骤绑定 R2 储存,变量名为 R2_BUCKET

    7. 绑定域名

    1. 在 Worker 的 设置域和路由
    2. 点击 添加自定义域
    3. 输入你在 Cloudflare 绑定的域名
    4. 点击 添加域
    5. 等待域名生效

    8. 部署代码

    1. 进入 Worker 的编辑页面
    2. _worker.js 的完整代码复制粘贴到编辑器中
    3. 点击 部署

    9. 配置缓存

    1. 进入 Cloudflare Dashboard
    2. 进入 网站选择你的自定义域名缓存Cache Rules创建缓存规则
    3. 选择 缓存所有内容模板
    4. 设置 边缘 TTL忽略缓存控制标头,使用此 TTL30 天(根据需要设置)
    5. 点击 部署

    源码: https://github.com/0-RTT/JSimages

    测试: image

    image

    9 条回复    2024-12-19 23:48:21 +08:00
    mayli
        1
    mayli  
       3 天前
    域名不错
    hanguofu
        2
    hanguofu  
       3 天前
    谢谢分享。请问在哪里可以设置 访问图床/视频床的频次 ?
    740moe
        3
    740moe  
    OP
       3 天前
    @hanguofu cf 的防火墙配置规则估计可以
    Lunrry
        4
    Lunrry  
       2 天前
    按照你的步骤来,上传图片报错:R2 上传错误: TypeError: R2_BUCKET.put is not a function
    at handleUploadRequest (worker.js:881:21)
    at async Object.fetch (worker.js:20:44)
    at async jsonError (.internal-0c998967-b…e-facade-1.js:12:12)
    at async jsonError (.internal-0c998967-b…e-facade-1.js:12:12)
    at async jsonError (.internal-0c998967-b…e-facade-1.js:12:12)
    at async jsonError (.internal-0c998967-b…e-facade-1.js:12:12)
    740moe
        5
    740moe  
    OP
       2 天前
    @Lunrry 估计变量没对。照着 readme 弄下吧。我更新了下部署的流程。https://github.com/0-RTT/JSimages/blob/main/README
    Lunrry
        6
    Lunrry  
       2 天前
    @740moe #5 现在可以使用了,请问有将其接入到 picgo 的方案吗
    liulicaixiao
        7
    liulicaixiao  
       1 天前
    op 的域名: https://baipiao.de/ 非常好
    740moe
        8
    740moe  
    OP
       1 天前
    @Lunrry 目前没有,让 gpt 帮你试试。我没用过 picgo
    740moe
        9
    740moe  
    OP
       1 天前
    @liulicaixiao 嘿嘿👍
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2579 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 11:20 · PVG 19:20 · LAX 03:20 · JFK 06:20
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.