Websocket 用例 - 未捕获的类型错误：无法在 WebSocket.myWebsocket.onmessage

问题描述

我正在通过 JavaScript 在 Web 应用程序客户端建立一个 websocket 连接，以从我的经纪人的服务器接收股票定价数据。我需要将 onmessage JSON 数据包响应存储在变量中，我可以在后面的 C# 代码上使用这些变量进行进一步处理、存储到 Azure sql 数据库、计算等。从我可以在网上找到的所有内容中，我理解为了存储客户端-用于可访问性背后代码的侧 JavaScript 变量需要通过服务器控件完成 - 特别是所有帖子直接指向的隐藏控件作为解决方案。

当我将任何隐藏控件设置为 runat="server" 以在 myWebsocket.onmessage 服务器响应函数中使用时，它总是在 Chrome 开发控制台中抛出此错误并且无法存储任何数据。 ID 放置在页面的开头，脚本在最后，所以它不是我在其他在线评论中看到的解决错误类型的 ID 放置 - Uncaught TypeError: Cannot set property 'value' of null (none of与 websockets 相关） - 并且似乎特定于与 websocket 连接一起使用。

例如，如果我从 id="Hidden1" 中删除 runat="server"，则在建立 websocket 连接时不会引发任何错误，但是我无法访问代码背后的 JSON 响应数据。任何关于如何完成获取对 C# 代码背后的 onmessage JSON 响应的建议将不胜感激。

未捕获的类型错误：无法在 WebSocket.myWebsocket.onmessage 处设置 null 的属性“值”

    <input id="Hidden1" type="hidden" runat="server"/>        
    <br />
    <input id="Text1" type="text"/>  
    <br />
    <p id="connection"></p>
    <p id="data"></p>  
    <br />
    <asp:HiddenField ID="hiddenField" runat="server"/>


<script type="text/javascript">

    myWebsocket.onopen = function () {
        document.getElementById('connection').innerHTML = "Websocket connected";
    };

    myWebsocket.onclose = function () {
        console.log("CLOSED");
        document.getElementById('connection').innerHTML = "Websocket closed";
    };  

    myWebsocket.onmessage = function (evt) {

        console.log(evt.data);

        document.getElementById('data').innerHTML = evt.data;  //shows the JSON response on UI side,but can't access on code behind

        document.getElementById('Text1').value = evt.data;  //shows the JSON response on UI side,but can't access on code behind

        document.getElementById('hiddenField').value = evt.data;  //can't seem to pass these response data to the code behind with hidden input or HiddenField...        

    };

更新（已解决）：对于任何可能遇到相同问题的人，我发现此实现非常适合将 JavaScript 变量数据传递到 Web 服务并从那里执行数据库存储，然后我可以在后面的代码中使用这些数据:

<script src="Scripts/jquery-3.5.1.js"></script>

<script type="text/javascript">
    
    //called from onmessage
    function data() {

        var responseText = { Response: $('#response').val() };

        $.ajax({
            url: 'DataService.asmx/StoreData',method: "POST",contentType: 'application/json; charset=utf-8',data: '{response:' + JSON.stringify(responseText) + '}',success: function () {
                alert("success");
            },error: function (err) {
                console.log(err);
            }
        });
    }

</script>

<br />
<br /> 
<input id="response" type="text" />

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）