如何使用Python (使用websockets的服务器)和JavaScript (客户端)接收JSON数据
如何使用Python (使用websockets的服务器)和JavaScript (客户端)接收JSON数据
提问于 2018-07-13 11:02:47
在从作为服务器的Python接收JSON数据时，我遇到了一个新问题。我需要告诉您，服务器是基于WebSockets的，我正在成功地将JSON数据从Python发送到JavaScript，但是我找不到任何源--如何继续使用这些数据来解析这个数据，并在不同的div中显示它，比如id="message-1" div中的first_name值，message2 div中的second_name值等等。您能帮我找出这一点吗？下面是我的firefox返回的代码和图片：网页。
我几乎忘记提到我正在使用本地主机和xampp或ngrok来“托管”我的客户端。另外，还有一个连接，因为我在网站上以及python控制台上都收到了日志
(预先谢谢:)
下面是python代码：
import asyncio
import websockets
import json
async def time(websocket, path):
while True:
d = {'first_name': 'Guido',
'second_name': 'Rossum',
'titles': ['BDFL', 'Developer'],
}
parsed = json.dumps(d)
name = "Jeremy"
# now = datetime.datetime.utcnow().isoformat() + 'Z'
for i in range(1):
await websocket.send(parsed)
response = await websocket.recv()
print(response)
start_server = websockets.serve(time, '127.0.0.1', 4040)
asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()这里是HTML/JS代码
<body>
<div id="message-1"></div>
<div id="message-2"></div>
<div id="message-3"></div>
<script>
var ws = new WebSocket("ws://127.0.0.1:4040/");
ws.onopen = function () {
ws.send('Hello, Server!!');
//send a message to server once ws is opened.
console.log("It's working onopen log / awake");
};
ws.onmessage = function (event) {
if (typeof event.data === "string") {
// If the server has sent text data, then display it.
console.log("On message is working on log with onmessage :)");
var label = document.getElementById("message-1");
label.innerHTML = event.data;
}
};
ws.onerror = function (error) {
console.log('Error Logged: ' + error); //log errors
};
</script>
</body>回答 1
Stack Overflow用户
回答已采纳
发布于 2018-07-19 17:32:44
您需要解析收到的消息并将其附加到dom！
ws.onmessage = function (event) {
try {
var obj = JSON.parse(event.data);
document.getElementById("message-1").innerHTML = obj.first_name;
document.getElementById("message-2").innerHTML = obj.second_name;
document.getElementById("message-3").innerHTML = obj.titles.join(" ");
} catch {
console.log("Object is not received, Message is:: ", event.data);
}
}如果这不起作用，那么检查您要发送的json格式！
记住JSON必须是有效的json，将
'(单引号)替换为"(双引号)：
d = {
"first_name": "Guido",
"second_name": "Rossum",
"titles": ["BDFL", "Developer"]
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51323651
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号