javascript - GridFS/multer - 无法读取未定义的属性“文件名”
问题描述
我不是 Web 开发方面的出色专家(希望至少目前是这样),所以我的问题可能有点愚蠢。
这是我的问题:我一直在研究 Node.Js 并尝试创建一个数据库,我可以在其中上传图片,然后检索它们并通过 .ejs 文件在浏览器上显示它们。
不幸的是,在 app.js 文件中,我能够 console.logimages
数组并检查filename
至少一个文件,同时在 .ejs 文档上循环遍历它:
`<% for(var i = 0; i <= images.length; i++){ %>
<img src="<%= images[i].filename %>">
<% } %>`
我收到此问题标题中显示的错误。
有谁知道我做错了什么?我相信我在 GridFS 或 multer 上设置了一些错误,但我不是 100% 确定。
提前感谢任何将要回复的人。
在这里,您可以找到我目前在 app.js 文件中使用的代码:
var express = require('express'),
mongoose = require('mongoose'),
bodyParser = require('body-parser'),
methodOverride = require('method-override'),
expressSanitizer = require('express-sanitizer'),
path = require('path'),
crypto = require('crypto'),
multer = require('multer'),
GridFsStorage = require('multer-gridfs-storage'),
Grid = require('gridfs-stream'),
app = express();
//connect to the MongoDB database
mongoose.connect("mongodb+srv://***:*****@cluster-***-***-q5eof.mongodb.net/*****?retryWrites=true&w=majority",
{ useNewUrlParser: true,
useUnifiedTopology: true,
useFindAndModify: false,
useCreateIndex: true});
//connect to the MongoDB database
var mongoURI = "mongodb+srv://***:*****@cluster-***-***-q5eof.mongodb.net/*****?retryWrites=true&w=majority";
var conn = mongoose.createConnection(mongoURI)
//parseing incoming request bodies in a middleware before the handlers, available under the req.body property
app.use(bodyParser.urlencoded({extended: true}));
//setting the engine to read directly the ejs files without specifying their extentions on the routes
app.set('view engine', 'ejs');
//serving images, CSS files, and JavaScript files in a directory named public:
app.use(express.static('public'));
//setting method-override to be used via '_method' text before specifying the type of method used in a form
app.use(methodOverride('_method'));
//execute express-sanitizer
app.use(expressSanitizer());
let gfs
conn.once('open', () => {
gfs = Grid(conn.db, mongoose.mongo)
gfs.collection('uploads')
console.log('GRID CONNECTION SUCCESSFUL')
})
//Landing page
app.get('/', function(req, res){
gfs.files.find().toArray(function(err, images){
if(err){
console.log(err)
} else {
images.map(function(image){
image.isImage = true;
});
}
res.render('landing', {images: images});
console.log(images[0].filename);
});
});
//Create storage engine
var storage = new GridFsStorage({
url: mongoURI,
file: (req, file) => {
return new Promise((resolve, reject) => {
crypto.randomBytes(16, (err, buf) => {
if (err) {
return reject(err);
}
const filename = buf.toString('hex') + path.extname(file.originalname);
const fileInfo = {
filename: filename,
bucketName: 'uploads'
};
resolve(fileInfo);
});
});
}
});
const upload = multer({ storage });
//Upload page
app.get('/upload', function(req, res){
res.render('upload');
});
//Sending form from upload page
app.post('/upload', upload.array('file'), function(req, res){
res.json({file: req.files});
});
app.listen('3000', function(err){
if(err){
console.log(err)
} else{
console.log("APP CONNECTED")
}
});
解决方案
这对你有用,示例代码
const multer = require('multer'); //FOR FILE UPLOAD
let storage = multer.diskStorage({ //multers disk storage settings
destination: function (req, file, cb) {
cb(null, './public');
},
filename: function (req, file, cb) {
let datetimestamp = Date.now();
cb(null, file.originalname);
}
});
let upload = multer({ //multer settings
storage: storage
}).single('file');
let uploadfile = (req, res, next) => {
let path = '';
upload(req, res, function (err) {
if (err) {
return res.status(422).send("an Error occured");
}
let path = req.file.path;
req.file = path;
next();
});
}
推荐阅读
- function - 如何编写函数来计算除数?
- r - 如何通过基于某些逻辑标准选择的值来合并数据框?
- linkedin - 为什么我无法通过 api 更新 Campaign Group 总预算?
- javascript - 在 TCPConnectWrap.afterConnect 处连接 EACCES 0.0.0.0:443
- c# - 通过 MIM .dll 调用时,无法从任何应用程序调用 cmd.exe
- r - R插入元素如何将元素插入向量
- excel - Power Query: Include all unique columns found in files from folder
- tampermonkey - 如何使 Tampermonkey 用户脚本替换文本文件中的单词?
- rest - Microsoft Graph API Planner Task Detail with hyperlinks
- python - 如何使用用于为模块范围固定装置播种的相同代码正确地对函数进行 pytest