websocket 实时数据
时间: 2023-12-05 15:40:15 浏览: 48
WebSocket是一种基于TCP协议的全双工通信协议,可以实现实时数据传输。下面是一个简单的WebSocket实时数据的示例:
前端代码:
```javascript
var socket = new WebSocket("ws://localhost:8080/ws"); // 创建WebSocket对象
socket.onmessage = function(event) { // 监听服务器发送的消息
var data = JSON.parse(event.data); // 解析JSON格式的数据
// 处理数据并更新页面
document.getElementById("data").innerHTML = "当前数据:" + data.value;
};
```
后端代码:
```python
import asyncio
import websockets
import random
async def send_data(websocket, path):
while True:
data = {"value": random.randint(1, 100)} # 生成随机数据
await websocket.send(json.dumps(data)) # 发送数据
await asyncio.sleep(1) # 每秒发送一次数据
start_server = websockets.serve(send_data, "localhost", 8080) # 创建WebSocket服务器
asyncio.get_event_loop().run_until_complete(start_server) # 运行服务器
asyncio.get_event_loop().run_forever() # 保持服务器运行
```
以上代码实现了一个每秒钟向前端发送一个随机数的WebSocket实时数据示例。在前端页面中,可以通过WebSocket监听服务器发送的数据,并将数据更新到页面上。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)