准备
- 可访问的 wordpress 站点
- OSS
操作
1、OSS 相关
创建 Bucket 取名为 wordpress-test1 ,按照控制台指引填入其他的信息，点击确定即可：
创建完成后，进入到 Bucket 详情，点击 Bucket 配置>域名管理 绑定 OSS 访问域名：
输入域名后，阿里云会自动检测域名的管理是否也在阿里云，如果域名管理也在阿里云，开启自动添加 CNAME 记录会自动帮你做解析处理。如果没有可以到对应的域名管理控制台自行添加，这里不再赘述。
为了访问速度更快，这里还需要配置一下 CDN 。在添加域名成功后点击第二列的阿里云 CDN 加速，然后会自动跳转到 CDN 创建页面，参考控制台步骤创建即可：
最后一步，创建完成后到域名解析里面找到刚刚绑定的域名，将域名解析到 CDN 对应的 CNAME 即可。
2、设置 Ram 用户访问 OSS
进入到 访问控制 控制台，创建新用户或者选择已有用户，为其分配 OSS 的使用权限：
回到 认证管理 页面，如果没有 AccessKey 的话可以创建一个。这个 key 和 secret 用于后面 wordpress 插件配置使用，请保存好。
3、安装 OSS 上传插件
进入到 wordpress 的管理后台，进入 插件>安装插件 ，在搜索框中输入 oss 进行搜索，然后选择 “WPOSS阿里云对象存储”这个插件进行安装。
启用刚安装的扩展，进行设置：
设置完成后保存，进入到 wordpress 的媒体库页面可实验一下是否可用。
如上图，上传成功后图片可正常显示，并且在 文件URL 中的连接为绑定的 OSS 域名，红框中的路径为上面配置中填写的路径。
4、上传插件问题
插件使用后，会发现上传的文件为图片的各个尺寸的缩略图，如下图的文件名，但是该图片的原始图片并没有在目录中，这就导致在 wordpress 中使用原图的时候会出现图片找不到的情况。
对插件的源代码进行了一下修改，进入到文件 wp-content/plugins/wposs/index.php ，找到 upload_and_thumbs 方法，将代码改为如下内容：
/** * 上传图片及缩略图 * @param $metadata: 附件元数据 * @return array $metadata: 附件元数据 * 官方的钩子文档上写了可以添加 $attachment_id 参数，但实际测试过程中部分wp接收到不存在的参数时会报错，上传失败，返回报错为“HTTP错误” */ public function upload_and_thumbs( $metadata ) { //新增修改内容 ------ start if (isset( $metadata['original_image'] )) { # 1.原始图片 $attachment_key = dirname($metadata['file']) . '/' .$metadata['original_image']; // 远程key路径, 此路径不是以/开头 $attachment_local_path = $this->wp_upload_dir['basedir'] . '/' . $attachment_key; # 在本地的存储路径 $this->_file_upload($attachment_key, $attachment_local_path); # 调用上传函数 } //新增修改内容 ------ end if (isset( $metadata['file'] )) { # 1.先上传主图 $attachment_key = $metadata['file']; // 远程key路径, 此路径不是以/开头 $attachment_local_path = $this->wp_upload_dir['basedir'] . '/' . $attachment_key; # 在本地的存储路径 $this->_file_upload($attachment_key, $attachment_local_path); # 调用上传函数 } # 如果存在缩略图则上传缩略图 if (isset($metadata['sizes']) && count($metadata['sizes']) > 0) { foreach ($metadata['sizes'] as $val) { $attachment_thumbs_key = dirname($metadata['file']) . '/' . $val['file']; // 生成object 的 key $attachment_thumbs_local_path = $this->wp_upload_dir['basedir'] . '/' . $attachment_thumbs_key; // 本地存储路径 $this->_file_upload($attachment_thumbs_key, $attachment_thumbs_local_path); //调用上传函数 } } return $metadata; }
由此即可解决原图无法上传的问题。
