![](/img/trans.png)
[英]Display image in Background Url from MongoDB using NodeJS and Angular6
[英]retrieve an image from mongodb and display it using angular7
我已经使用带有disk storage
multer
上传了图像
在项目文件夹中我只有文件名
IE
filename: "1561256874022.jpg"
而从 mongo 我得到这个对象
destination: "C:\Users\Me\Desktop\project\testing\server\routes/src/assets/images"
encoding: "7bit"
fieldname: "file"
filename: "1561256874022.jpg"
mimetype: "image/jpeg"
originalname: "new.jpg"
path: "C:\Users\Me\Desktop\project\testing\server\routes\src\assets\images\1561256874022.jpg"
size: 1256070
__proto__:Object
API 发布请求
var storage = multer.diskStorage({
destination: function (req, file, cb) {//destination where images will store
cb(null, __dirname + '/src/assets/images')
},
filename: function (req, file, callback) {
callback(null, Date.now() + path.extname(file.originalname));
}
})
//configuration
const upload = multer({
storage: storage,
})
//post data
router.post('/image', upload.single('file'), async (req, res) => {
try {
var newImage = new Image();
newImage.file = req.file;
newImage.description = req.body.description;
await newImage.save();
res.status(200).send(newImage);
}
catch (e) {
console.log("failed " + e);
}
})
API 获取请求
router.get('/image/:id', (req, res) => {
Image.findById(req.params.id)
.exec(function (err, data) {
if (err) {
console.log('error');
}
else {
console.log("image returned "+data)
res.json(data);
}
})
});
组件.ts
ngOnInit() {
this.route.paramMap.pipe(
switchMap((params: ParamMap) =>
this.videoService.editVideo(params.get('id')))).subscribe(res=>{this.video=res});
}
组件.html
<img [src]="video.file.filename | safe" alt="not found" width="100px" height="150px">
从api获取响应但在浏览器中我有这个错误
core.js:15714 ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: '1561256874022.jpg' Error: Cannot match any routes. URL Segment: '1561256874022.jpg'
我认为您的图像已保存在图像文件夹中,但您正在尝试直接在根文件夹中访问图像。 尝试将images/
添加为 . 图像路径的前缀,它应该可以工作。
尝试 :
<img [src]="'images/'+video.file.filename | safe" alt="not found" width="100px" height="150px">
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.