本文介紹了Node Js 使用KOA處理form-data格式傳輸過來的文件,分享給大家。具體如下:
使用koa有一段時間了,評價是小巧精悍,只封裝了基本的如request對象和response對象到上下文中,其他功能基本上靠第三方中間件來實現(xiàn)。導致的問題是使用起來就不太方便了,比如用koa上傳文件,網(wǎng)上資料有限,對于小白而言,文件上傳操作就困難多了。
form表單上傳文件流程(PHP和node js)
文件上傳操作原理
form表單【注意:enctype=”multipart/form-data”】上傳文件時,首先會將文件上傳到你本機的temp目錄,然后執(zhí)行move_upload_file(tmpfile,newfile);然后node會不會是這樣呢?答案是確定的,上傳文件大家都是一樣的思路。
//var tmpath = path.join(os.tmpdir(), '1.txt');//模擬上傳到臨時目錄的文件 //console.log(tmpath); //var ext = ".txt";//上傳后生成文件的后綴,一般和上傳的文件后綴一致 //var ph = path.join('public/upload', Date.parse(new Date()).toString() + ext);//生成新的上傳文件路徑全稱 //console.log(ph); //var stream = fs.createWriteStream(ph);//創(chuàng)建一個可寫流 //fs.createReadStream(tmpath).pipe(stream);//可讀流通過管道寫入可寫流然后分析了下上面代碼:
fs.createWriteStream(path.join(os.tmpdir(), Math.random().toString()));
這里創(chuàng)建一個可寫的流對象,即創(chuàng)建一個表單上傳后移動到新目錄的空文件;而os.tmpDir()剛好是本機臨時目錄,上面代碼表示在臨時目錄下生成一個隨機數(shù)空文件;
part.pipe(stream);
上面的代碼表示將可讀流對象內(nèi)容寫入到可寫的流對象,即上面生成的臨時文件下的文件;part是將request里面的文件對象解析成可讀流。
然后koa文件上傳原理就清楚了。通過表單上傳文件,文件默認會存放到本機臨時目錄下生成一個臨時文件。然后通過流的形式,打開這個臨時文件將數(shù)據(jù)寫入到一個新地址的可寫文件流里面,前提是要提前創(chuàng)建這個空的可寫流文件,即我們上傳目標文件。
KOA2解析傳輸過來的post form-data信息
const Koa = require('koa');const app = new Koa();const bodyParser = require('koa-bodyparser');const koaBody = require('koa-body');const router = require('./router');// 輸出請求路徑,每次請求都會輸出app.use(async (ctx, next) => {console.log(`Process ${ctx.request.method} ${ctx.request.url}...`);await next();});// 文件上傳,注意書寫的位置很重要,否則無法上傳app.use(koaBody({ multipart: true }));// 解析請求體app.use(bodyParser());// 使用路由app.use(router());app.listen(3000);console.log('app started at port 3000...');總結(jié)一下的話,就是前端用form傳遞文件,bodyParse解析出這個form,對應的字段是ctx.request.body.files.字段名稱(eg: abc),最后通過拷貝臨時的數(shù)據(jù)文件來達到上傳存儲的目的。
bodyParse解析出的格式:
{ fields: { aaa: '123345' }, //Text類型的解析到fields中 files: //File類型的解析到files中 { abc: File { domain: null, _events: {}, _eventsCount: 0, _maxListeners: undefined, size: 12525, path: 'C://Users//DANNYJ~1//AppData//Local//Temp//upload_d896dcc755fcd36156c6814aafb7685e', name: 'bamboo5.png', type: 'image/png', hash: null, lastModifiedDate: 2017-12-08T10:17:04.355Z, _writeStream: [Object] } } }KOA2將POST傳過來的文件存儲到本地
var file = ctx.request.body.files.abc //傳輸文件的name是abc console.log(ctx.request.body) var tmpath= file['path']; var tmparr =file['name'].split('.'); var ext ='.'+tmparr[tmparr.length-1]; var newpath =path.join('./', parseInt(Math.random()*100) + Date.parse(new Date()).toString() + ext); console.log(tmpath); console.log(newpath); var stream = fs.createWriteStream(newpath);//創(chuàng)建一個可寫流 fs.createReadStream(tmpath).pipe(stream);//可讀流通過管道寫入可寫流然后就會發(fā)現(xiàn)項目當前目錄下面就會多出上傳的文件了。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持武林網(wǎng)。
新聞熱點
疑難解答