本文首發(fā)于 艾特網(wǎng) - 程序員導航站 中的博客專欄，地址：https://www.iiter.cn/blogs/37
強烈建議收藏或保存

說在前面

最近想著給 艾特網(wǎng) - 程序員導航站 后臺擴展文件上傳的功能。因為考慮到七牛云對象存儲比較劃算，而且每個月會免費贈送 10GB的標準存儲空間，基本算是白嫖。所以就打算拿七牛云來練練手。想注冊七牛云的同學可以點這里

image

安裝依賴

七牛云官網(wǎng)中有 nodejs 版本的 sdk，我們通過 npm 來安裝

npm install qiniu

再安裝如下依賴，后面會用到

npm install await-stream-ready stream-wormhole

創(chuàng)建路由

router.js 文件中創(chuàng)建上傳文件路由，映射 utils 這個 controller 下面的 uploadFiles 方法，這塊可根據(jù)自己的業(yè)務需求自行調(diào)整。

router.post("/upload", controller.utils.uploadFiles);

創(chuàng)建控制器

打開 utils 文件，創(chuàng)建 uploadFiles 方法，寫入如下內(nèi)容。

async uploadFiles() {
    const { ctx } = this;
    const data = await ctx.service.utils.uploadFiles();
    if(data){
      ctx.body = data;
    }else{
      ctx.body = {
        message:"上傳失敗"
      }
    }
  }

創(chuàng)建service

在 service 中 utils.js 文件里完成上傳邏輯

const Service = require("egg").Service;
const fs = require("fs");
const path = require("path");
const qiniu = require("qiniu");
const awaitWriteStream = require("await-stream-ready").write;
const sendToWormhole = require("stream-wormhole");
const md5 = require("md5");
const bucket = ""; //要上傳的空間名
const imageUrl = ""; // 空間綁定的域名
const accessKey = ""; //Access Key
const secretKey = ""; //Secret Key
const mac = new qiniu.auth.digest.Mac(accessKey, secretKey);
const options = {
  scope: bucket
};
const putPolicy = new qiniu.rs.PutPolicy(options);
const uploadToken = putPolicy.uploadToken(mac);
let config = new qiniu.conf.Config();
config.zone = qiniu.zone.Zone_z0;
class utilsService extends Service {
  async uploadFiles() {
    const { ctx } = this;
    const stream = await ctx.getFileStream();
    const filename =
      md5(stream.filename) + path.extname(stream.filename).toLocaleLowerCase();
    const localFilePath = path.join(__dirname, "../public/uploads", filename);
    const writeStream = fs.createWriteStream(localFilePath);
    try {
      await awaitWriteStream(stream.pipe(writeStream));
      const formUploader = new qiniu.form_up.FormUploader(config);
      const putExtra = new qiniu.form_up.PutExtra();
      const imgSrc = await new Promise((resolve, reject) => {
        formUploader.putFile(
          uploadToken,
          filename,
          localFilePath,
          putExtra,
          (respErr, respBody, respInfo) => {
            if (respErr) {
              reject("");
            }
            if (respInfo.statusCode == 200) {
              resolve(imageUrl + respBody.key);
            } else {
              reject("");
            }
            // 上傳之后刪除本地文件
            fs.unlinkSync(localFilePath);
          }
        );
      });
      if (imgSrc !== "") {
        return {
          url: imgSrc
        };
      } else {
        return false;
      }
    } catch (err) {
      //如果出現(xiàn)錯誤，關(guān)閉管道
      await sendToWormhole(stream);
      return false;
    }
  }
}
module.exports = utilsService;

注意：

1. 代碼中這一行的Zone_z0應該和自己空間的存儲區(qū)域相對應，不然會報錯，比方說自己空間是華北區(qū)的，對應的就是Zone_z1

config.zone = qiniu.zone.Zone_z0;

image

2. Access Key 和 Secret Key 可以在這里查看
   https://portal.qiniu.com/user/key

上傳測試

這里用的是 postman 測試
Headers

{
  "Content-Type":"multipart/form-data"
}

Body選擇form-data類型
創(chuàng)建一個key為file，右下角類型選擇File類型，然后在value屬性中選擇一張圖片。

image

點擊藍色的Send按鈕即可上傳

至此，一個完整的 eggjs 結(jié)合七牛云對象存儲的文件上傳案例就完成啦。

本文參考如下文章：
egg.js 上傳文件
NodeJS + 七牛云實現(xiàn)圖片上傳