javascript - 服务器重新启动时重新启动 JavaScript websocket - 为什么这段代码会重新启动多个 websocket?
问题描述
我正在尝试让websocket 连接在服务器关闭后自动重新启动。
当我在“http://127.0.0.1:5082/”的浏览器中打开页面时,我的示例代码有效。websocket 计数器计数,显示调试文本“消息”。
当我关闭服务器时,会出现调试消息“关闭”,然后“启动/关闭”交替出现。
当我再次打开服务器时,有几十个 websocket 正在运行,并且调试消息在“消息”和“关闭”之间快速变化
如何确保一次只有一个websocket 连接处于活动状态?
最小的例子,使用 Python 的 FastAPI 作为服务器:
索引.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Websocket test</title>
</head>
<body>
<div id="container">
OK - wait for websocket
</div>
<hr noshade>
<div id="debug">
Some debug text here
</div>
<script>
var debug_container = document.getElementById("debug")
debug_container.innerHTML = "Debug: Javascript is running"
function my_websocket() {
debug_container.innerHTML = "starting"
var ws = new WebSocket("ws://localhost:5082/ws")
ws.addEventListener('message', function (event) {
debug_container.innerHTML = "message"
var container = document.getElementById("container")
container.innerHTML = event.data
})
ws.addEventListener('open', function (event) {
debug_container.innerHTML = "open"
})
ws.addEventListener('close', function (event) {
debug_container.innerHTML = "close";
setInterval(my_websocket, 5000);
})
ws.addEventListener('error', function (event) {
debug_container.innerHTML = "error"
})
}
my_websocket()
</script>
</body>
</html>
websocket 由 Python FastAPI 服务器提供服务
import uvicorn
import websockets
from fastapi import FastAPI, WebSocket
from fastapi.responses import HTMLResponse
from pathlib import Path
import asyncio
app = FastAPI()
@app.get('/')
def index():
return HTMLResponse(Path("index.html").read_text())
@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):
await websocket.accept()
cnt = 1
while True:
cnt += 1
try:
await websocket.send_text(f"{cnt}")
except websockets.exceptions.ConnectionClosedOK:
break
await asyncio.sleep(0.25)
if __name__ == '__main__':
uvicorn.run(app=app, host="0.0.0.0", port=5082)
解决方案
客户端建立多个websocket连接的原因是由于以下代码:
ws.addEventListener('close', function (event) {
debug_container.innerHTML = "close";
setInterval(my_websocket, 5000);
})
使用 setInterval 会导致它每 5 秒创建一个新的 websocket 连接。我认为您打算改用 setTimeout() 。
推荐阅读
- mysql - 使用 INNER JOIN 函数插入值的 SQL 错误
- python - Mpl 工具包 plot_surface 未显示任何输出
- c# - Unity 给出“类型或命名空间定义,或预期文件结尾”错误
- makefile - make[1]: 错误问题无事可做
- javascript - 有没有办法将对象而不是数组发送到后端?- 反应JS
- c# - 字典在 c# 中有重复的键与 toDictionary
- autodesk-forge - Forge Autodesk Viewer 窗口在调整大小后被截断
- mongodb - 需要使用 $and
- path - Bitbake 设置 BBPATH:找不到命令
- ios - 如何在 Xcode 中使用 PJSIP 库 - Objective-C