前端传输geojson文件 后端接收文件并将内容插入数据库
时间: 2023-08-01 15:09:56 浏览: 50
前端传输GeoJSON文件可以通过Ajax发送POST请求,将文件作为FormData对象的一个字段上传,后端接收文件后可以使用Node.js中的multer中间件进行解析,然后将GeoJSON数据插入数据库。
以下是一个示例代码:
前端代码:
```javascript
const fileInput = document.querySelector('input[type="file"]');
fileInput.addEventListener('change', () => {
const formData = new FormData();
formData.append('file', fileInput.files[0]);
axios.post('/api/upload', formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(response => {
console.log(response.data);
}).catch(error => {
console.error(error);
});
});
```
后端代码:
```javascript
const express = require('express');
const multer = require('multer');
const { MongoClient } = require('mongodb');
const app = express();
const upload = multer();
app.post('/api/upload', upload.single('file'), async (req, res) => {
const client = await MongoClient.connect('mongodb://localhost:27017');
const db = client.db('mydb');
const collection = db.collection('mycollection');
const data = JSON.parse(req.file.buffer.toString());
await collection.insertOne(data);
client.close();
res.send('File uploaded successfully');
});
app.listen(3000, () => {
console.log('Server started on port 3000');
});
```
在这个示例代码中,我们使用了Express框架和MongoDB数据库。首先,我们创建一个Express应用程序并配置multer中间件来解析上传的文件。然后,我们连接到MongoDB数据库,将GeoJSON数据插入到一个名为“mycollection”的集合中。最后,我们向客户端发送一个成功消息。