ColdFusion Websocket subscribe () JavaScript does not work when calling page load

I have a ColdFusion base page that uses web ports to subscribe to a feed and then displays / posts messages, i.e. very rude chat app.

The code can be seen below.

Here's the problem: when I click the "Subscribe" button and call SubscribeToChannel(), the user successfully subscribes to the channel, and everything works fine. When I send a message, websocket publishes it just fine. (As indicated in comment number 2)

However, when I call SubscribeToChannel()on the finished document, the function is called, but the user does not sign, since every time I post a message, it does not appear. (As indicated in the comment numbered 1)

So, it SubscribeToChannel()works when called by pressing a button, but not in the process $(function) document ready. What for?

I would like the user to subscribe to the page download, no need to click a button to start the subscription.

(Note: I'm NOT looking to use SubscribeTothe cfwebsocket tag attribute, since it does not allow you to configure parameters.)

<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>
+4
source share
1 answer

moving forward from the comments

Have you tried using the onOpentag attribute cfwebsocket? I think the DOM can be loaded, but the connection to websocket has not yet been established. The attribute onOpenshould provide you with a way to call the JavaScript function after . Websocket establishes a connection.

From the documentation :

onOpen - - JavaScript, , WebSocket .

:

<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 ...
+3

Source: https://habr.com/ru/post/1690344/


All Articles