Spring websockets not receiving data - spring

Question

Im trying spring websockets and for some reason i dont understand, i can establish connection with the server but when i send data nothing happens.
Here is my Config class (exatcly equal to other spring websocket examples):
#Configuration
#EnableWebSocketMessageBroker
public class WebSocketsConfig extends AbstractWebSocketMessageBrokerConfigurer {
#Override
public void configureMessageBroker(MessageBrokerRegistry config) {
config.enableSimpleBroker("/topic");
config.setApplicationDestinationPrefixes("/app");
}
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/ws").withSockJS();
}
}
My controller, in a package where i ensure that spring inicialites it, as i shee the init() message with the #PostConstruct annotation. As you see i wrote System.out.println to see in the console if the method triggers but this never happens, so data never gets to the controller:
#Controller
public class MonitorSpring {
#PostConstruct
protected void init() {
System.out.println("init()");
}
#MessageMapping("/sendmessage")
#SendTo("/topic/message")
public ChatMessage sendMessage(#Payload ChatMessage chatMessage) {
System.out.println("sendMessage here");
return chatMessage;
}
#MessageMapping("/adduser")
#SendTo("/topic/user")
public ChatMessage addUser(#Payload ChatMessage chatMessage, SimpMessageHeaderAccessor headerAccessor) {
System.out.println("addUser here");
headerAccessor.getSessionAttributes().put("username", chatMessage.getSender());
return chatMessage;
}
}
And finaly my JavaScript client, i will abbreviate putting only the important parts here:
function connect(event) {
username = document.querySelector('#name').value.trim();
if(username) {
usernamePage.classList.add('hidden');
chatPage.classList.remove('hidden');
var socket = new SockJS('https://' + document.location.host + '/ws');
stompClient = Stomp.over(socket);
stompClient.connect({}, onConnected, onError);
}
event.preventDefault();
}
function onConnected() {
stompClient.subscribe('/topic/message', onMessageReceived);
stompClient.subscribe('/topic/user', onMessageReceived);
stompClient.send("/app/adduser", {}, JSON.stringify({sender: username, type: 'JOIN'}))
connectingElement.classList.add('hidden');
}
function sendMessage(event) {
var messageContent = messageInput.value.trim();
if (messageContent && stompClient) {
var chatMessage = {
sender: username,
content: messageInput.value,
type: 'CHAT'
};
stompClient.send("/app/sendmessage", {}, JSON.stringify(chatMessage));
messageInput.value = '';
}
event.preventDefault();
}
I do connect and create the websocket without any problem, but when i send something to the server
i see this message in the chrome console but nothing happens on the server:
>>> SEND
destination:/app/sendmessage
content-length:53
{"sender":"user1","content":"message1","type":"CHAT"}
What could i be doing wrong?

Answer 1

First of all, you should implements WebSocketMessageBrokerConfigurer instead of AbstractWebSocketMessageBrokerConfigurer because is deprecated.
When you connect to the websocket
var socket = new SockJS('https://' + document.location.host + '/ws');
you should connect to the http endpoint
var socket = new SockJS('http://' + document.location.host + '/ws');
If you trying to send message to the https and dont have the certificates configured it might reject your messages.

Answer 2

Not sure if someone still facing these issues.
For anyone in the future
In addition to TOvidiu's answer, you should allow cross-origin header
registry.addEndpoint("/ws").setAllowedOrigins("*").withSockJS();

Answer 3

I will try to help you, I have a chat application, where user can not just chat also can upload images, even bookings using the spring and stomp, as I can check your code, I cant finally get the right issue with it but if you accept from me I can suggest some small changes wish that can be helpful to solve your issue.
for
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/ws").withSockJS();
}
can you change it to something like this?
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/chat").setAllowedOrigins("*").withSockJS();
}
and edition with the connection to stomp in JS
var socket = new SockJS('https://' + document.location.host + '/ws');
stompClient = Stomp.over(socket);
can you use this code?
function connectToChat(userName) {
let socket = new SockJS(url + '/chat');
console.log("socket.name", socket.name)
console.log("WebSocket.name", WebSocket.name)
stompClient = Stomp.over(socket);
console.log("stompClient = ", stompClient)
stompClient.connect({}, function (frame) {
console.log('Connected: ' + frame);
successCallback(userName);
}, () => {
reconnect(url, successCallback, userName);
});
}
function successCallback(userName) {
stompClient.subscribe("/topic/messages/" + userName, function (response) {
let data = JSON.parse(response.body);
console.log("data ", data);
if (selectedUser === data.to) {
render(data.message, data.from);
}
});
}
function reconnect(socketUrl, successCallback, userName) {
let connected = false;
let reconInv = setInterval(() => {
//let socket = new WebSocket(url +'/chat')
let socket = new SockJS(url + '/chat');
stompClient = Stomp.over(socket);
stompClient.connect({}, (frame) => {
clearInterval(reconInv);
connected = true;
successCallback(userName);
}, () => {
if (connected) {
reconnect(socketUrl, successCallback, userName);
}
});
}, 3000);
}
make sure that your link is the right one, for my code, I'm using
let socket = new SockJS(url + '/chat');
regarding HTTP or HTTPS if you are using stomp, it will understand if the link is with SSL or not.
finally, the first user must connect to the second user but in your case, you have 2 links
stompClient.subscribe('/topic/message', onMessageReceived);
stompClient.subscribe('/topic/user', onMessageReceived);
solve this issue so the socket can understand to which user to connect and send the message from the chat.
Wish I was helpful and wish that you can solve your issue.
finally, let me show you the exact configuration for the links to connect
#Configuration
#EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
#Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/chat").setAllowedOrigins("*").withSockJS();
}
#Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
registry.setApplicationDestinationPrefixes("/app").enableSimpleBroker("/topic");
}
}

Answer 4

try this
var socket = new SockJS('/ws');
this worked for me