ColdFusion Websocket subscribe()在页面加载时调用JavaScript不起作用

时间:2017-12-06 19:05:21

标签: jquery websocket coldfusion

我有一个基本的ColdFusion页面,它使用websockets订阅一个频道,然后显示/发布消息,即一个非常粗糙的聊天应用程序。

代码如下所示。

问题在于:当我点击“订阅”按钮并拨打SubscribeToChannel()时,用户成功订阅了该频道,一切正常。当我发送消息时,websocket发布它就好了。 (如编号为2的注释所示)

然而,当我在文档上调用SubscribeToChannel()时,函数被调用,但是用户似乎没有被订阅,因为每次我发布消息时,它都不会出现。 (如编号为1的注释所示)

因此,SubscribeToChannel()通过按钮点击调用,但不是$(function) document ready进程。为什么?

我希望用户在页面加载时订阅,而不必单击按钮来启动订阅。

  

(请注意,我不打算使用SubscribeTo属性   cfwebsocket标记,因为它不允许自定义参数。 )

<cfwebsocket
  name="chatWS"
  secure="true"
  onMessage="messageHandler"/>
<doctype html>
<html>
    <head>
        <script
            src="https://code.jquery.com/jquery-3.1.0.min.js"
            integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="
            crossorigin="anonymous">
        </script>
        <script type="text/javascript">

            function subscribeToChannel()
            {
                alert('subscribing');
                chatWS.subscribe("chat", messageHandler);
            }

            messageHandler =  function(aEvent,aToken) {
                if (aEvent.data) {
                    $( "#myChatArea" ).append( aEvent.data  + "<br />");
                }
            }

            sendMessage = function() {
                var msg2Send = $( "#myMessage" ).val();
                if (msg2Send) {
                    chatWS.publish("chat", msg2Send);
                }
            }

            $(function(){
                <!--- 1) Subscribe DOES NOT WORK when called on page ready --->
                subscribeToChannel();
            });

        </script>
    </head>
    <body>
        <div id="myChatArea"><cfoutput>#Application.chatHistory#</cfoutput></div>
        <input type="text" id="myMessage" /><input id="myButton" type="button" value="Send Message" onClick="sendMessage()" />
        <input id="subscribe" type="button" value="Subscribe" onClick="subscribeToChannel()" />
        <!--- 2) Subscribe WORKS when called via this button --->
    </body>
</html>

1 个答案:

答案 0 :(得分:3)

从评论中提升

您是否尝试过使用onOpen代码的cfwebsocket属性?我认为可能会加载DOM,但可能尚未建立websocket连接。 onOpen属性应该为您提供一种在websocket建立连接后调用JavaScript函数的方法。

来自documentation

  

onOpen - 可选 - WebSocket建立连接时调用的JavaScript函数。

添加到您的代码示例:

<cfwebsocket
  name="chatWS"
  secure="true"
  onMessage="messageHandler"
  onOpen="openHandler" />
<doctype html>
<html>
<head>
    <script
        src="https://code.jquery.com/jquery-3.1.0.min.js"
        integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="
        crossorigin="anonymous">
    </script>
    <script type="text/javascript">

        function subscribeToChannel()
        {
            alert('subscribing');
            chatWS.subscribe("chat", messageHandler);
        }

        messageHandler =  function(aEvent,aToken) {
            if (aEvent.data) {
                $( "#myChatArea" ).append( aEvent.data  + "<br />");
            }
        }

        openHandler =  function() {
            subscribeToChannel();
        }


       // the rest of your code here ...