koa2的文件上傳


使用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);
            }
        });
    }

});

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM