腾讯云cos图片迁移

forgiveForever

已于 2022-05-22 21:36:06 修改

阅读量479

点赞数

分类专栏：其他文章标签： node.js 腾讯云

于 2022-05-22 20:24:20 首次发布

本文链接：https://blog.csdn.net/forgiveForever/article/details/124915661

版权

其他专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文介绍了如何在个人博客中，通过设置自定义的图片请求处理，利用Node.js和Nginx来实现腾讯COS图片存储服务到期后的图片资源迁移。当图片src为接口地址时，Nginx会将请求转发到Node后台，Node读取新的图片路径并返回图片流，确保即使COS服务更换，也不需手动修改富文本中的图片路径。

摘要由CSDN通过智能技术生成

背景

自己搭建blog，使用腾讯cos 存放blog 图片。

文章为富文本，图片链接是直接保存在富文本img标签上的，想着以后腾讯cos桶到期之后，如何处理这些图片路径。

以后迁移图片之后，不用去修改富文本图片路径。

解决方案

1.图片迁移之后，每篇文章手动修改（不太科学）

2.监听img标签 error 事件（集成三方富文本编辑器，不太靠谱）

3.图片src自定义请求，使用ngnix转发请求，node处理（推荐）

注：这里使用的三种方式解决

原理

文章富文本中img标签 src 为相对路径例如 /api/getfile?path=xxxx，当加载图片时静态资源会被nginx 拦截，该请求 /api/getfile?path=xxxx node会接收处理，先获取path 在拼上腾讯cos桶的地址，发送请求获取到图片，然后在返回给img标签展示

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WGqDT68i-1653221670030)(…/…/…/api/getfile?path=blog%2F_static_1653215451336_mceclip0.png)]

具体操作

第一步：img 中的src 地址是接口地址，会被nginx拦截，服务转发到我的node 后台服务

在这里插入图片描述

第二步：node 处理请求成功返回图片流

const _base_dir = '腾讯云cos桶地址';
export async function getFile(ctx, next){
    const { path } = ctx.request.query;
    if(!path) {
        ctx.body = RESPONSE_DATA.error;
        return;
    }
    try{
        const response = await fetch(_base_dir+encodeURIComponent(path));
        if (!response.ok) throw new Error(`unexpected response ${response.statusText}`);
        const streamPipeline = promisify(pipeline);
        ctx.status = 200;
        await streamPipeline(response.body, ctx.res );

    }catch(err){
        ctx.body = RESPONSE_DATA.error;
    }
}

腾讯云cos服务到期之后，迁移图片资源之后，只需要替换_base_dir 地址就好了