我刚刚完成了一个解决方案。此解决方案适用于 Ajax,因此您可以使用fetch
Javascript 中的调用。奇怪的是,在整个互联网上都找不到这个解决方案,这就是为什么我要帮助其他想要使用数据 uri 处理图像的人 :-)
型号:
cmsImage: { data: Buffer, contentType: String }
存储在 MongoDB 中:
let rawData = fs.readFileSync(`${root}public/uploads/` + file.originalname);
let base64Data = Buffer.from(rawData).toString('base64');
// upload this image
let image = {
cmsImage: {
data: base64Data,
contentType: file.mimetype
}
};
// in this record in the database
await this.model.findByIdAndUpdate(body.id, image);
从 MongoDB检索并动态创建图像元素:
// decode image from database as image uri
let imageArray = new Int8Array(image.data.data);
let decodedImage = new TextDecoder().decode(imageArray);
// image
let cmsImage = document.createElement("img");
cmsImage.src = "data:" + image.contentType + ";base64," + decodedImage;
cmsImage.alt = "image";
cmsContent.appendChild(cmsImage);
Multer - 使用 originalfile 上传到数据库。
let storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './public/uploads')
},
filename: function (req, file, cb) {
cb(null, file.originalname)
}
});
this.upload = multer({ storage: storage });
上传到目录
this.upload.single(uploadImage)