请问在 Express 4.0 里如何使用 Nodejs 实现上传?
请问在 Express 4.0 里如何使用 Nodejs 实现上传?
是要在 app.js
里添加:
app.use(bodyParser({ keepExtensions: true, uploadDir: './public/images' })); ?
我表单的 file
的名字为 file1
,在接收请求里这样子写
router.post('/', function(req, res){
console.log(req.files.file1);
});
会报:
TypeError: Cannot read property 'file1' of undefined
请问如何实现个简单上传?谢谢!
要在 Express 4.0 中实现文件上传,你需要使用 multer
这样的中间件来处理文件上传。以下是一个简单的示例,展示如何配置和使用 multer
来处理文件上传。
安装必要的依赖
首先,确保你已经安装了 express
和 multer
:
npm install express multer
配置 Multer
创建一个名为 upload.js
的文件,并设置 Multer 以指定文件存储目录:
const multer = require('multer');
// 设置存储引擎
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './public/images'); // 指定文件存储路径
},
filename: function (req, file, cb) {
cb(null, file.fieldname + '-' + Date.now() + '.' + file.originalname.split('.').pop());
}
});
const upload = multer({ storage: storage });
module.exports = upload;
在路由中使用 Multer
接下来,在你的路由文件中(例如 routes.js
)使用配置好的 Multer:
const express = require('express');
const router = express.Router();
const upload = require('./upload');
// 处理文件上传的路由
router.post('/upload', upload.single('file1'), function(req, res, next) {
if (!req.file) {
return res.status(400).send('No file uploaded.');
}
res.send(`File uploaded successfully! File name: ${req.file.filename}`);
});
module.exports = router;
在主应用文件中使用路由
最后,在你的 app.js
文件中引入并使用这个路由:
const express = require('express');
const app = express();
const router = require('./routes');
// 使用 Multer 中间件
app.use('/api', router);
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
HTML 表单
为了测试文件上传功能,你可以创建一个简单的 HTML 表单:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Upload File</title>
</head>
<body>
<form action="/api/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file1">
<button type="submit">Upload</button>
</form>
</body>
</html>
将此表单保存为 index.html
并放在你的项目根目录中。
通过以上步骤,你应该能够成功地在 Express 4.0 中实现文件上传。
使用multer中间件 app.use(require(‘multer’)({dest:__dirname + ‘/uploads’}));
我這樣子app.use(connect.multipart({ uploadDir: ‘./public/’ }));已經能夠上傳,但是如何在它沒有保存到文件夾的時候處理它呢?比如重命名?謝謝!
formidable
formidable +1 https://www.npmjs.org/package/formidable coffeescript 示例:
form = new formidable.IncomingForm()
form.parse req, (err, fields, files)->
console.log files
console.log fields
coffeescript + 1
+1
connect-multiparty 的作者已经不推荐使用这个中间件了。其不会在上传后将之前生成的临时文件清除。
最好使用 formidable 或者busboy。
下面是简单的busboy使用示例
busboy = require 'connect-busboy'
...
app.use busboy()
...
app.post '/upload', (req,res)->
req.pipe req.busboy
req.busboy.on 'file', (fieldname, file, filename) ->
...
multiparty 和 busboy 不知道区别是什么,我选的前者,npm下载量是后者的10倍
multer吧 express官方推荐 自豪地采用 CNodeJS ionic
要在Express 4.0中实现文件上传,你需要使用multer
库,而不是bodyParser
。multer
是专门用于处理multipart/form-data
的中间件,适用于文件上传。
首先,安装multer
:
npm install multer --save
然后,你可以设置multer
来处理文件上传,并在你的路由中使用它。以下是一个简单的例子:
设置Multer
创建一个名为upload.js
的文件,并配置multer
:
const multer = require('multer');
// 配置存储引擎
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './public/images'); // 指定文件存储路径
},
filename: function (req, file, cb) {
cb(null, Date.now() + '.' + file.originalname.split('.').pop()); // 使用时间戳加上文件扩展名作为文件名
}
});
const upload = multer({ storage: storage });
module.exports = upload;
在路由中使用Multer
在你的router.js
文件中,引入并使用multer
:
const express = require('express');
const router = express.Router();
const upload = require('./upload');
router.post('/', upload.single('file1'), function(req, res) {
console.log(req.file); // 文件信息
console.log(req.body); // 其他表单数据
res.send('File uploaded successfully.');
});
module.exports = router;
HTML表单
确保你的HTML表单设置为enctype="multipart/form-data"
,并且文件输入字段的名称与你在服务器端使用的名称一致:
<form action="/your-endpoint" method="post" enctype="multipart/form-data">
<input type="file" name="file1">
<button type="submit">Upload</button>
</form>
总结
通过上述步骤,你可以在Express 4.0应用中实现基本的文件上传功能。关键点在于使用multer
代替bodyParser
来处理文件上传。