我正在开发一个 Express.js 应用程序，并尝试添加 Multer 上传图像的功能。我遇到了一些问题，因此我们将不胜感激任何形式的帮助。
问题： 该文件未上传，但显示“错误：仅限图像！”当我上传 .jpg 或 .png 文件时。 如果没有选择文件，则一定是“No file selected!”在页面上，但不知何故它不想工作。 我尝试过的： 在 checkFileType 函数中检查文件类型和扩展名。 确保表单的 enctype 属性设置为 multipart/form-data。
问题：图片上传可能会发生什么情况？我将如何修复此错误以及为什么它不会产生正确的消息？ 任何形式的帮助/建议将不胜感激！ 预先感谢！
const express = require('express');
const multer = require('multer');
const path = require('path');
const app = express();
// Set storage engine
const storage = multer.diskStorage({
destination: './uploads/',
filename: function(req, file, cb) {
cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));
}
});
// Initialize upload
const upload = multer({
storage: storage,
limits: { fileSize: 1000000 },
fileFilter: function(req, file, cb) {
checkFileType(file, cb);
}
}).single('myImage');
// Check file type
function checkFileType(file, cb) {
// Allowed ext
const filetypes = /jpeg|jpg|png|gif/;
// Check ext
const extname = filetypes.test(path.extname(file.originalname).toLowerCase());
// Check mime
const mimetype = filetypes.test(file.mimetype);
if (mimetype && extname) {
return cb(null, true);
} else {
cb('Error: Images Only!');
}
}
// Public folder
app.use(express.static('./public'));
// Routes
app.post('/upload', (req, res) => {
upload(req, res, (err) => {
if (err) {
res.render('index', {
msg: err
});
} else {
if (req.file == undefined) {
res.render('index', {
msg: 'No file selected!'
});
} else {
res.render('index', {
msg: 'File uploaded!',
file: `uploads/${req.file.filename}`
});
}
}
});
});
// Start server
const PORT = process.env.PORT || 5000;
app.listen(PORT, () => console.log(`Server started on port ${PORT}`));
**Index.html 代码 **
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Upload</title>
</head>
<body>
<h1>Upload an Image</h1>
<form action="/upload" method="POST" enctype="multipart/form-data">
<input type="file" name="myImage">
<input type="submit" value="Upload">
</form>
<% if (typeof msg != 'undefined') { %>
<p><%= msg %></p>
<% } %>
<% if (typeof file != 'undefined') { %>
<img src="<%= file %>" alt="Uploaded Image">
<% } %>
</body>
</html>
代码中一切都很好！
下面修复了唯一非常小的缺失。代码修复了 mimetypes 检查问题。请检查与原始代码相同的代码，它可能是不言自明的。如果需要澄清，请发表评论。
// Check file type
function checkFileType(file, cb) {
// Allowed ext
const filetypes = /jpeg|jpg|png|gif|txt/;
// Allowed mime
const mimetypes = /image\/jpeg|image\/png|image\/gif/;
// Check ext
const extname = filetypes.test(path.extname(file.originalname).toLowerCase());
// Check mime
const mimetype = mimetypes.test(file.mimetype);
if (mimetype && extname) {
return cb(null, true);
} else {
cb('Error: Images Only!');
}
}