前言
HTTP實現(xiàn)文件下載時,只要在服務(wù)器設(shè)置好相關(guān)響應(yīng)頭,并使用二進制傳輸文件數(shù)據(jù)即可,而客戶端(瀏覽器)會根據(jù)響應(yīng)頭接收文件數(shù)據(jù)。而在Node.js中,設(shè)置好響應(yīng)頭后,讀取文件流,再使用“.pipe()”方法將流轉(zhuǎn)接到響應(yīng)對象Response就可以實現(xiàn)一個簡單的文件下載服務(wù)器。
1. 文件下載介紹
HTTP基于請求頭和響應(yīng)頭實現(xiàn)狀態(tài)交互,在得到服務(wù)器正確響應(yīng)狀態(tài)后,而客戶端首先會解析響應(yīng)頭,并根據(jù)響應(yīng)頭來接收和展示數(shù)據(jù)(響應(yīng)體)。對于文件下載來說,其實現(xiàn)過程如下:
1.客戶端發(fā)起文件資源請求
2.服務(wù)器查找對應(yīng)文件,并設(shè)置”Content-Type”、”Content-Disposition”等響應(yīng)頭,分別用于表示文件的”MIME”類型及文件描述
3.客戶端根據(jù)服務(wù)器返回的響應(yīng)頭解析和接收文件數(shù)據(jù)
需要設(shè)置的響應(yīng)頭
設(shè)置文件下載響應(yīng)頭時,除了常用的HTTP響應(yīng)頭外,比較重要是還要設(shè)置以下兩個響應(yīng)頭:
Content-Type: application/octet-streamContent-Disposition: attachment; filename=MyFileName.ext
在上面的設(shè)置中,”Content-Type: application/octet-stream”告訴瀏覽器這是一個二進制文件,”Content-Disposition”告訴瀏覽器這是一個需要下載的附件并告訴瀏覽器默認的文件名。如果不添加”Content-Disposition”響應(yīng)頭,瀏覽器可能會下載或顯示文件內(nèi)容,不同瀏覽器的處理有所不同。
2. Node.js文件下載服務(wù)器實現(xiàn)
接下來我們基于Express 框架實現(xiàn)一個簡單文件下載服務(wù)器,在這個服務(wù)器中主要包括兩個功能:服務(wù)器文件的瀏覽、文件的下載。
2.1 添加路由
創(chuàng)建Express應(yīng)用后,添加如下兩個路由:
router.get('/files', function(req, res, next) { // 顯示服務(wù)器文件 });router.get('/file/:fileName', function(req, res, next) { // 實現(xiàn)文件下載 });上面的添加的兩個路由分別用于:顯示服務(wù)器文件、實現(xiàn)文件下載。
2.2 顯示服務(wù)器文件
實現(xiàn)服務(wù)器文件的顯示,要通過”fs”模塊讀取文件目錄并進行文件/目錄檢查等。還需要使用”path”模塊處理文件路徑。首先引入這兩個模塊:
const fs = require('fs');const path = require('path');顯示服務(wù)器文件實現(xiàn)代碼如下:
router.get('/files', function(req, res, next) { // 顯示服務(wù)器文件 // 文件目錄 var filePath = path.join(__dirname, './'); fs.readdir(filePath, function(err, results){ if(err) throw err; if(results.length>0) { var files = []; results.forEach(function(file){ if(fs.statSync(path.join(filePath, file)).isFile()){ files.push(file); } }) res.render('files', {files:files}); } else { res.end('當前目錄下沒有文件'); } });});上面代碼中,讀取目錄后通過視圖文件”files.ejs”顯示可下載文件列表。其代碼如下:
<!DOCTYPE html><html> <head> <title>下載文件選擇</title> </head> <body> <h1>請選擇下載文件:</h1> <% if(files.length>0) {%> <ul> <% files.forEach(function(file){ %> <li> <a href="/file/<%- file %>" target="_blank"><%- file %></a> </li> <%})%> </ul> <%} else {%> <p>沒有可下載文件…</p> <%}%> </body></html>2.3 實現(xiàn)文件下載
實現(xiàn)文件下載時,可以先讀取文件到一個”Buffer”中,再通過”res.send()”或”res.end()”方法發(fā)送文件數(shù)據(jù),也可以基于流(”Stream”)實現(xiàn)文件數(shù)據(jù)的發(fā)送。使用”Stream”實現(xiàn)文件下載時,可以使用”fs.createReadStream()”方法創(chuàng)建一個可讀流,而響應(yīng)對象Response是一個可寫流。這樣,只需要通過”.pipe()”方法將文件流轉(zhuǎn)接到Response響應(yīng)流中即可。
文件下載實現(xiàn)代碼如下:
router.get('/file/:fileName', function(req, res, next) { // 實現(xiàn)文件下載 var fileName = req.params.fileName; var filePath = path.join(__dirname, fileName); var stats = fs.statSync(filePath); if(stats.isFile()){ res.set({ 'Content-Type': 'application/octet-stream', 'Content-Disposition': 'attachment; filename='+fileName, 'Content-Length': stats.size }); fs.createReadStream(filePath).pipe(res); } else { res.end(404); }});總結(jié)
以上就是利用Node.js實現(xiàn)HTTP文件下載的全部內(nèi)容,希望對大家學習Node.js有所幫助。
新聞熱點
疑難解答