node koa2实现上传图片并且同步上传到七牛云存储

网友投稿 622 2023-04-24


node koa2实现上传图片并且同步上传到七牛云存储

因为升级到新的node版本,之前的通过很多上传图片的方式都已经不适用了,所以自己就写了一个对于 koa2上传图片的小demo,记录一下心得。

废话不多说,下面直接上代码,里面都有注释。

const Koa = require('koa');

const route = require('koa-route');

const serve = require('koa-static');

const inspect = require('util').inspect

const path = require('path')

const os = require('ohttp://s')

const fs = require('fs')

const Busboy = require('busboy')

const qiniu = require('qiniu')

const qiniuConfig = require('./qiniuconfig')

const app = new Koa();

app.use(serve(__dirname + '/public/'));

// 写入目录

const mkdirsSync = (dirname) => {

if (fs.existsSync(dirname)) {

return true

} else {

if (mkdirsSync(path.dirname(dirname))) {

fs.mkdirSync(dirname)

return true

}

}

return false

}

function getSuffix (fileName) {

return fileName.split('.').pop()

}

// 重命名

function Rename (fileName) {

return Math.random().toString(16).substr(2) + '.' + getSuffix(fileName)

}

// 删除文件

function removeTemImage WXmyTEekzC(path) {

fs.unlink(path, (err) => {

if (err) {

throw err

}

})

}

// 上传到七牛

function upToQiniu (filePath, key) {

const accessKey = qiniuConfig.accessKey // 你的七牛的accessKey

const secretKey = qiniuConfig.secretKey // 你的七牛的secretKey

const mac = new qiniu.auth.digest.Mac(accessKey, secretKey)

const options = {

scope: qiniuConfig.scope // 你的七牛存储对象

}

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

const uploadToken = putPolicy.uploadToken(mac)

const config = new qiniu.conf.Config()

// 空间对应的机房

config.zone = qiniu.zone.Zone_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.putFile(uploadToken, key, localFile, putExtra, function (respErr, respBody, respInfo) {

if (respErr) {

reject(respErr)

}

if (respInfo.statusCode == 200) {

resolved(respBody)

} else {

resolved(respBody)

}

})

})

}

// 上传到本地服务器

function uploadFile (ctx, options) {

const _emmiter = new Busboy({headers: ctx.req.headers})

const fileType = options.fileType

const filePath = path.join(options.path, fileType)

const confirm = mkdirsSync(filePath)

if (!confirm) {

return

}

console.log(WXmyTEekzC'start uploading...')

return new Promise((resolve, reject) => {

_emmiter.on('file', function (fieldname, file, filename, encoding, mimetype) {

const fileName = Rename(filename)

const saveTo = path.join(path.join(filePath, fileName))

file.pipe(fs.createWriteStream(saveTo))

file.on('end', function () {

resolve({

imgPath: `/${fileType}/${fileName}`,

imgKey: fileName

})

})

})

_emmiter.on('finish', function () {

console.log('finished...')

})

_emmiter.on('error', function (err) {

console.log('err...')

reject(err)

})

ctx.req.pipe(_emmiter)

})

}

app.use(route.post('/upload', async function(ctx, next) {

const serverPath = path.join(__dirname, './uploads/')

// 获取上存图片

const result = await uploadFile(ctx, {

fileType: 'album',

path: serverPath

})

const imgPath = path.join(serverPath, result.imgPath)

// 上传到七牛

const qiniu = await upToQiniu(imgPath, result.imgKey)

// 上存到七牛之后 删除原来的缓存图片

removeTemImage(imgPath)

ctx.body = {

imgUrl: `http://xxxxx(你的外链或者解析后七牛的路径)/${qiniu.key}`

}

}));

app.listen(3001);

console.log('listening on port 3001');

然后在同一级目录下,创建一个public文件夹,然后在下面新建一个 index.html,因为我们上面已经把这个文件夹设置为静态访问文件夹了, public/index.html 的代码为

选择好图片,然后点击提交,就可以上传到你的七牛空间啦!

源代码在 github: https://github.com/naihe138/koa-upload


版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:java 与web服务器链接的实例
下一篇:java对图片进行压缩和resize缩放的方法
相关文章

 发表评论

暂时没有评论,来抢沙发吧~