file-r2-worker 文件保管站 Cloudflare R2对象存储

前言

但 R2 的管理页面并不那么直观地看到图片预览.
R2控制台里r2test-1存储桶的Objects页面

我们可以用 worker 来管理

实践

考虑到图片可能会很多, 很大, 推荐设置 Cloudflare 的  Image Transformation 功能

首先, 你需要有一个托管在cloudflare的域名.

打开 Image Transformation 功能

Cloudflare开启Image Transformation做缩略图

给 R2 设置自定义域名

还记得这个页面吗?
给R2配自定义域名,输入你域名的子域名

输入一个你的域名的子域名. 如, r2test.xxxx.xxxx
过一会儿, 会变成这个样子, 说明生效了.
自定义域名生效,状态Active且访问Enabled

设置 CORS 策略

R2桶的CORS策略填允许跨域的JSON再保存
[
  {
    "AllowedOrigins": [
      "*"
    ],
    "AllowedMethods": [
      "PUT",
      "GET",
      "HEAD",
      "DELETE"
    ],
    "AllowedHeaders": [
      "*"
    ]
  }
]
* 注, 说实话这里有一点点粗暴, 但是问题不大. 

你现在的R2的一些信息

在 ShareX 的 S3 上传器页面.
Access key ID
Secret access key
Endpoint
Bucket name
Custom domain
ShareX的S3上传器填密钥、Endpoint与自定义域名

创建一个Cloudflare Worker

Workers & Pages里点Create application新建Worker

选Start with Hello World创建

给Worker取名后点Deploy部署

编辑Worker的脚本内容

部署完点Edit code编辑Worker脚本

把原有的内容全部删掉

把模板脚本全删掉,换成file-r2-worker的worker.js

换成:https://github.com/crazypeace/file-r2-worker/blob/main/worker.js 的内容

修改管理面板访问密码:
WORKER_PASSWORD = "suibianshezhishenme"   // 改成你喜欢的
改WORKER_PASSWORD设置管理面板访问密码

设置 R2 参数
按ShareX里的S3参数填worker.js的R2变量
* ShareX 的 S3 上传器页面中, Secret access key 是复制不出来的

保存并部署

右上角
改完脚本点右上角保存并部署

使用 file-r2-worker 文件保管站

用浏览器访问你的 worker域名  或 点击 visit 链接
点Visit打开worker网址

显示 404 这是正常的功能,  设置了密码不对外公开使用.
直接访问worker域名显示404,是密码保护的效果

在 worker 域名后 添加 密码作为 path , 如  
https://divine-voice-e752.crazypeace.workers.dev/suibianshezhishenme
这时界面就正常了
域名后加密码path才进入上传管理页面

如果你的R2里面已经保存了文件, 你可以点击 "load R2 to localStorage" 按钮.

如果你想删除哪个图片, 点 X 按钮就行.
管理页面可load R2到localStorage或点X删图

========

后记

如果你想用 Cloudflare 的  Image Transformation 功能生成缩略图, R2_PUBLIC_URL 要使用你的 R2的自定义域名

如果你想多人共用, 那么就只在这个管理页面上传, 这样每个人只在列表中看到自己上传的图片. 同时, 设置
LOAD_R2_BUTTON = "false" 

多人共用时把LOAD_R2_BUTTON设为false防误读
 

这样就不会通过 load R2 按钮读取别人上传的图片.
* 不过, 管理页面其实是有R2的 api token的, 可以用这个来操作R2, 所以你只能和信任的人共用. 页面上禁用 load R2 按钮, 只是防误操作.

========

相关推荐


评论