通过 Websocket 用 Python 控制 Javascript/CSS 元素?
Posted
技术标签:
【中文标题】通过 Websocket 用 Python 控制 Javascript/CSS 元素?【英文标题】:Control Javascript/CSS elements with Python via Websocket? 【发布时间】:2020-06-14 00:04:56 【问题描述】:我正在尝试通过以下 python 代码控制字体大小属性。我已经通过 Websocket 发送了数据,Python 和 JS 似乎工作得很好。我现在只是试图使用该数据来控制字体大小 JS/CSS 属性,但是我没有运气。以下是我的代码尝试。我做错了什么?
提前致谢! :)
function WebSocketTest()
if ("WebSocket" in window)
alert("WebSocket is supported by your Browser!");
// Let us open a web socket
var ws = new WebSocket("ws://localhost:8768/echo");
ws.onopen = function()
// Web Socket is connected, send data using send()
ws.send("Message to send");
alert("Message is sent...");
;
ws.onmessage = function (evt)
var received_msg = evt.data;
document.querySelector("h1").style.fontSize = evt.data;
;
ws.onclose = function()
// websocket is closed.
;
else
// The browser doesn't support WebSocket
alert("WebSocket NOT supported by your Browser!");
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on June 3, 2020 */
@font-face
font-family: 'spartanthin';
src: url('fonts/SpartanUnconv/Spartan-VariableFont_wght.ttf');
font-weight: 100 900;
font-style: normal;
h1
margin-bottom: 10px;
font-family: 'spartanthin';
font-weight: var(--font-weight);
font-size: 15px;
text-align: left;
position: relative;
<html>
<body>
<h1>Heading</h1>
<p>A Black Fox Jumped Over A Fence</p>
</body>
</html>
Python:
import asyncio
import websockets
async def echo(websocket, path):
async for message in websocket:
await websocket.send(str(900)) #FontSize Value
start_server = websockets.serve(echo, "localhost", 8778)
asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()
【问题讨论】:
【参考方案1】:async for message in websocket:
表示您的服务器只响应来自客户端的消息,而您的客户端不发送任何消息。
这样试试
import asyncio
import websockets
async def echo(websocket, path):
await websocket.send(str(900)) #FontSize Value
start_server = websockets.serve(echo, "localhost", 8778)
asyncio.get_event_loop().run_until_complete(start_server)
asyncio.get_event_loop().run_forever()
另外,将 JS 部分 WebSocket("ws://localhost:8768/echo");
更改为 WebSocket("ws://localhost:8778");
(因此它与您的服务器相对应)。
而且我不确定您是否正在调用该 js 函数,因此如果您在任何地方都没有 WebSocketTest();
,请将其放在 html 中的脚本标记中,或者在 WebSocketTest
函数定义之后直接放置到 js 文件中。
【讨论】:
以上是关于通过 Websocket 用 Python 控制 Javascript/CSS 元素?的主要内容,如果未能解决你的问题,请参考以下文章
在 Python FastAPI 中使用 websocket 并行发送/接收
通过 Websocket 控制器打印从 Stomp 传入的 json 数组