Koa上传图片到本地、阿里云OSS 前端博客-前端译文-前端资讯

Koa上传图片到本地、阿里云OSS

如何使用Koa上传图片到本地，并同步到阿里云？可以通过Koa-router提供接口，同步koa-multer作为中间件上传到本地。再使用ali-oss nodejs sdk同步到oss。

来源： source 作者：E盘浏览：3644 发布时间：2022-03-04 14:44:37 标签： nodejskoa

需要的依赖和使用步骤

1、安装依赖，我选择的是koa-multer和koa-router，koa-router提供对外路由，koa-multer处理上传的数据.

yarn add koa-router
yarn add koa-multer

2、安装阿里云ali-oss依赖，并创建阿里云对象存储OSS，同时创建Bucket。复制region、accessKeyId、accessKeySecret、bucket信息。

yarn add ali-oss

const OSS = require("ali-oss")
let client = new OSS({
  region: config.oss.region,
  accessKeyId: config.oss.accessKeyId,
  accessKeySecret: config.oss.accessKeySecret,
  bucket: config.oss.bucket
})

3、使用koa-router创建上传接口，通过koa-multer获取上传的资源并保存。

const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    //public/upload配置图片储存的目录，目录需要先创建
    cb(null, "public/upload");
  },
  // 确保本地文件名和服务器文件名一致
  // 重命名文件名
  filename: function (req, file, cb) {   
    const fileFormat = (file.originalname).split(".");
    // 我以当前时间戳作为名称
    const filename = Date.now() + "." + fileFormat[fileFormat.length - 1] 
    // 返回上传后的地址
    cb(null, filename);
  }
})

const upload = multer({
  storage
});

// 对外的上传接口
router.post("/upload", upload.single("file"), async (ctx, next) => {
    console.log("ctx.request.file", ctx.request.file);
    console.log("ctx.file", ctx.file);
    console.log("ctx.request.body", ctx.request.body);
    ctx.body = "done";
})

4、通过ali-oss，再把本地的资源同步到OSS。

filename: function (req, file, cb) {   
    ...,
    // 同时上传到oss服务器
    client.put(filename, file.stream).then(res => {
      // 返回上传后的地址
      cb(null, filename);
    })
  }

router.post("/upload", upload.single("file"), async (ctx, next) => {
  // 返回拼接后的名称到客户端
  const filename = `http://${config.oss.bucket}.${config.oss.region}.aliyuncs.com/${ctx.file.filename}`
  ctx.body = {
    code: 200,
    data: filename,
    dataMsg: "success"
  };
})

客户端上传成功后返回的地址。