通过 Websocket 用 Python 控制 Javascript/CSS 元素？答案

【问题标题】：Control Javascript/CSS elements with Python via Websocket?通过 Websocket 用 Python 控制 Javascript/CSS 元素？
【发布时间】：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()

【问题讨论】：

标签： javascript python html css websocket

【解决方案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 文件中。

【讨论】：