0 Replies Latest reply on Jun 1, 2015 6:57 AM by Kadhem Kacem

    Websocket not working with wildfly 8.0.0/8.1.0/8.2.0 Maven Project

    Kadhem Kacem Newbie

      I've tested maven project for chat that work with websocket with wildfly but it doesn't work, the problem is that "onmessage" javascript event is not fired from the server side that work properly. The same project work fine with glassfish 4.

       

      pom.xml

      <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
        <groupId>tn.esprit</groupId>
        <artifactId>websoket-exemple</artifactId>
        <version>0.0.1-SNAPSHOT</version>
        <packaging>war</packaging>
        <dependencies>
      <dependency>
        <groupId>javax</groupId>
        <artifactId>javaee-api</artifactId>
        <version>7.0</version>
        <scope>provided</scope>
        </dependency>
      </dependencies>
      <properties>
      <maven.compiler.source>1.7</maven.compiler.source>
      <maven.compiler.target>1.7</maven.compiler.target>
      <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
      </properties>
      <build>
      <finalName>${project.artifactId}</finalName>
      <defaultGoal>clean install wildfly:deploy</defaultGoal>
      <plugins>
      <plugin>
      <groupId>org.wildfly.plugins</groupId>
      <artifactId>wildfly-maven-plugin</artifactId>
      <version>1.0.2.Final</version>
      <configuration>
      <port>9997</port>
      <filename>${project.artifactId}.jar</filename>
      </configuration>
      </plugin>
      </plugins>
      </build>
      </project>

       

      index.xhtml

      <!DOCTYPE html>
      <html lang="en">
      <head>
      <meta charset="utf-8">
      <title>hasCode.com - Java EE 7 Websocket Tutorial</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta name="description" content="">
      <meta name="author" content="Micha Kops">
      <script src="resource/js/jquery-1.10.2.min.js"></script>
      <!-- Le styles -->
      <link href="./resource/css/bootstrap.css" rel="stylesheet">
      <style type="text/css">
      body {
      padding-top: 40px;
      padding-bottom: 40px;
      background-color: #f5f5f5;
      }
      .form-signin {
      max-width: 300px;
      padding: 19px 29px 29px;
      margin: 0 auto 20px;
      background-color: #fff;
      border: 1px solid #e5e5e5;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
      -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
      box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
      }
      .form-signin .form-signin-heading,.form-signin .checkbox {
      margin-bottom: 10px;
      }
      .form-signin input[type="text"],.form-signin input[type="password"] {
      font-size: 16px;
      height: auto;
      margin-bottom: 15px;
      padding: 7px 9px;
      }
      #chatroom {
      font-size: 16px;
      height: 40px;
      line-height: 40px;
      width: 300px;
      }
      .received {
      width: 160px;
      font-size: 10px;
      }
      </style>
      <link href="./resource/css/bootstrap-responsive.css" rel="stylesheet">
      <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
      <!--[if lt IE 9]>
        <script src="./resource/js/html5shiv.js"></script>
        <![endif]-->
      <!-- Fav and touch icons -->
      <link rel="apple-touch-icon-precomposed" sizes="144x144"
      href="./resource/ico/apple-touch-icon-144-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="114x114"
      href="./resource/ico/apple-touch-icon-114-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72"
      href="./resource/ico/apple-touch-icon-72-precomposed.png">
      <link rel="apple-touch-icon-precomposed"
      href="./resource/ico/apple-touch-icon-57-precomposed.png">
      <link rel="shortcut icon" href="./resource/ico/favicon.png">
      <script>
      var wsocket;
      var serviceLocation = "ws://localhost:8383/websoket-exemple/chat/";
      var $nickName;
      var $message;
      var $chatWindow;
      var room = '';
      function onMessageReceived(evt) {
      var msg = JSON.parse(evt.data); // native API
      var $messageLine = $('<tr><td class="received">' + msg.received
      + '</td><td class="user label label-info">' + msg.sender
      + '</td><td class="message badge">' + msg.message
      + '</td></tr>');
      $chatWindow.append($messageLine);
      }
      function sendMessage() {
      var msg = '{"message":"' + $message.val() + '", "sender":"'
      + $nickName.val() + '", "received":""}';
      wsocket.send(msg);
      $message.val('').focus();
      }
      function connectToChatserver() {
      room = $('#chatroom option:selected').val();
      wsocket = new WebSocket(serviceLocation + room);
      wsocket.onmessage = onMessageReceived;
      }
      function leaveRoom() {
      wsocket.close();
      $chatWindow.empty();
      $('.chat-wrapper').hide();
      $('.chat-signin').show();
      $nickName.focus();
      }
      $(document).ready(function() {
      $nickName = $('#nickname');
      $message = $('#message');
      $chatWindow = $('#response');
      $('.chat-wrapper').hide();
      $nickName.focus();
      $('#enterRoom').click(function(evt) {
      evt.preventDefault();
      connectToChatserver();
      $('.chat-wrapper h2').text('Chat # '+$nickName.val() + "@" + room);
      $('.chat-signin').hide();
      $('.chat-wrapper').show();
      $message.focus();
      });
      $('#do-chat').submit(function(evt) {
      evt.preventDefault();
      sendMessage()
      });
      $('#leave-room').click(function(){
      leaveRoom();
      });
      });
      </script>
      </head>
      <body>
      <div class="container chat-signin">
      <form class="form-signin">
      <h2 class="form-signin-heading">Chat sign in</h2>
      <label for="nickname">Nickname</label> <input type="text"
      class="input-block-level" placeholder="Nickname" id="nickname">
      <div class="btn-group">
      <label for="chatroom">Chatroom</label> <select size="1"
      id="chatroom">
      <option>arduino</option>
      <option>java</option>
      <option>groovy</option>
      <option>scala</option>
      </select>
      </div>
      <button class="btn btn-large btn-primary" type="submit"
      id="enterRoom">Sign in</button>
      </form>
      </div>
      <!-- /container -->
      <div class="container chat-wrapper">
      <form id="do-chat">
      <h2 class="alert alert-success"></h2>
      <table id="response" class="table table-bordered"></table>
      <fieldset>
      <legend>Enter your message..</legend>
      <div class="controls">
      <input type="text" class="input-block-level" placeholder="Your message..." id="message" style="height:60px"/>
      <input type="submit" class="btn btn-large btn-block btn-primary"
      value="Send message" />
      <button class="btn btn-large btn-block" type="button" id="leave-room">Leave
      room</button>
      </div>
      </fieldset>
      </form>
      </div>
      </body>
      </html>

       

      Endpoint :

       

      package tn.esprit.server;
      import java.io.IOException;
      import java.util.logging.Level;
      import java.util.logging.Logger;
      import javax.websocket.EncodeException;
      import javax.websocket.OnMessage;
      import javax.websocket.OnOpen;
      import javax.websocket.Session;
      import javax.websocket.server.PathParam;
      import javax.websocket.server.ServerEndpoint;
      @ServerEndpoint(value = "/chat/{room}", encoders = ChatMessageEncoder.class, decoders = ChatMessageDecoder.class)
      public class ChatEndpoint {
      private final Logger log = Logger.getLogger(getClass().getName());
      @OnOpen
      public void open(final Session session, @PathParam("room") final String room) {
      log.info("session openend and bound to room: " + room);
      session.getUserProperties().put("room", room);
      }
      @OnMessage
      public void onMessage(final Session session, final ChatMessage chatMessage) {
      String room = (String) session.getUserProperties().get("room");
      try {
      for (Session s : session.getOpenSessions()) {
      if (s.isOpen()
      && room.equals(s.getUserProperties().get("room"))) {
      s.getBasicRemote().sendObject(chatMessage);
      }
      }
      } catch (IOException | EncodeException e) {
      log.log(Level.WARNING, "onMessage failed", e);
      }
      }
      }