前端定时请求一个Jason数据,flask接受请求后返回一个Jason数据,前端接收数据后将结果显示在屏幕上
时间: 2023-11-22 13:54:15 浏览: 77
首先,可以使用 `setInterval()` 函数来定时请求 JSON 数据:
```javascript
setInterval(() => {
fetch('/get_json_data')
.then(response => response.json())
.then(data => {
// 处理数据并显示在屏幕上
})
.catch(error => console.error(error));
}, 5000); // 每隔5秒请求一次数据
```
在 Flask 中,可以使用 `@app.route()` 装饰器来处理 `/get_json_data` 路由的请求,并返回 JSON 数据:
```python
from flask import Flask, jsonify
app = Flask(__name__)
@app.route('/get_json_data')
def get_json_data():
data = {'name': 'John', 'age': 30, 'city': 'New York'}
return jsonify(data)
```
在前端接收到数据后,可以通过 DOM 操作将结果显示在屏幕上:
```javascript
const resultDiv = document.getElementById('result');
// 在处理数据的地方添加以下代码:
resultDiv.innerHTML = `Name: ${data.name}<br>Age: ${data.age}<br>City: ${data.city}`;
```
注意:在 HTML 中需要添加一个 `id` 为 `result` 的元素,用于显示结果。
阅读全文