快来把wordpress图片放到免费的cloudflare R2上去

网站一直是用的wordpress，做了几年uploads下的图片已经大到了几十GB单位，VPS也一路升级，吃不消啊吃不消。
一直在想有什么办法能解决下这一大堆图片，网站逛了一圈发现cloudflare的R2有10G免费空间，而且本来就用的他家的CDN，这样一来是不是会更顺滑呢？
说干就干，发现R2也是用的和亚马逊S3的标准方案，而且S3家有一个叫S3 Uploads的WP插件可直接用，并且官方的仓库里也有大佬写出了具体配置办法，那就照葫芦画瓢了。
结果由于网上查到的几个教程和方案都没有写明其中两处重要参数的作用，导致绕了一点弯路，一直没有把原图片地址和上传R2后的图片地址对应上，下面我就具体写下配置过程。

1.首先在R2上建立你自己的存储桶，并绑定你的域名，通过工具把网站图片全部同步到R2上，可以用rclone或WP插件，我这里直接用rclone来同步，如果图片多的话这个时间还是蛮久的，具体怎么使用rclone来连接远程桶也就是R2这里就不说了网上很多教程，不过同步到R2上的具体什么文件夹路径可以看下我后面关于S3 Uploads的配置说明再开始同步，否者如果等你同步完所有文件才发现路径不对需要重新调整的时候会发现修改一个路径和重新同步一次一样漫长。。。。

2.然后安装S3 Uploads插件，官方有两种方式安装，通过composer自动安装和手动下载安装，具体可以参考官方链接https://github.com/humanmade/S3-Uploads
我选择第二种手动安装直接下载官方releases的最新版后上传到wp插件目录解压缩。

3.插件安装正确后就能在wp的后台看到S3 Uploads插件了，但启动前还需要做两个配置。

4.打开wp的wp-config.php文件添加如下代码：

define("S3_UPLOADS_ENDPOINT", "https://<Cloudflare account ID>.r2.cloudflarestorage.com");
define("S3_UPLOADS_BUCKET", "<R2 bucket Name>");
define("S3_UPLOADS_BUCKET_URL", "<R2 bucket public url or domain>");
define("S3_UPLOADS_REGION", "auto");
define("S3_UPLOADS_KEY", "<R2 access key ID>");
define("S3_UPLOADS_SECRET", "<R2 secret access key>");

这里对每行参数做个说明：

S3_UPLOADS_ENDPOINT是指R2的链接地址，这个在你的R2中打开一个存储通中的设置里能看到有个“S3 API”就是这个了，但注意只写到.com这里后面的存储桶名字不要加进去。

S3_UPLOADS_BUCKET就是你网站要连接的存储桶名字，但这里可以加子目录，比如写成“存储桶名字/wp-content”这样。

S3_UPLOADS_BUCKET_URL这个参数指的是你图片以后链接到R2后的地址类似"https://img.主域名.com/wp-content"，这里是可以填子目录的，这里就对应你前面存储桶的设置了，一定不能填错，否者图片就无法正常显示。

S3_UPLOADS_REGION这里是连接点，我这里就使用自动匹配。

S3_UPLOADS_KEY和S3_UPLOADS_SECRET是连接R2的令牌密钥信息。 可以在R2中的管理 R2 API 令牌界面中创建，记得创建时要选择对象读和写权限，其他选项默认就可以了。

5.接下来修改你当前使用的主题中的functions.php文件，添加代码：

function tw_s3_uploads_s3_client_params( $params ) {
    $params["endpoint"] = S3_UPLOADS_ENDPOINT;
    $params["use_path_style_endpoint"] = true;
    return $params;
}
add_filter( "s3_uploads_s3_client_params", "tw_s3_uploads_s3_client_params");

好了所有的设置都好了，但由于所有的文章地址都还是默认指向服务器上的图片地址的，所以如果后续要完全使用R2就需要批量修改数据库，把文章的图片地址批量修改为R2的地址，可以使用下面两句来实现：

UPDATE wp_posts SET post_content = REPLACE(post_content, 'www.域名.com/wp-content/uploads' , 'img.域名.com/wp-content/uploads')

UPDATE wp_posts SET guid = REPLACE(guid, 'www.域名.com/wp-content/uploads' ,'img.域名.com/wp-content/uploads');

或者如果你担心修改数据库发生问题，也可以使用插件media cloud来做批量修改，这款插件可以批量检查并修改你的地址，但注意里面的Upload Path的上传路径要和原文件夹保持一致，可以用这样的格式来设置/wp-content/uploads/@{date:Y/m}
还有一个参数Public Bucket URL设置成你的存储桶的子域名即可，后面的路径插件会自动根据你前面这个Upload Path设置都上传路径自动变更的。

经过以上的设置网站上的图片都已经指向了Cloudflare R2,具体性能怎么样自己去试试吧。
另外我在使用宝塔面板到时候发现会报一个权限错误，只要关闭防跨站攻击就可以了。