【koa3】在koa3里面使用七牛云+koa-multer上传图片

七牛云oss存储的使用方法，这里记录下具体的使用方法

效果展示

上传成功后，在云端展示的情况

项目里面使用的效果

实现代码

• upload的工具方法

var uuid = require('uuid')
var fs = require('fs')
// 上传到七牛
let qiniu = require('qiniu') // 需要加载qiniu模块的
// 引入key文件
const QINIU = require('./constant')
const upToQiniu = (filePath, key) => {
const accessKey = QINIU.accessKey
const secretKey = QINIU.secretKey
const mac = new qiniu.auth.digest.Mac(accessKey, secretKey)

const options = {
    scope: QINIU.bucket
}

const putPolicy = new qiniu.rs.PutPolicy(options)

const uploadToken = putPolicy.uploadToken(mac)
const config = new qiniu.conf.Config()
config.regionsProvider = qiniu.httpc.Region.fromRegionId('z2')

const localFile = filePath
const formUploader = new qiniu.form_up.FormUploader(config)
const putExtra = new qiniu.form_up.PutExtra()
// 文件上传
return new Promise((resolved, reject) => {
    formUploader.putStream(uploadToken, key, localFile, putExtra).then(({ data, resp }) => {
        if (resp.statusCode === 200) {
            resolved(data)
        } else {
            reject(data)
        }
    })
})
}

module.exports = {
    upToQiniu
}

• 用到的常量数据

const keys = {
    accessKey: '', // 在七牛云官网申请
    secretKey: '',
    bucket: 'gfoos' // bucket是存储空间名称
}

module.exports = keys

• koa-multer.js

注释掉destination/filename这两项，本地存储才用的上

const multer = require('@koa/multer')
const path = require('path')
//配置storage
var storage = multer.diskStorage({
    //文件保存路径
    // destination: function (req, file, cb) {
    //     cb(null, path.join(__dirname, '../uploads/images')) //路径一定要对
    // },
    // //修改文件名称
    // filename: function (req, file, cb) {
    //     console.log('🚀 ~ file:', file)
    //     var fileFormat = file.originalname.split('.')
    //     cb(null, Date.now() + '.' + fileFormat[fileFormat.length - 1])
    // }
})
//文件上传限制
const limits = {
    fields: 10, //非文件字段的数量
    fileSize: 12 * 500 * 1024, //单位 b
    files: 1 //文件数量
}

//加载配置

module.exports = multer({ storage, limits })

引入上面的koa-multer中间件

const upload = require('../middleware/upload')

router.post('/v1/upload', upload.single('file'), uploadFile)

• 核心方法

注意这里需要的两个字段

async function handleUploadFile(ctx) {
    // console.log('ctx.request.file', ctx.request.file)
    // console.log('ctx.file', ctx.file)
    // console.log('ctx.request.body', ctx.request.body)
    const { phone } = ctx.state.user
    const file = ctx.file // 获取上传文件
    if (!file) {
        return Result.error('400', null, '没有文件上传') // 如果没有文件上传
        
    }

    try {
        if (file) {
            const fileName = uuid.v1()
            // File文件对象进行转码
            const reader = fs.createReadStream(file.path)
            // 获取上传文件扩展名
            const ext = file.originalname.split('.').pop()
            // 命名文件以及拓展名
            const fileUrl = `images/${fileName}.${ext}` // 这里images是上传的目录
            const result = await upToQiniu(reader, fileUrl)
            if (result) {
            // 拼接图片的域名
                let imageUrl = `http://xxxxxxxxxxxxxxx.clouddn.com/${result.key}` // 获取上传文件 使用 （七牛配置域名+imgUrl）
                let data = { imageUrl }
                return Result.success(data, '上传成功')
            } else {
                return Result.error('500', null, '上传失败')
            }
        }
    } catch (err) {
        return Result.error('500', null, err.message)
    }

这样我们就实现了一个图片上传的业务功能