前言

Express默認(rèn)并不處理HTTP請(qǐng)求體中的數(shù)據(jù)，對(duì)于普通請(qǐng)求體(JSON、二進(jìn)制、字符串)數(shù)據(jù)，可以使用body-parser中間件。而文件上傳(multipart/form-data請(qǐng)求)，可以基于請(qǐng)求流處理，也可以使用formidable模塊或Multer中間件。

1. multer中間件

Multer是Express官方推出的，用于Node.jsmultipart/form-data請(qǐng)求數(shù)據(jù)處理的中間件。

它基于busboy構(gòu)建，可以高效的處理文件上傳，但并不處理multipart/form-data之外的用戶請(qǐng)求。

2. 安裝

npm install multer --save

3. 使用

Multer在解析完請(qǐng)求體后，會(huì)向Request對(duì)象中添加一個(gè)body對(duì)象和一個(gè)file或files對(duì)象（上傳多個(gè)文件時(shí)使用files對(duì)象 ）。其中，body對(duì)象中包含所提交表單中的文本字段（如果有），而file(或files)對(duì)象中包含通過(guò)表單上傳的文件。

基本使用示例如下：

var express = require('express')
var multer = require('multer')
var upload = multer({ dest: 'uploads/' })

var app = express()

app.post('/profile', upload.single('avatar'), function (req, res, next) {
 // req.file 是 `avatar` 文件
 // req.body 對(duì)象中是表單中提交的文本字段(如果有)
})

app.post('/photos/upload', upload.array('photos', 12), function (req, res, next) {
 // req.files 是 `photos` 文件數(shù)組
 // req.body 對(duì)象中是表單中提交的文本字段(如果有)
})

var cpUpload = upload.fields([{ name: 'avatar', maxCount: 1 }, { name: 'gallery', maxCount: 8 }])
app.post('/cool-profile', cpUpload, function (req, res, next) {
 // req.files 是一個(gè)對(duì)象 (String -> Array)，文件的字段名是其 key，文件數(shù)組是 key的值
 //
 // 如：
 // req.files['avatar'][0] -> File
 // req.files['gallery'] -> Array
 //
 // req.body 對(duì)象中是表單中提交的文本字段(如果有)
})

在使用中，如果僅需要處理multipart表單中的文本字段，可以使用multer中的.single() 、 .array()或fields()方法。

如，可以像下面這樣使用.array()方法：

var express = require('express')
var app = express()
var multer = require('multer')
var upload = multer()

app.post('/profile', upload.array(), function (req, res, next) {
 // req.body 中包含文本字段
})

4. multer的API

4.1 文件對(duì)象

multer解析完上傳文件后，會(huì)被保存為一個(gè)包含以下字段的對(duì)象：

       fieldname - 表單提交的文件名(input控件的name屬性)

       originalname - 文件在用戶設(shè)備中的原始名稱

       encoding - 文件的編碼類型

       mimetype - 文件的Mime類型

       size - 文件的大小

       destination - 文件的保存目錄(DiskStorage)

       filename - 文件在destination中的名稱(DiskStorage)

       path - 上傳文件的全路徑(DiskStorage)

       buffer - 文件對(duì)象的Buffer(MemoryStorage)

4.2 方法

multer(opts) - 創(chuàng)建對(duì)象

引用multer模塊后，我們會(huì)獲取到一個(gè)頂級(jí)方法。該方法是一個(gè)工廠函數(shù)，可以使用這個(gè)方法創(chuàng)建Multer對(duì)象。它接受一個(gè)選項(xiàng)對(duì)象，最基本的選項(xiàng)是dest，它告訴 Multer 文件的存儲(chǔ)位置。如果忽略該選項(xiàng)，文件會(huì)被保存在內(nèi)存中，并且永遠(yuǎn)不會(huì)寫入硬盤中。

默認(rèn)情況下，Multer會(huì)對(duì)文件進(jìn)行重命令，以避免名稱沖突。重命名函數(shù)，可以按需要自定義。

Multer的選項(xiàng)對(duì)象中可以包含以下值：

       dest或storage - 文件存儲(chǔ)位置

       fileFilter - 函數(shù)，控制可上傳的文件類型

       limits - 上傳數(shù)據(jù)限制(文件大小)

在一般的Web應(yīng)用中，只有dest選項(xiàng)需要設(shè)置。使用示例如下：

var upload = multer({ dest: 'uploads/' })

如果需要對(duì)上傳文件做更多控制，可以使用storage代替dest，Multer會(huì)將存儲(chǔ)引擎由DiskStorage(硬盤存儲(chǔ))切換為MemoryStorage(內(nèi)存存儲(chǔ))。

創(chuàng)建multer對(duì)象后，我們可以使用以下實(shí)例來(lái)接收上傳文件：

.single(fieldname) - 單個(gè)文件上傳

接收一個(gè)名為fieldname的上傳文件，所上傳的文件會(huì)被保存在req.file。

.array(fieldname[, maxCount]) - 多個(gè)文件上傳

接收名為fieldname的，多個(gè)上傳文件數(shù)組?？蛇x參數(shù)maxCount表示可接受的文件數(shù)量，上傳文件數(shù)超出該參數(shù)指定的數(shù)據(jù)后會(huì)拋出一個(gè)錯(cuò)誤。文件數(shù)組會(huì)被保存在req.files中。

.fields(fields) - 多個(gè)文件上傳

接收通過(guò)fields指定的多個(gè)上傳文件。文件數(shù)組對(duì)象會(huì)被保存在req.files中。

fields是一個(gè)包含對(duì)象的數(shù)組，對(duì)象中會(huì)包含name和maxCount兩個(gè)屬性：

[
 { name: 'avatar', maxCount: 1 },
 { name: 'gallery', maxCount: 8 }
]

.none() - 僅解析文本字段

僅解析文本字段。如果請(qǐng)求中有任何上傳文件，會(huì)觸發(fā)'LIMIT_UNEXPECTED_FILE'錯(cuò)誤。這個(gè)方法與upload.fields([])類似。

.any() - 接收所有文件

接收請(qǐng)求中的所有文件。上傳文件數(shù)組會(huì)被保存在req.files中。

4.3 選項(xiàng)參數(shù)

storage - 存儲(chǔ)引擎

該選項(xiàng)有以下兩個(gè)可選項(xiàng)：

       DiskStorage - 硬盤存儲(chǔ)

       MemoryStorage - 內(nèi)存存儲(chǔ)

.diskStorage(obj)與硬盤存儲(chǔ)

硬盤存儲(chǔ)引擎提供了將文件存儲(chǔ)到磁盤的完全控制：

var storage = multer.diskStorage({
 destination: function (req, file, cb) {
 cb(null, '/tmp/my-uploads')
 },
 filename: function (req, file, cb) {
 cb(null, file.fieldname + '-' + Date.now())
 }
})

var upload = multer({ storage: storage })

.diskStorage()方法提供了文件存儲(chǔ)位置控制權(quán)限，該方法接收一個(gè)對(duì)象參數(shù)，其中包含兩destination和filename兩個(gè)屬性。

destination用于設(shè)置文件的存儲(chǔ)目錄，可以是一個(gè)函數(shù)或字符串。若未提供該參數(shù)，將使用系統(tǒng)的臨時(shí)目錄。

filename用于設(shè)置文件名。若未提供該參數(shù)，將使用一個(gè)隨機(jī)字符串，且文件名中不包含擴(kuò)展名。

.memoryStorage()與內(nèi)存存儲(chǔ)

內(nèi)存存儲(chǔ)引擎會(huì)以Buffer的形式將文件保存在內(nèi)存中。該方法沒有任何參數(shù)：

var storage = multer.memoryStorage()
var upload = multer({ storage: storage })

limits - 文件尺寸

該選項(xiàng)用于設(shè)置文件尺寸，Multer 會(huì)將這個(gè)對(duì)象傳遞至busboy中。limits對(duì)象中可以包含以下可選值：

       fieldNameSize - 字段名最大尺寸。默認(rèn)值：100 bytes

       fieldSize - 字段值最大尺寸。默認(rèn)值：1MB

       fields - 非文件字段的最大數(shù)量。默認(rèn)值：Infinity

       fileSize - multipart 表單中，文件的最大尺寸。默認(rèn)值：Infinity

       files - multipart 表單中，文件最大數(shù)量。默認(rèn)值：Infinity

       parts - multipart 表單中，最大組件(fields+files)數(shù)量。默認(rèn)值：Infinity

       headerPairs - 默認(rèn)值：2000

fileFilter - 文件篩選

fileFilter用于控制要哪些文件是可接受的，哪些是要被拒絕的。使用形式如下：

function fileFilter (req, file, cb) {

 // 需要調(diào)用回調(diào)函數(shù) `cb`，
 // 并在第二個(gè)參數(shù)中傳入一個(gè)布爾值，用于指示文件是否可接受

 // 如果要拒絕文件，上傳則傳入 `false`。如:
 cb(null, false)

 // 如果接受上傳文件，則傳入 `true`。如:
 cb(null, true)

 // 出錯(cuò)后，可以在第一個(gè)參數(shù)中傳入一個(gè)錯(cuò)誤：
 cb(new Error('I don\'t have a clue!'))
}

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，如果有疑問大家可以留言交流。

最新評(píng)論