Xin chào và chào mừng đến với Stack Overflow
trong dòng này
app.post('/', upload.single('image'), (req, res, next) => {thay vì upload.single bạn có thể sử dụng
upload.array('image', 12)Vui lòng kiểm tra tài liệu multer để biết tất cả các chi tiết
https. //www. npmjs. com/gói/bộ trộn
Chúng tôi sử dụng nút. js để xây dựng phần phụ trợ của ứng dụng web và một trong những trường hợp sử dụng thường xuất hiện là tính năng tải tệp lên. Trong hướng dẫn này, chúng ta sẽ tìm hiểu và xây dựng một ứng dụng có thể cho phép người dùng tải lên nhiều tệp bằng Node. js
TẢI XUỐNG BẢN demo TRỰC TIẾPứng dụng của chúng tôi
Tôi sẽ phát triển ứng dụng giống như tôi đã thực hiện trong phần hướng dẫn trước với một số thay đổi mã bổ sung giúp tải lên nhiều tệp
Chúng tôi sẽ sử dụng gửi FORM cơ bản cùng với plugin jQuery gửi Ajax để làm cho nó không đồng bộ. Đây là gói của chúng tôi. tập tin json
bưu kiện. json
{
"tên". "file_upload",
"phiên bản": "0. 0. 1",
"phần phụ thuộc". {
"body-parser". "^1. 14. 2",
"express". "4. 13. 3",
"bộ cộng". "1. 1. 0"
},
" . : {
"nên". "~7. 1. 0",
"mocha". "~2. 3. 3",
"siêu hạng". "~1. 1. 0"
}
}
Chạy lệnh sau để cài đặt các phụ thuộc
cài đặt npm
Đây là tệp Máy chủ của chúng tôi với hỗ trợ tải lên nhiều tệp
Người phục vụ. js
var express = yêu cầu ("express");
var bodyParser = require("body-parser");
var multer = require('multer');
var app = express();
app.sử dụng( bodyParser. json()); .
var storage = multer.diskStorage({
đích . hàm ( yêu cầu , tệp . /uploads' , callback) {
callback(null, './uploads');
},
filename: hàm ( yêu cầu , tệp . , callback) {
callback(null, file.tên trường + '-' + Date.bây giờ()); .
}
});
var upload = multer({ storage : bộ nhớ }) . mảng('Ảnh người dùng',2);
app.lấy('/',function(req,res){
res.sendFile( __dirname + " . html");
})< . nhật ký (yêu cầu. body);
app.bài đăng('/api/photo',function(req,res){
upload(req,res,function(err) {
//console.log(req.body);
//bảng điều khiển. nhật ký (yêu cầu. tệp);
if( err ) {
return res.end("Lỗi khi tải tệp lên. ");
}
res. end("Tệp đã được tải lên");
});
});
app.nghe(3000,chức năng . (){
console.log("Làm việc trên cổng 3000");
});
Dòng duy nhất bạn cần tập trung vào là dòng này
var upload = multer ({ storage : bộ nhớ }) . mảng('Ảnh người dùng',2);
Ở đây hơn là. single() chúng tôi đang sử dụng. mảng (bộ chọn, fileLimit) của Multer. Multer sẽ chấp nhận mảng tệp giới hạn tối đa 2 tệp mỗi lần. Tất nhiên bạn có thể tăng số lượng khi bạn cần. Phần còn lại của mã giống như hướng dẫn trước
Đây là tệp HTML của chúng tôi
Mục lục. html
File upload Node.tiêu đề >
đầu >
form>
body>
html>
Đây là mã JavaScript của chúng tôi mà chúng tôi đặt trong cùng một tệp HTML. Bạn có thể đặt nó trong tập tin khác nhau. Đặt mã này bên dưới thẻ đóng của BODY
mục lục. html
tập lệnh >
tập lệnh >
$(document).sẵn sàng(chức năng() . {
$('#uploadForm').gửi(hàm() . {
$("#status").trống() . văn bản("Tệp đang tải lên. ");
$ ( . ).ajaxSubmit({
lỗi . hàm( xhr ) { . '
status('Error: ' + xhr. trạng thái);
}< . ,
success: chức năng( phản hồi ) { .
console.log( phản hồi )
$ . ("#status").trống() . văn bản( phản hồi );
}
});
return false;
});
});
script>
Khi gửi Biểu mẫu, chúng tôi sẽ dừng làm mới trang bằng cách trả về FALSE và gọi API bằng cách sử dụng ajaxSubmit(). Bạn có thể Thêm mã này vào tệp riêng biệt và thêm mã bên dưới jquery. biểu mẫu hoặc sao chép và dán ngay bên dưới dòng này
Chạy ứng dụng
Để chạy ứng dụng, hãy chuyển sang thư mục dự án và gõ lệnh sau
máy chủ nút. js
Truy cập máy chủ cục bộ. 3000 để xem ứng dụng. Chọn nhiều tệp từ cửa sổ lựa chọn và xem bảng điều khiển
nâng cao hơn nữa
Nếu bạn muốn có quyền kiểm soát khác cho tệp thay vì kiểm soát HTML đơn lẻ thì bạn cần xác định quyền kiểm soát nhiều tệp trong HTML có cùng tên để nhận ra Multer rằng đó là mảng tệp. Đây là cách bạn có thể làm điều này. Hiện tại chúng tôi đang sử dụng cái này
< đầu vào loại="tệp"
Bạn có thể viết tương tự như thế này
< đầu vào loại="tệp"
Không cần thay đổi mã back-end cho thay đổi trên
Học cao hơn
Tải tệp lên bằng Node. js
Tải lên tệp Ajax trong Node. js
Nút. js MySQL Tutorial
Hệ thống thông báo đẩy HTML5 sử dụng Nodejs MySQL Socket. io
Sự kết luận
Multer là một trong những mô-đun nút dễ sử dụng mà bạn có thể sử dụng với Express để tải tệp lên. Nó cho phép bạn thêm nhiều xác thực khác nhau và hỗ trợ tải lên một tệp cũng như nhiều tệp