Port 8888 not working (websockets)

dev support
15

So I’ve played a little with this extension, and everything seems to go pretty well just as described in Igal Sapirs instructions.

What I understand from your post is that in your configuration you can access Lucee on port 80, but not on port 8888? That means that, or you have:

  • a webserver (like Apache or IIS)) in front of Lucee and Lucee is not running on its default port:8888, or
  • Lucee is running as stand alone on port:80

To identify that, please look for the port Lucee/Tomcat is running on, by opening your server.xml at {installation path}\lucee\conf\server.xml and search for connector port". If its 8888 then you should be able to access http://localhost:8888 without any problem, unless something else is conflicting (e.g. firewall, another webserver or service running on port 8888, or hardcoded hosts-file entry for localhost pointing to another IP).

Here I am posting my step by step instructions of what I’ve done:

My System:
OS: Win10
Java: Zulu 8.36.0.1-CA-win64 (build 1.8.0_202-b05)
  1. Downloaded the latest stable Express Version 5.3.3.62
  2. Started Lucee and logged into server-admin at: http://localhost:8888/lucee/admin/server.cfm
  3. From that server-admin-page at Extensions => Applications I installed Igals websocket extension 2.0.3
  4. Downloaded servlet-filter-utils-1.1.1.jar from
    https://github.com/isapir/lucee-websocket/releases/download/2.0.2/servlet-filter-utils-1.1.1.jar to the folder *{installation path}\lucee\lib\ext*
  5. Stopped Lucee
  6. Deleted all the files/folders inside the webroot:
    {installation path}\lucee\webapps\ROOT\
  7. Added the following code just before the <welcome-file-list> tag at the bottom of {installation path}\lucee\conf\web.xml:
 <!-- Required for the Lucee WebSocket Extension !-->    
    <filter>
      <filter-name>HttpSessionInitializerFilter</filter-name>
      <filter-class>net.twentyonesolutions.servlet.filter.HttpSessionInitializerFilter</filter-class>
    </filter>

    <filter-mapping>
      <filter-name>HttpSessionInitializerFilter</filter-name>
      <!-- modify url-pattern to match your websocket endpoints !-->
      <url-pattern>/ws/*</url-pattern>
    </filter-mapping>
  1. Created the three files:
    {installation path}\lucee\webapps\ROOT\ChatListener.cfc
    {installation path}\lucee\webapps\ROOT\Application.cfc
    just as posted from the wikis chat-example at:
    Example Chat · isapir/lucee-websocket Wiki · GitHub
    For {installation path}\lucee\webapps\ROOT\index.cfm try this slightly modified code:
<!--- index.cfm --->
<html>
<cfscript>
    /** ensure that we have Session.username and set a default channel */

    if (!isNull(URL.username))
        Session.username = URL.username;

    if (isEmpty(Session.username ?: "")){

        echo("<p>Session.username is not defined. Set it using the URL parameter username, e.g. ?username=Lucy");
        abort;
    }

    param name="channel" default="default";
</cfscript>


<cfoutput>
    <!--- JavaScript follows !--->
    <script>
        function sendText(){
            var texttosend=document.getElementById("texttosend").value;
            wschat.send(texttosend);
            document.getElementById("texttosend").value='';
        }

        var channel  = "#channel#";
        var endpoint = "/ws/chat/" + channel;
        var protocol = (document.location.protocol == "https:") ? "wss://" : "ws://";

        var wschat   = new WebSocket(protocol + document.location.host + endpoint);

        var log = function(evt){
            console.log(evt.data ? JSON.parse(evt.data) : evt);
        };
        var writemessage=function(evt){
            console.log(evt.data ? JSON.parse(evt.data) : evt);
            if(evt.data){
                res=JSON.parse(evt.data);
                document.getElementById("chatcontent").insertAdjacentHTML("afterbegin", res.FROM+': <b>'+ res.MESSAGE+'</b> <i>at '+res.TIMESTAMP+'</i></br>');
            }
        };
        wschat.onopen    = log;
        wschat.onmessage = writemessage;
        wschat.onerror   = log;
        wschat.onclose   = log;

        document.title   = `#Session.username# on ${channel}`;
        document.write(`<p>[wschat] connected to "${channel}" as "#Session.username#"`);
    </script>
</cfoutput>
<style type="text/css">#inputfield{position:fixed;bottom: 0; left:0;padding:30px;} #texttosend{width:100%;}</style>
<body>
    <div id="chatcontent"></div>
    <div id="inputfield">
        <input type="text" id="texttosend">
        <button onClick="sendText();">Send</button>
    </div>
</body>
</html>
  1. Started Lucee
  2. Opened in Chrome: http://localhost:8888/?username=User1 and opened its WebDevTool by pressing F12 (with the console-view)
  3. Opened in Firefox http://localhost:8888/?username=User2 and opened its WebDevTool by pressing F12 (with the console-view)
  4. Entered in Chromes WebDevTool Console console>wschat.send('This is a test');
  5. Confirmed the receipt of the message within the Console of Firefox

Igals websocket works as espected. Important to know is that this chat example is not a 100% finished chat. It just sends messages and receives JSON data and logs it to the respective consoles. It’s up to you to create a front end with that.

Hope that helps a little.