快捷導(dǎo)航

Node.js開(kāi)發(fā)教程之基于OnceIO框架實(shí)現(xiàn)文件上傳和驗(yàn)證功能

更新時(shí)間：2016年11月30日 10:24:10 投稿：mrr

這篇文章主要介紹了Node.js開(kāi)發(fā)教程之基于OnceIO框架實(shí)現(xiàn)文件上傳和驗(yàn)證的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下

OnceIO 是 OnceDoc 企業(yè)內(nèi)容(網(wǎng)盤)的底層Web框架，它可以實(shí)現(xiàn)模板文件、靜態(tài)文件的全緩存，運(yùn)行起來(lái)完全不需要I/O操作，并且支持客戶端緩存優(yōu)化，GZIP壓縮等（只在第一次壓縮），擁有非常好的性能，為您節(jié)約服務(wù)器成本。它的模塊化功能，可以讓你的Web進(jìn)行分布式存儲(chǔ)，即一個(gè)擴(kuò)展包里即包含前端、后端和數(shù)據(jù)庫(kù)定義，只需通過(guò)添加/刪除目錄的方式就可實(shí)現(xiàn)功能刪減，實(shí)現(xiàn)真正的模塊化擴(kuò)展。這里是介紹如何使用OnceIO的一系列文章。

在這一章節(jié)中，我們將為大家演示如何使用 OnceIO 實(shí)現(xiàn)文件上傳功能。

在網(wǎng)頁(yè)文件中構(gòu)建表單

以一個(gè)只有文件上傳功能的簡(jiǎn)單網(wǎng)頁(yè) file.html 為例：

<!DOCTYPE html>
<html>
<body>
<form method="post" enctype="multipart/form-data" action="/file/upload">
<input type="file" name="file" /><br>
<input type="submit" value="Upload" />
</form>
</body>
</html>

瀏覽器顯示效果是這樣的：

點(diǎn)擊空白長(zhǎng)條或“瀏覽…”按鈕可以打開(kāi)文件瀏覽窗口選擇需要上傳的文件：

建立服務(wù)器接收文件邏輯

服務(wù)器文件 websvr.js 代碼是這樣的：

var fs = require('fs')
var path = require('path')
var onceio = require('../onceio/onceio')
var app = onceio()
app.get('/', function(req, res){
res.render('file.html')
})
app.file('/file/upload', function(req, res) {
var fileInfo = req.files.file || {}
fs.link(fileInfo.path, path.join('./fileStore', fileInfo.name))
res.send('File Uploaded Successfully')
}).before(function(req, res) {
var contentLength = req.headers['content-length'] || 0
if (contentLength > 1048576) {
res.send({ error: 'Error: File Size Limit (1 MB) Exceeded' })
} else {
return true
}
})

var fs = require('fs') 和 var path = require('path') 分別導(dǎo)入了 Node.js 提供的用于操作文件的文件系統(tǒng)（fs）模塊和用于處理文件路徑的 path 模塊。

app.file(path, callback).before(callback) 相當(dāng)于 app.use(path, callback, {file: true}).before(callback) ，是一個(gè)處理上傳的文件的中間件。

文件被上傳后，它的大小、存放地址、名稱、格式和修改時(shí)間五項(xiàng)信息會(huì)被放在 req.files 的 file 屬性里（名稱是 type 為 'file' 的 input 標(biāo)簽中 name 的值），它的尺寸信息會(huì)被放在 req.headers 的 content-length 屬性里。

before函數(shù)

before是OnceIO與其它Web框架的主要區(qū)別之一。它可以在文件接收之前就對(duì)文件進(jìn)行一些基本驗(yàn)證，如大小、類型等，以求獲得最侍性能。return true 表示驗(yàn)證通并開(kāi)始接收文件，否則就關(guān)閉連接，取消上傳。在 before 中，req.session對(duì)象是不可用的，因?yàn)閟ession可能存在文件或數(shù)據(jù)庫(kù)redis中，取得session是一個(gè)異步過(guò)程需要時(shí)間。而before函數(shù)需要立刻對(duì)文件合法性做出判斷。

在這個(gè)例子中before回調(diào)函數(shù)根據(jù) req.headers 中的 content-length 判斷上傳的文件是否超出了尺寸限制（開(kāi)發(fā)人員可以通過(guò)修改 if 語(yǔ)句中的常數(shù)改變文件上傳尺寸上限，content-length 單位為 byte，1024 * 1024 即代表 1 MB），如果超出了，文件不會(huì)被上傳，服務(wù)器返回錯(cuò)誤信息；如果沒(méi)有超出，函數(shù)返回值為 true，服務(wù)器繼續(xù)執(zhí)行 app.file 中的回調(diào)函數(shù)，將文件從臨時(shí)地址轉(zhuǎn)移到指定存儲(chǔ)地址，文件上傳到這里就完成了。

解決文件重名問(wèn)題

我們目前的服務(wù)器程序是無(wú)法解決文件重名問(wèn)題的。如果用戶上傳了重名的文件，服務(wù)器將會(huì)返回文件已經(jīng)存在的錯(cuò)誤。為了解決這個(gè)問(wèn)題，我們可以在文件的主文件名和拓展名之間加入一個(gè)時(shí)間戳，進(jìn)行這個(gè)處理的函數(shù)代碼如下：

var timestampName = function(fileName){
// get filename extension
var extName = path.extname(fileName) 
// get base name of the file
var baseName = path.basename(fileName, extName)
// insert timestamp between base name and filename extension
// the plus sign ('+') before new Date() converts it into a number
return baseName + +new Date() + extName
}

再把 fs.link 語(yǔ)句里的 fileInfo.name 替換為 timestampName(fileInfo.name)：

fs.link(fileInfo.path, path.join('./fileStore', timestampName(fileInfo.name)))

改進(jìn)后的服務(wù)器程序就能允許用戶上傳重名文件了，以上傳 5 次名為 'cache_workflow.png' 的文件為例，服務(wù)器的文件存儲(chǔ)地址中會(huì)出現(xiàn) 5 個(gè)名稱都以 'cache_workflow' 開(kāi)頭但時(shí)間戳不同的文件：

OnceIO地址： https://github.com/OnceDoc/onceio

示例源碼： https://github.com/OnceDoc/OnceAcademy/tree/master/Lesson14

以上所述是小編給大家介紹的Node.js開(kāi)發(fā)教程之基于OnceIO框架實(shí)現(xiàn)文件上傳和驗(yàn)證，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章: