koa2的文件上传
2018-04-23 11:50 muamaker 阅读(2067) 评论(0) 编辑 收藏 举报使用koa2搭建文件上传服务,后端代码
const os = require('os'); const path = require('path'); const koaBody = require('koa-body'); const Koa = require('koa'); const app = new Koa(); const fs = require("fs"); const main = async function(ctx) { //const tmpdir = os.tmpdir(); //返回系统临时文件 const tmpdir = path.join(__dirname, "static"); const filePaths = []; const files = ctx.request.files || {}; const params = ctx.request.body console.log(params); for (let key in files) { const file = files[key]; if(Object.prototype.toString.call(file) == '[object Array]'){ for(var j = 0; j < file.length; j++ ){ witeFile(file[j]); } }else{ witeFile(file); } } function witeFile(file){ const filePath = path.join(tmpdir, file.name); const reader = fs.createReadStream(file.path); const writer = fs.createWriteStream(filePath); reader.pipe(writer); filePaths.push(filePath); } ctx.body = filePaths; }; app.use(koaBody({ multipart: true })); app.use(main); app.listen(3000);
前端代码
<form action="http://localhost:3000/" method="post" enctype="multipart/form-data"> <input type="text" name="name" id="" value="姓名" /> <input type="text" name="pwd" id="" value="123456" /> <input type="file" name="file" id="file" value="" multiple="multiple" /> <input type="submit" value="提交"/> </form>
使用ajax 上传
$("#file")[0].onchange = function(e){ console.log(this.files); var filse = this.files; var fd = new FormData(); fd.append("file",filse[0]); $.ajax({ type:"post", data:fd, processData:false, contentType:false, url:"http://192.168.20.104:3000", }).then(function(ret){ console.log(ret); }).catch((e)=>{ console.log(e); }) }
注意:
新版本的koa-body通过ctx.request.files获取上传的文件
旧版本的koa-body通过ctx.request.body.files获取上传的文件
另外,附上express 的文件上传:
const multiparty = require('multiparty'); router.post('/file', function(req, res, next) { //生成multiparty对象,并配置上传目标路径 const form = new multiparty.Form() // //设置编辑 form.encoding = 'utf-8' // //设置文件存储路径 form.uploadDir = "./public/static/" // //设置单文件大小限制 //form.maxFilesSize = 2 * 1024 * 1024 // form.maxFields = 1000; 设置所以文件的大小总和 // 上传完成后处理 form.parse(req, (err, fields, files) => { if (err) { console.log("parse:",err); res.json(configVar.fileUp); } else { const inputFile = files.file[0]; const uploadedPath = inputFile.path var imgtype = inputFile.originalFilename; const typarr = imgtype.split("."); const typ = typarr[typarr.length -1]; const nm = new Date().getTime() + '' + Math.floor(Math.random()*1000000) ; console.log(fields.old); imgtype = nm + '.' + typ; const inPath = `./public/static/${imgtype}`; //重命名的路径 // 判断是否存在./dist/static/files文件 fs.stat('./public/static', (err, stats) => { if (JSON.stringify(stats) === undefined) { fs.mkdirSync('./public/static') } storeFiles(uploadedPath, fields, inPath) }); } }); function storeFiles(uploadedPath, fields, inPath) { //重命名为真实文件名 fs.rename(uploadedPath, inPath, (err) => { if (err) { console.log("rename:",err); res.json(configVar.rename); } else { var ret = { data:inPath.substring(8) }; Object.assign(ret , configVar.success); res.json(ret); } }); } });