szgislle: " 前言上一章我们已经做到了使用picgo上传图片并获得一个可以公开访问的链接，这章介绍如何使用CloudFlare代"

xFeedBeta

@szgislle-7359

szgislle·2 years ago

前言

上一章我们已经做到了使用picgo上传图片并获得一个可以公开访问的链接，这章介绍如何使用CloudFlare代理图片的访问并加上自定义域名，以及录屏转gif的应用。

CloudFlare代理访问

创建一个Cloudflare Workers，代码如下：

export default {

  async fetch(request, env) {

    const url = new URL(request.url);

    const path = url.pathname.replace('/blog/', '')

    const originUrl = `${env.OBJECT_STORAGE_BASE_URL}${path}${url.search}`;

    const res = await fetch(originUrl)

    return new Response(res.body);

  },

};

以上代码功能是将访问的url去掉存储桶名称，通过workers获取内容并返回给访问者，充当了一个代理的角色，这样我们可以使用自定义的域名来替代甲骨文对象存储的访问域名，以后换了图床供应商也方便切换，因为博客里的链接是不用改的。

部署完之后需要配置环境变量OBJECT_STORAGE_BASE_URL的值为上文的访问地址，一直到/o/处，如：

现在你可以使用works提供的域名作为图片前缀访问，也可以自定义域名，该功能只限于你自己的域名是由CloudFlare托管解析的才可，如果已经使用CloudFlare作为域名解析商，在works配置的Custom Domains配置即可，CloudFlare会自动生成Https证书。

配置好之后将picgo的配置文件的urlPrefix改为上面的域名：

{
    "aws-sr3": {
      "accessKeyID": "{ak}",
      "secretAccessKey": "{sk}",
      "bucketName": "blog",
      "region": "ap-chuncheon-1",
      "uploadPath": "images/{year}/{month}/{md5}.{extName}",
      "endpoint": "https://{ns}.compat.objectstorage.ap-chuncheon-1.oraclecloud.com/",
      "acl": "public-read",
      "pathStyleAccess": true,
      "urlPrefix": "https://img.linkzz.eu.org",
      "disableBucketPrefixToURL": true
    }

}