在今天的复盘中,我们将分享一个技巧,如何通过 GPT 的帮助,成功修改 WP Githuber MD 插件 的代码,实现 批量抓取远程图片 的功能,并确保这些图片上传到 腾讯云 COS,并且使用 CDN 域名 进行图片访问。
前言:抓取远程图片与上传至 COS 的挑战
很多 WordPress 用户习惯通过插件抓取远程图片到本地并上传,但是对于插件 WP Githuber MD 插件,默认的上传逻辑是直接将图片保存到本地服务器,而不是通过 腾讯云 COS 进行上传和返回 CDN 域名的图片 URL。
通过一次和 GPT 的深入对话,我得到了灵感,成功地修改了插件的上传逻辑,将批量抓取图片的功能与 腾讯云 COS 插件 结合,使得图片上传不仅到本地,还能通过 COS CDN 进行访问,提升了网站的访问速度。
环境搭建:我用到的工具和插件
首先,来看看我们用到的基础环境和插件:
- WordPress 环境:一个正常运行的 WordPress 网站。
- WP Githuber MD 插件:这个插件让你可以将文章内容以 Markdown 格式编辑,并支持图片上传。
- 腾讯云 COS 插件:用于将图片上传到腾讯云的 COS(Cloud Object Storage),并配合设置的 CDN 域名,提高图片的访问速度。
挑战:抓取远程图片的默认行为
默认情况下,WP Githuber MD 插件 在抓取远程图片时,只会将图片保存到本地服务器的 uploads
文件夹,而不会自动触发腾讯云 COS 插件的上传逻辑。对于普通的图片粘贴操作,腾讯云 COS 插件会正常拦截并上传图片到 COS,但批量抓取操作不会触发这种上传机制。
我决定用 GPT 来帮助我解决这个问题,修改 批量抓取 远程图片时的上传逻辑,确保它能够通过腾讯云 COS 插件将图片上传至 COS,并返回正确的 CDN 域名。
与 GPT 的对话:如何修改插件的上传逻辑
文件上传逻辑初步分析
最开始,我把插件的 上传逻辑 和 抓取远程图片 的功能作为目标,跟 GPT 进行了对话。通过查看插件代码,我发现插件抓取远程图片并保存到本地的函数并不会触发腾讯云 COS 插件的上传机制。
GPT 提供的上传代码:
public static function save_image( $content, $url ) {
require_once( ABSPATH . 'wp-admin/includes/file.php' );
require_once( ABSPATH . 'wp-admin/includes/media.php' );
require_once( ABSPATH . 'wp-admin/includes/image.php' );
$tmp = download_url( $url );
if ( is_wp_error( $tmp ) ) {
return '';
}
$file_array = array(
'name' => basename( parse_url( $url, PHP_URL_PATH ) ),
'tmp_name' => $tmp
);
// 设置当前文章 ID
$post_id = githuber_get_current_post_id();
// 插入媒体库
$id = media_handle_sideload( $file_array, $post_id );
// 获取图片 URL
$image_url = wp_get_attachment_url( $id );
return $image_url;
}
GPT 在此处明确了如何通过 media_handle_sideload()
函数将图片从远程 URL 上传到 WordPress 媒体库中,并确保图片最终上传到腾讯云 COS。
批量抓取远程图片的修改
接着,我通过 GPT 将批量抓取远程图片的功能进行修改,使其能够调用上面定义的 save_image
函数,将每个远程图片保存到腾讯云 COS。
GPT 提供的批量抓取逻辑:
此处,GPT 帮助我修改了批量抓取逻辑,遍历文章中的所有图片 URL,并调用 save_image()
函数,将图片上传至腾讯云 COS,之后将文章中的 URL 替换成 COS 上传后的 CDN URL。
启用腾讯云 COS 插件上传功能
在修改了插件的上传逻辑之后,我确保 腾讯云 COS 插件 已经正确配置,并且能够拦截 WordPress 媒体库的上传操作,将所有上传的图片同步到 腾讯云 COS,并返回配置的 CDN 域名。
批量抓取图片的成功运行
通过这一步修改后,每次抓取远程图片,图片不仅会保存在本地服务器的 uploads
文件夹中,还会被 腾讯云 COS 插件 上传至 COS 存储,最终通过配置的 CDN 域名 进行访问。
成功效果:完美集成,图片上传顺畅
最终,经过修改后,批量抓取远程图片 的功能成功触发了 腾讯云 COS 插件,图片上传不仅顺利完成,而且返回了正确的 CDN 域名,极大提升了图片加载速度。
举个例子:
- 原始远程图片 URL:
http://remote-url.com/images/photo.jpg
- 上传后返回的 URL:
https://cdn.example.com/images/photo.jpg
成功实现了批量抓取远程图片并上传至 腾讯云 COS,返回的 URL 就是我们配置的 CDN 域名,这大大提升了网站的性能。
🛠 步骤:
找到原来的 save_image() 方法代码;
将原来的 save_image() 方法替换为上面的新代码;
保存文件;
测试上传远程图片,看看是否能够通过腾讯云 COS 插件正常上传。
总结:
- 环境配置:WordPress 环境搭建完成,腾讯云 COS 插件配置好,WP Githuber MD 插件安装并启用。
- 修改代码:通过与 GPT 的对话,我成功修改了图片上传逻辑,使其能够批量抓取远程图片并上传到腾讯云 COS。
- 成功体验:批量抓取远程图片后,图片顺利上传到 COS,返回的 URL 是 COS 配置的 CDN 域名,提升了网站的性能。
这就是我的修改过程和成功经验。希望这篇文章能帮助你们快速解决类似的问题,也欢迎大家继续分享自己的经验和问题,我们一起进步!