Javascript 如何使用express nodejs上传图像文件并显示
我使用了以下代码: fileupload.htmlJavascript 如何使用express nodejs上传图像文件并显示,javascript,node.js,file-upload,Javascript,Node.js,File Upload,我使用了以下代码: fileupload.html <html> <head> <title>File Uploading Form</title> </head> <body> <h3>File Upload:</h3> Select a file to upload: <br /> <form action="http://127.0.0.1:8081/file_upload"
<html>
<head>
<title>File Uploading Form</title>
</head>
<body>
<h3>File Upload:</h3>
Select a file to upload: <br />
<form action="http://127.0.0.1:8081/file_upload" method="POST" enctype="multipart/form-data">
<input type="file" name="file" size="50" />
<br />
<input type="submit" value="Upload File" />
</form>
</body>
</html>
我已经使用上述代码进行文件上传,但在终端中使用节点fileupload.js时,我得到类型错误TypeError('app.use()需要中间件函数')代码>
任何人都可以帮助解决此问题。您正在尝试使用multer
的旧API。前一段时间它发生了更改,有关详细信息,请参阅
在上载单个文件的特定情况下,您将删除app.use(multer({…}))
行,而改为使用.single()
和req.file
,如:
var upload = multer({ dest: '/tmp/'});
// File input field name is simply 'file'
app.post('/file_upload', upload.single('file'), function(req, res) {
var file = __dirname + '/' + req.file.filename;
fs.rename(req.file.path, file, function(err) {
if (err) {
console.log(err);
res.send(500);
} else {
res.json({
message: 'File uploaded successfully',
filename: req.file.filename
});
}
});
});
Multer将主体对象和一个或多个文件对象添加到请求对象。body对象包含表单文本字段的值,file或files对象包含通过表单上载的文件
使用此代码,希望对您有所帮助
var express = require('express');
var app = express();
var fs = require("fs");
var bodyParser = require('body-parser');
var multer = require('multer');
app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
var upload = multer({ dest: '/tmp' })
app.get('/fileupload.html', function (req, res) {
res.sendFile( __dirname + "/" + "fileupload.html" );
})
app.post('/file_upload', upload.single("file"), function (req, res) {
var file = __dirname + "/" + req.file.originalname;
fs.readFile( req.file.path, function (err, data) {
fs.writeFile(file, data, function (err) {
if( err ){
console.error( err );
response = {
message: 'Sorry, file couldn\'t be uploaded.',
filename: req.file.originalname
};
}else{
response = {
message: 'File uploaded successfully',
filename: req.file.originalname
};
}
res.end( JSON.stringify( response ) );
});
});
})
var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})
上述解决方案不适用于我,因此我使用了存储方法:
var express = require('express');
var app = express();
var fs = require("fs");
var bodyParser = require('body-parser');
var multer = require('multer');
app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: false }));
app.get('/index.htm', function (req, res) {
res.sendFile( __dirname + "/" + "index.htm" );
})
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './uploads/')
},
filename: function (req, file, cb) {
var ext = require('path').extname(file.originalname);
ext = ext.length>1 ? ext : "." + require('mime').extension(file.mimetype);
require('crypto').pseudoRandomBytes(16, function (err, raw) {
cb(null, (err ? undefined : raw.toString('hex') ) + ext);
});
}
});
var upload = multer({ storage: storage });
app.post('/file_upload', upload.any(), function (req, res, next) {
res.send(req.files);
})
保留原始文件名或扩展名似乎不安全,我通过在文件url中添加.jpg找到/制作了以下代码,用于在任何地方直接显示图像:
restapi.get('/uploads/:id', function (req, res) {
var storedMimeType = 'image/jpeg';
res.setHeader('Content-Type', storedMimeType)
fs.createReadStream(path.join('./uploads/', req.params.id).replace(/\.[^/.]+$/, "")).pipe(res)
})
这对我来说是正确的
var express=require('express'),
http=require('http'),
强大=需要(“强大”),
fs=需要('fs'),
路径=要求(“路径”);
var bodyParser=require('body-parser');
var multer=需要('multer');
var upload=multer({dest:'/tmp/'});
var-app=express();
app.get('/',函数(req,res){
res.sendFile(path.join(uu dirname+'/index.html');
});
var server=app.listen(3000,函数(){
console.log('leistening on port',server.address().port);
})
app.post('/upload',upload.single('file'),函数(req,res){
var file='uploads'+'/'+req.file.originalname;
重命名(req.file.path、文件、函数(err){
如果(错误){
res.send(500);
}否则{
res.json({
消息:“文件已成功上载”,
文件名:req.originalname
});
}
});
});代码>
非常感谢您上传了mscdex.Filesuccessfully@SunilGarg当你发布到你的服务器时,确保你在一个名为“文件”的字段中发送你的图像…我如何在数据库表(MySQL)中存储图像路径?这个解决方案还解决了文件上传问题
restapi.get('/uploads/:id', function (req, res) {
var storedMimeType = 'image/jpeg';
res.setHeader('Content-Type', storedMimeType)
fs.createReadStream(path.join('./uploads/', req.params.id).replace(/\.[^/.]+$/, "")).pipe(res)
})