One and the same message is perceived as 2, with different ID but with the difference of one number at the end.
Sinevik opened this issue · 3 comments
"react": "^17.0.0"
"@stomp/stompjs": "^7.0.0",
[Google Chrome]
In the console, it comes up with 1 message
But in the code, this message is perceived as 2 with the difference of one number at the end
The problem doesn't always arise. But when it does occur it has a common pattern with a difference of 1 digit at the end
Please check your console output (your screenshot corresponds to packets from only one WebSocket). It is quite likely that your code created two stomp clients. Each subscribed once, so you are seeing two messages in the code.
This issue was reported earlier as well. I noticed in React documentation why it runs twice - https://react.dev/reference/react/useEffect#my-effect-runs-twice-when-the-component-mounts
I usually do not program with React, and I do not use this library with React. So, I got someone to prepare a sample to use this library with React. This structure does not suffer from this problem. In addition, it also covers the case when child components use the client.
Please see https://github.com/stomp-js/rx-stomp-react-sample - start with src/App.js
This sample uses rxStomp - a wrapper over stompjs. The key difference between the two is that in stompjs, the communication methods like subscribe can only be called from within the onConnect callback, while in rxStomp, these can be called anywhere.
It is quite likely that your code created two stomp clients
If that were the case, we'd be seeing 2 subscriptions in the console. But they're not.
This link leads nowhere. Could you please add an actual link
https://github.com/stomp-js/rx-stomp-react-sample
Sorry for my mistake. The repository was marked private. Please access it at https://github.com/stomp-js/rx-stomp-react-sample
Your screenshot is not the console log; it is WebSocket messages (probably from the Network tab in Chrome). Please enable debug output for this library and check the console log. In Chrome, the console will look like the following: