Search code examples
spring-bootspring-websocketstomp

Cannot connect websocket over servlet.context.path

I have a spring boot application (2.0.5.RELEASE) which is running on port 8989. The application sends the log messages over websocket to the client. i have created a javascript client that connects to the websocket and appends the messages to the html text area. This client is under the resource\static\js folder of the application. It works fine, when i dont use servet.context.path. Is there any way, i can work it out with context path. Am i missing some configurational parameter? I would really appreciate your help in this regard.

Application.properties

server.port=8989
server.servlet.contextPath=/DemoService/webresources/test/

The Websocket config is mentioned below:

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    /**
     * Register Stomp endpoints: the url to open the WebSocket connection.
     */
    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {

        // Register the "/websocket" endpoint, enabling the SockJS protocol.
        // SockJS is used (both client and server side) to allow alternative
        // messaging options if WebSocket is not available.
        registry.addEndpoint("/websocket").setAllowedOrigins("*").withSockJS();
    }

    @Override
    public void configureMessageBroker(MessageBrokerRegistry registry) {
        registry.enableSimpleBroker("/topic");
        registry.setApplicationDestinationPrefixes("/app");
    }

}

The client looks like this,

 $(window).ready(function() {
    connect();
});

function connect() {
//  var socket = new SockJS('/websocket');
    var socket = new SockJS('/DemoService/webresources/test/websocket');
    stompClient = Stomp.over(socket);
    stompClient.connect({}, function(frame) {
        stompClient.subscribe('/topic/pushlognotification', function(
                notification) {
            var txt = $('#textArea');
            txt.val(txt.val() + "\n" + "\n" + notification);
            txt.scrollTop(txt[0].scrollHeight);
        });
    });
}

HTML page is :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Messages</title>
</head>
<body>
<textarea type="text"  id="textArea" placeholder="Messages..." rows="15" cols="60"></textarea>

<script src='js/jquery.min.js'></script>
<script src="js/index.js"></script>
<script src="/webjars/sockjs-client/sockjs.min.js"></script>
<script src="/webjars/stomp-websocket/stomp.min.js"></script>
</body>
</html>
Solution

  • found out the solution after examining the console output.

    The HTML code could not find the registered files through src such as 'js/jquery.min.js' etc. because of the configured context paths. The solution is either append the context path to all the src like below.

    or give a "." sign

    this worked for me.