linux

用cloudflare worker + r2作为twikoo评论图床！不要钱的兼容s3的存储方案

前言

twikoo的评论需要用到的上传图床基本都有各种限制，比如sm.ms只提供5GB的存储，7bu图床需要花钱买，qcloud是腾讯的，不太想用而且要花钱，lsky-pro兰空图床部署需要用到数据库，可是我已经决定用hexo+twikoo搭建一个serverless博客了，还要用到数据库，还需要公网ip服务器，这就本末倒置了。

转念一想既然可以对接兰空图床自定义url，那么我就写一个api兼容兰空图床的api，对接cloudflare r2，这样不就变成免费的10GB额度方案了吗

于是我决定写一个cloudflare worker + cloudflare r2去对接目前lsky-pro对应的端口，然后填上url，返回对应结果

分析接口返回的数据

查看twikoo源码，对应的上传图床部分

  async uploadImageToLskyPro ({ photo, fileName, config, res, imageCdn }) {
    // 自定义兰空图床（v2）URL
    const formData = new FormData()
    formData.append('file', fn.base64UrlToReadStream(photo, fileName))
    if (process.env.TWIKOO_LSKY_STRATEGY_ID) {
      formData.append('strategy_id', parseInt(process.env.TWIKOO_LSKY_STRATEGY_ID))
    }
    const url = `${imageCdn}/api/v1/upload`
    let token = config.IMAGE_CDN_TOKEN
    if (!token.startsWith('Bearer')) {
      token = `Bearer ${token}`
    }
    const uploadResult = await axios.post(url, formData, {
      headers: {
        ...formData.getHeaders(),
        Authorization: token
      }
    })
    if (uploadResult.data.status) {
      res.data = uploadResult.data.data
      res.data.url = res.data.links.url
    } else {
      throw new Error(uploadResult.data.message)
    }
  }

直接定位,接受一个form传参
formData.append('file', fn.base64UrlToReadStream(photo, fileName))
需要的返回值为
uploadResult.data.status
uploadResult.data.data.links.url

返回示例

{
  "status": true,
  "data": {
      "links" : {
        "url": "<r2图床地址>"
      }
  }
}

endpoint	method	data
/api/v1/upload	POST	同上

这里还可以加个auth请求头认证防止盗用

分析完了接下来开始写worker

worker代码

首先创建一个新项目

wrangler init twikoo-worker

修改wrangler.toml的配置，让其绑定r2存储桶及变量

#:schema node_modules/wrangler/config-schema.json
name = "twikoo-worker"
main = "src/index.js"
compatibility_date = "2024-12-05"
compatibility_flags = ["nodejs_compat"]

[observability]
enabled = true

[vars]
BUCKET_URL = "https://bucket.voidval.com"
# 修改你的bucket url，指向你的r2 存储桶

[[r2_buckets]]
binding = "MY_BUCKET"
bucket_name = "bucket1"  # 修改为你图床的bucket名称

根据刚才的接口写worker，修改twikoo-worker/src/index.js

const hasValidHeader = (request, env) => {
    return request.headers.get("Authorization") === "Bearer " + env.AUTH_KEY_SECRET;
  };
  
  
  export default {
    async fetch(request, env, ctx) {
      const url = new URL(request.url);
      if (!hasValidHeader(request, env))
          return new Response("Not permitted.", { status: 401 });
      if (request.method !== "POST") return new Response("Method not permitted.", { status: 401 });
      if (url.pathname !== "/api/v1/upload"){
          return new Response("Path not permitted", { status: 401 });
      }
  
      const formData = await request.formData()
      const photo = await formData.get('file')
      if (!photo) return new Response("Invalid File upload.", { status: 401 });
      await env.MY_BUCKET.put("comment/upload/" + photo.name, photo.stream());
      const responseObject = {
            "status": true,
            "data": {
                "links" : {
                  "url": env.BUCKET_URL + "/comment/upload/" + photo.name
                }
            }
        }
  
      const headers =  {
          'Access-Control-Allow-Origin': '*', // Or your specific origin
          'content-type': 'application/json;charset=UTF-8',
      }
  
      return Response.json(responseObject, {
          headers: headers
      });
  
    },
  };

这里对r2存储桶的操作是根据cloudflare api文档找到的，英语不好很麻烦所以一定要学好英语

现在带着大家分析一下api文档，如果你对此不感兴趣可以跳过

r2 api文档定义