您好,登錄后才能下訂單哦!
有時候就是有這樣的需求,Nodejs做webserver,從瀏覽器端上傳文件到后端服務器,Node層只是做一個數據中轉,如果在這個過程中,Node webserver需要對數據進行適當加工,然后再Post到后端,那么就得在Node層模擬文件上傳了。
首先,通過瀏覽器上傳文件,PostData格式是長著個樣子的:
屏幕快照 2014-11-22 下午9.18.45.png
如圖,每一組數據其實就是用“-----WebkitFormBoundary.....”分隔開的,最后再用這個分隔符結束,而且,這個分隔符完全是可自定義的。
每一段提交數據,則通過Content-Disposition來描述,未指定Content-Type,則默認text/plain,如果是上傳的二進制文件,指定其mime-type即可。
簡單封裝一個方法,實現Node層的文件上傳:
/** * 上傳文件 * @param files 經過formidable處理過的文件 * @param req httpRequest對象 * @param postData 額外提交的數據 */ function uploadFile(files, req, postData) { var boundaryKey = Math.random().toString(16); var endData = '\r\n----' + boundaryKey + '--'; var filesLength = 0, content; // 初始數據,把post過來的數據都攜帶上去 content = (function (obj) { var rslt = []; Object.keys(obj).forEach(function (key) { arr = ['\r\n----' + boundaryKey + '\r\n']; arr.push('Content-Disposition: form-data; name="' + key + '"\r\n\r\n'); arr.push(obj[key]); rslt.push(arr.join('')); }); return rslt.join(''); })(postData); // 組裝數據 Object.keys(files).forEach(function (key) { if (!files.hasOwnProperty(key)) { delete files.key; return; } content += '\r\n----' + boundaryKey + '\r\n' + 'Content-Type: application/octet-stream\r\n' + 'Content-Disposition: form-data; name="' + key + '"; ' + 'filename="' + files[key].name + '"; \r\n' + 'Content-Transfer-Encoding: binary\r\n\r\n'; files[key].contentBinary = new Buffer(content, 'utf-8'); filesLength += files[key].contentBinary.length + fs.statSync(files[key].path).size; }); req.setHeader('Content-Type', 'multipart/form-data; boundary=--' + boundaryKey); req.setHeader('Content-Length', filesLength + Buffer.byteLength(endData)); // 執行上傳 var allFiles = Object.keys(files); var fileNum = allFiles.length; var uploadedCount = 0; allFiles.forEach(function (key) { req.write(files[key].contentBinary); var fileStream = fs.createReadStream(files[key].path, {bufferSize: 4 * 1024}); fileStream.on('end', function () { // 上傳成功一個文件之后,把臨時文件刪了 fs.unlink(files[key].path); uploadedCount++; if (uploadedCount == fileNum) { // 如果已經是最后一個文件,那就正常結束 req.end(endData); } }); fileStream.pipe(req, {end: false}); }); }
思路就這樣,代碼也不復雜,可能額外需要注意的是,在http.request的response處理中,response.headers可能是gzip的,這個時候buffer不能直接toString,需要通過zlib解碼再轉換為string,大概思路:
var result = []; response.on('data', function (chunk) { result.push(chunk); }); // 處理response var _dealResponse = function (data) { var buffer = data; try { data = data.toString('utf8'); data = data ? (JSON.parse(data) || data) : false; } catch (err) { // 接口返回數據格式異常,解析失敗 console.log(err); } self.res.writeHead(response.statusCode, 'OK', { 'content-type': 'text/plain; charset=utf-8', 'content-length': buffer.length }); self.res.write(buffer); self.res.end(); }; response.on('end', function () { result = Buffer.concat(result); // gzip 的數據,需要zlib解碼 if (response.headers['content-encoding'] == 'gzip') { zlib.gunzip(result, function (err, dezipped) { var data = err ? new Buffer('{}') : dezipped; _dealResponse(data); }); } else { _dealResponse(result); } });
Mark一下,也許你路過正好需要~~~
以上這篇Node層模擬實現multipart表單的文件上傳示例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。