Problem with websocket Tomcat 9. Help needed

I am trying to write my first client-server application using websocket and Tomcat 9 server. I found this example on the Internet. Tomcat gives the jsp file, everything is loaded, but specifically in line 17,

var webSocket = new WebSocket("ws://localhost:8080/[nameOfTheClassWithWebSocket]/ws");

Where websocket is initialized-an error occurs:

"(index):17 WebSocket connection to 'ws://localhost:8080/JavaWebSocket/ws' failed: Error during WebSocket handshake: Unexpected response code: 404"

Tried a lot to check out tutorials, as a result-I came here with a question. The Java code and jsp code are shown below.

Java code:

package socket;
import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/ws")
public class WebSocketServerExample {
    @OnOpen
    public void onOpen(){
        System.out.println("Open Connection ...");
    }

    @OnClose
    public void onClose(){
        System.out.println("Close Connection ...");
    }

    @OnMessage
    public String onMessage(String message){
        System.out.println("Message from the client: " + message);
        String echoMsg = "Echo from the server : " + message;
        return echoMsg;
    }

    @OnError
    public void onError(Throwable e){
        e.printStackTrace();
    }
}

Jsp file:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <meta charset="UTF-8">
  <title>Tomcat WebSocket</title>
</head>
<body>
<form>
  <input id="message" type="text">
  <input onclick="wsSendMessage();" value="Echo" type="button">
  <input onclick="wsCloseConnection();" value="Disconnect" type="button">
</form>
<br>
<textarea id="echoText" rows="5" cols="30"></textarea>
<script type="text/javascript">
    var webSocket = new WebSocket("ws://localhost:8080/JavaWebSocket/ws");
    var echoText = document.getElementById("echoText");
    echoText.value = "";
    var message = document.getElementById("message");
    webSocket.onopen = function(message){ wsOpen(message);};
    webSocket.onmessage = function(message){ wsGetMessage(message);};
    webSocket.onclose = function(message){ console.log(message);};
    webSocket.onerror = function(message){ console.log(message);};
    function wsOpen(message){
        echoText.value += "Connected ... \n";
    }
    function wsSendMessage(){
        webSocket.send(message.value);
        echoText.value += "Message sended to the server : " + message.value + "\n";
        message.value = "";
    }
    function wsCloseConnection(){
        webSocket.close();
    }
    function wsGetMessage(message){
        echoText.value += "Message received from to the server : " + message.data + "\n";
    }
    function wsClose(message){
        echoText.value += "Disconnect ... \n";
    }

    function wserror(message){
        echoText.value += "Error ... \n";
    }
</script>
</body>
</html>

scheme of the project

Author: Mark Andriewski, 2018-11-09

1 answers

The solution was found. The problem was that the context, when loading via Intellij Idea of the Tomcat server, was localhost:8080, and in the example, in the same ill-fated line:

var webSocket = new WebSocket("ws://localhost:8080/JavaWebSocket/ws");

Where JavaWebSocket is the project name, the context was-localhost: 8080/JavaWebSocket.

If I ran it through Tomcat, after moving all the files to the server, then, yes, the example would work correctly, but if I ran it through Idea, the context was incorrect and, accordingly, there was an error. i.e. all that was required was to change the problem line to

var webSocket = new WebSocket("ws://localhost:8080/ws");
 2
Author: Mark Andriewski, 2018-11-11 12:24:23