StompJs正在启动两个websocket连接

Question

React应用程序，@stromp/ststomjs库

如果我启动React应用程序，它会打开2个websocket连接。控制台日志网络日志

若我构建并部署它到服务器，它只打开一个连接。控制台日志网络日志

chat.js

import React from 'react';
import { Client, Message } from '@stomp/stompjs';
function Chat(props) {
const client = new Client({
brokerURL: 'ws://localhost:8088/api/chat',
debug: function (str) {
console.log(str);
},
reconnectDelay: 5000,
});
client.onConnect = function (frame) {
client.subscribe("/chat", function (message) {
console.log("MESSAGE: " + message)
})
};
client.onStompError = function (frame) {
console.log('Broker reported error: ' + frame.headers['message']);
console.log('Additional details: ' + frame.body);
};
client.activate();
return (
<p>chat</p>
);
}
export default Chat

软件包.json

{
"name": "react-test",
"version": "0.1.0",
"private": true,
"dependencies": {
"@stomp/stompjs": "^6.1.0",
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"axios": "^0.21.1",
"dotenv": "^10.0.0",
"http-proxy-middleware": "^2.0.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2",
"websocket": "^1.0.34"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build && mv build/* ../src/main/resources/static'",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

我不想总是构建我的应用程序或接收双重事件。我该怎么解决？

Answer 1

WebSocket是一个"副作用"；React.useEffect修复了

https://stackoverflow.com/a/57809487