node+express 使用 multer 上传的图片怎么让前端显示？
2023-11-17 阅读 49
在使用Node.js和Express.js的情况下，你可以使用Multer中间件来处理文件上传。一旦文件上传成功，你可以将文件保存在服务器的特定目录中，并将文件名或路径保存到数据库中。
要在前端显示上传的图片，你可以通过以下步骤进行操作：
-
在Express的路由处理程序中，将上传的图片保存在服务器的指定目录中。你可以使用
fs模块来处理文件操作。确保你的服务器有权限写入文件。const fs = require('fs'); // ... app.post('/upload', upload.single('image'), (req, res) => { // 保存上传的图片 const imagePath = 'path/to/save/image/' + req.file.filename; fs.writeFileSync(imagePath, req.file.buffer); // 将图片路径保存到数据库中 // ... res.send('Upload successful'); }); -
在前端，你可以使用
<img>标签来显示上传的图片。将图片的URL设置为服务器上保存的图片路径。<img src="/path/to/save/image/filename.jpg" alt="Uploaded Image">注意，
/path/to/save/image/filename.jpg应该替换为实际的图片路径。 -
当用户访问包含上传图片的页面时，服务器将根据请求返回相应的HTML页面，并在其中包含上传图片的
<img>标签。
这样，当用户访问包含上传图片的页面时，页面将显示上传的图片。
请注意，这只是一个简单的示例，你可以根据自己的需求进行修改和扩展。另外，确保在生产环境中使用合适的安全措施来处理文件上传，例如限制文件类型、大小和路径等。
更新于 2023年11月17日
