建立webSocket链接
1、webSocket是客户端跟服务器建立的长连接,可以双向通信、双向数据传输,允许服务器端对客户端主动推送数据,是建立在TCP协议之上的
wsRef.current = new WebSocket(
`wss://duo.sg.cn/duoduo-service/websocket/webSocket/${qrCodeId}`,
);
// 获取连接状态
console.log('ws连接状态:' + wsRef.current.readyState);
//监听是否连接成功
wsRef.current.onopen = function () {
console.log('ws连接状态:onopen' + wsRef.current.readyState);
//连接成功则发送一个数据 wsRef.current.send('test1');
};
// 接听服务器发回的信息并处理展示
wsRef.current.onmessage = function (data) {
console.log('接收到来自服务器的消息:', data.data);
if (data?.data?.indexOf('token') > -1) {
var info = JSON.parse(data.data);
console.log('登录成功:', info);
var tokenUser = info.tokenUser;
var token = info.token;
var refreshToken = info.token;
localStorage.setItem('user', JSON.stringify(tokenUser));
localStorage.setItem('token', token);
history.push('/home');
//完成通信后关闭WebSocket连接
wsRef.current.close();
}
};
// 监听连接关闭事件
wsRef.current.onclose = function (e) {
// 监听整个过程中websocket的状态
console.log('ws连接状态:onclose' + wsRef.current.readyState);
console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean);
};
// 监听并处理error事件
wsRef.current.onerror = function (error) {
console.log('ws连接状态:error', error);
};