用node.js实现图片上传效果
时间: 2023-07-07 11:07:07 浏览: 67
要实现图片上传,可以使用Node.js的Express框架和multer中间件。
首先,需要安装Express和multer:
```
npm install express multer --save
```
然后,在Express应用中引入multer中间件:
```javascript
const express = require('express');
const multer = require('multer');
const app = express();
const upload = multer({ dest: 'uploads/' });
app.post('/upload', upload.single('image'), (req, res) => {
// 处理上传的图片
});
```
这里使用了`upload.single()`方法,表示只上传一张图片,文件名为`image`。
接下来,可以在`/upload`路由的回调函数中处理上传的图片。例如,将图片存储到本地文件系统中:
```javascript
const fs = require('fs');
const path = require('path');
app.post('/upload', upload.single('image'), (req, res) => {
const tempPath = req.file.path;
const targetPath = path.join(__dirname, 'uploads/image.png');
fs.rename(tempPath, targetPath, err => {
if (err) return handleError(err, res);
res
.status(200)
.contentType('text/plain')
.end('File uploaded!');
});
});
```
这里使用了`fs.rename()`方法将临时文件移动到目标路径,并返回上传成功的消息。
最后,可以在客户端的HTML表单中添加一个文件上传的input元素:
```html
<form action="/upload" method="POST" enctype="multipart/form-data">
<input type="file" name="image" />
<button type="submit">上传</button>
</form>
```
这样,当用户选择图片并提交表单时,图片将会被上传到服务器。