La123123.
/
im-backed
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

!25 ws优化 

Merge pull request !25 from blue/v_2.0.0
master
blue 2 years ago
committed by Gitee
parent
3697c561cf d385e21da6
commit
0da51527fb
No known key found for this signature in database GPG Key ID: 173E9B9CA92EEF8F
7 changed files with 136 additions and 138 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 17
      im-platform/src/main/java/com/bx/implatform/service/impl/PrivateMessageServiceImpl.java
  2. 53
      im-ui/src/api/wssocket.js
  3. 22
      im-ui/src/view/Home.vue
  4. 28
      im-uniapp/App.vue
  5. 13
      im-uniapp/common/request.js
  6. 123
      im-uniapp/common/wssocket.js
  7. 10
      im-uniapp/pages/chat/chat.vue

17
im-platform/src/main/java/com/bx/implatform/service/impl/PrivateMessageServiceImpl.java
View File

@ -62,25 +62,12 @@ public class PrivateMessageServiceImpl extends ServiceImpl<PrivateMessageMapper,
this.save(msg); this.save(msg);
// 推送消息 // 推送消息
PrivateMessageVO msgInfo = BeanUtils.copyProperties(msg, PrivateMessageVO.class); PrivateMessageVO msgInfo = BeanUtils.copyProperties(msg, PrivateMessageVO.class);
IMPrivateMessage<PrivateMessageVO> sendMessage = new IMPrivateMessage<>(); IMPrivateMessage<PrivateMessageVO> sendMessage = new IMPrivateMessage<>();
// 发送方的id和终端类型 sendMessage.setSender(new IMUserInfo(session.getUserId(),session.getTerminal()));
sendMessage.setSender(new IMUserInfo(1L, IMTerminalType.APP.code())); sendMessage.setRecvId(msgInfo.getRecvId());
// 对方的id
sendMessage.setRecvId(2L);
// 推送给对方所有终端
sendMessage.setRecvTerminals(IMTerminalType.codes());
// 同时推送给自己的其他类型终端
sendMessage.setSendToSelf(true); sendMessage.setSendToSelf(true);
// 需要回推发送结果，将在IMListener接收发送结果
sendMessage.setSendResult(true);
// 推送的消息体
sendMessage.setData(msgInfo); sendMessage.setData(msgInfo);
// 推送消息
imClient.sendPrivateMessage(sendMessage); imClient.sendPrivateMessage(sendMessage);
log.info("发送私聊消息，发送id:{},接收id:{}，内容:{}", session.getUserId(), dto.getRecvId(), dto.getContent()); log.info("发送私聊消息，发送id:{},接收id:{}，内容:{}", session.getUserId(), dto.getRecvId(), dto.getContent());
return msg.getId(); return msg.getId();
} }

53
im-ui/src/api/wssocket.js
View File

@ -2,29 +2,27 @@ var websock = null;
let rec; //断线重连后，延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码 let rec; //断线重连后，延迟5秒重新创建WebSocket连接 rec用来存储延迟请求的代码
let isConnect = false; //连接标识 避免重复连接 let isConnect = false; //连接标识 避免重复连接
let wsurl = ""; let wsurl = "";
let userId = null;
let accessToken = ""; let accessToken = "";
let messageCallBack = null; let messageCallBack = null;
let openCallBack = null; let openCallBack = null;
let hasLogin = false; let closeCallBack = null
let createWebSocket = (url, id,token) => {
let init = (url,token) => {
wsurl = url; wsurl = url;
userId = id;
accessToken = token; accessToken = token;
initWebSocket();
}; };
let initWebSocket = () => { let connect = () => {
try { try {
console.log("初始化WebSocket"); if (isConnect) {
closeWebSocket(); return;
hasLogin = false; }
console.log("连接WebSocket");
websock = new WebSocket(wsurl); websock = new WebSocket(wsurl);
websock.onmessage = function(e) { websock.onmessage = function(e) {
let sendInfo = JSON.parse(e.data) let sendInfo = JSON.parse(e.data)
if (sendInfo.cmd == 0) { if (sendInfo.cmd == 0) {
hasLogin = true;
heartCheck.start() heartCheck.start()
console.log('WebSocket登录成功') console.log('WebSocket登录成功')
// 登录成功才算连接完成 // 登录成功才算连接完成
@ -32,15 +30,17 @@ let initWebSocket = () => {
} else if (sendInfo.cmd == 1) { } else if (sendInfo.cmd == 1) {
// 重新开启心跳定时 // 重新开启心跳定时
heartCheck.reset(); heartCheck.reset();
console.log("")
} else { } else {
// 其他消息转发出去 // 其他消息转发出去
console.log("收到消息:",sendInfo);
messageCallBack && messageCallBack(sendInfo.cmd, sendInfo.data) messageCallBack && messageCallBack(sendInfo.cmd, sendInfo.data)
} }
} }
websock.onclose = function(e) { websock.onclose = function(e) {
console.log('WebSocket连接关闭') console.log('WebSocket连接关闭')
isConnect = false; //断开后修改标识 isConnect = false; //断开后修改标识
reConnect(); closeCallBack && closeCallBack(e);
} }
websock.onopen = function() { websock.onopen = function() {
console.log("WebSocket连接成功"); console.log("WebSocket连接成功");
@ -53,7 +53,6 @@ let initWebSocket = () => {
} }
}; };
websock.send(JSON.stringify(loginInfo)); websock.send(JSON.stringify(loginInfo));
} }
// 连接发生错误的回调方法 // 连接发生错误的回调方法
@ -71,14 +70,17 @@ let initWebSocket = () => {
//定义重连函数 //定义重连函数
let reConnect = () => { let reConnect = () => {
console.log("尝试重新连接"); console.log("尝试重新连接");
if (isConnect) return; //如果已经连上就不在重连了 if (isConnect){
//如果已经连上就不在重连了
return;
}
rec && clearTimeout(rec); rec && clearTimeout(rec);
rec = setTimeout(function() { // 延迟5秒重连 避免过多次过频繁请求重连 rec = setTimeout(function() { // 延迟5秒重连 避免过多次过频繁请求重连
initWebSocket(wsurl); connect();
}, 5000); }, 5000);
}; };
//设置关闭连接 //设置关闭连接
let closeWebSocket = () => { let close = () => {
websock && websock.close(); websock && websock.close();
}; };
@ -129,24 +131,25 @@ function sendMessage(agentData) {
} }
function onmessage(callback) { function onMessage(callback) {
messageCallBack = callback; messageCallBack = callback;
} }
function onopen(callback) { function onOpen(callback) {
openCallBack = callback; openCallBack = callback;
if (hasLogin) {
openCallBack();
}
} }
function onClose(callback) {
closeCallBack = callback;
}
// 将方法暴露出去 // 将方法暴露出去
export { export {
createWebSocket, init,
closeWebSocket, connect,
close,
sendMessage, sendMessage,
onmessage, onOpen,
onopen onMessage,
onClose
} }

22
im-ui/src/view/Home.vue
View File

@ -83,11 +83,12 @@
this.$store.commit("setUserInfo", userInfo); this.$store.commit("setUserInfo", userInfo);
this.$store.commit("setUserState", this.$enums.USER_STATE.FREE); this.$store.commit("setUserState", this.$enums.USER_STATE.FREE);
this.$store.commit("initStore"); this.$store.commit("initStore");
this.$wsApi.createWebSocket(process.env.VUE_APP_WS_URL, userInfo.id, sessionStorage.getItem("accessToken")); this.$wsApi.init(process.env.VUE_APP_WS_URL, sessionStorage.getItem("accessToken"));
this.$wsApi.onopen(() => { this.$wsApi.connect();
this.$wsApi.onOpen(() => {
this.pullUnreadMessage(); this.pullUnreadMessage();
}); });
this.$wsApi.onmessage((cmd, msgInfo) => { this.$wsApi.onMessage((cmd, msgInfo) => {
if (cmd == 2) { if (cmd == 2) {
// 异地登录，强制下线 // 异地登录，强制下线
this.$message.error("您已在其他地方登陆，将被强制下线"); this.$message.error("您已在其他地方登陆，将被强制下线");
@ -106,6 +107,17 @@
this.handleGroupMessage(msgInfo); this.handleGroupMessage(msgInfo);
} }
}) })
this.$wsApi.onClose((e) => {
console.log(e);
if(e.code == 1006){
// 服务器主动断开
this.$message.error("连接已断开，请重新登录");
location.href = "/";
}else{
this.$wsApi.connect();
}
});
}, },
pullUnreadMessage() { pullUnreadMessage() {
// 拉取未读私聊消息 // 拉取未读私聊消息
@ -198,7 +210,7 @@
!msg.selfSend && this.playAudioTip(); !msg.selfSend && this.playAudioTip();
}, },
handleExit() { handleExit() {
this.$wsApi.closeWebSocket(); this.$wsApi.close();
sessionStorage.removeItem("accessToken"); sessionStorage.removeItem("accessToken");
location.href = "/"; location.href = "/";
}, },
@ -246,7 +258,7 @@
}) })
}, },
unmounted() { unmounted() {
this.$wsApi.closeWebSocket(); this.$wsApi.close();
} }
} }
</script> </script>

28
im-uniapp/App.vue
View File

@ -26,11 +26,13 @@
initWebSocket() { initWebSocket() {
let loginInfo = uni.getStorageSync("loginInfo") let loginInfo = uni.getStorageSync("loginInfo")
let userId = store.state.userStore.userInfo.id; let userId = store.state.userStore.userInfo.id;
wsApi.createWebSocket(process.env.WS_URL, loginInfo.accessToken); wsApi.init(process.env.WS_URL, loginInfo.accessToken);
wsApi.onopen(() => { wsApi.connect();
wsApi.onOpen(()=>{
// 拉取未读消息
this.pullUnreadMessage(); this.pullUnreadMessage();
}); })
wsApi.onmessage((cmd, msgInfo) => { wsApi.onMessage((cmd, msgInfo) => {
if (cmd == 2) { if (cmd == 2) {
// 异地登录，强制下线 // 异地登录，强制下线
uni.showModal({ uni.showModal({
@ -49,6 +51,19 @@
// 插入群聊消息 // 插入群聊消息
this.handleGroupMessage(msgInfo); this.handleGroupMessage(msgInfo);
} }
});
wsApi.onClose((res)=>{
// 1006是服务器主动断开，3000是APP主动关闭
if(res.code == 1006 || res.code == 3000){
uni.showToast({
title: '连接已断开，请重新登录',
icon: 'none',
})
this.exit();
}else{
// 重新连接
wsApi.connect();
}
}) })
}, },
pullUnreadMessage() { pullUnreadMessage() {
@ -131,9 +146,9 @@
}, },
exit() { exit() {
console.log("exit"); console.log("exit");
wsApi.closeWebSocket(); wsApi.close();
uni.removeStorageSync("loginInfo"); uni.removeStorageSync("loginInfo");
uni.reLaunch({ uni.navigateTo({
url: "/pages/login/login" url: "/pages/login/login"
}) })
}, },
@ -198,4 +213,5 @@
// #endif // #endif
background-color: #f8f8f8; background-color: #f8f8f8;
} }
</style> </style>

13
im-uniapp/common/request.js
View File

@ -19,7 +19,7 @@ const request = (options) => {
if (res.data.code == 200) { if (res.data.code == 200) {
return resolve(res.data.data) return resolve(res.data.data)
} else if (res.data.code == 400) { } else if (res.data.code == 400) {
navToLogin(); getApp().exit();
} else if (res.data.code == 401) { } else if (res.data.code == 401) {
console.log("token失效，尝试重新获取") console.log("token失效，尝试重新获取")
if (isRefreshToken) { if (isRefreshToken) {
@ -36,7 +36,7 @@ const request = (options) => {
requestList = []; requestList = [];
isRefreshToken = false; isRefreshToken = false;
console.log("刷新token失败") console.log("刷新token失败")
navToLogin(); getApp().exit();
return; return;
} }
uni.setStorageSync("loginInfo", res.data.data); uni.setStorageSync("loginInfo", res.data.data);
@ -88,13 +88,4 @@ const reqRefreshToken = (loginInfo) => {
}); });
} }
const navToLogin = () => {
uni.showToast({
icon: "none",
title: "登录过期，请需要重新登录",
duration: 1500
})
getApp().exit();
}
export default request; export default request;

123
im-uniapp/common/wssocket.js
View File

@ -1,38 +1,20 @@
let wsurl = ""; let wsurl = "";
let accessToken = ""; let accessToken = "";
let messageCallBack = null;
let openCallBack = null; let openCallBack = null;
let messageCallBack = null;
let closeCallBack = null;
let isConnect = false; //连接标识 避免重复连接 let isConnect = false; //连接标识 避免重复连接
let hasLogin = false;
let hasInit = false; let hasInit = false;
let createWebSocket = (url, token) => {
let init = (url, token) => {
wsurl = url; wsurl = url;
accessToken = token; accessToken = token;
closeWebSocket().then(() => { // 防止重新注册事件
initWebSocket();
});
};
let initWebSocket = () => {
console.log("初始化WebSocket");
uni.connectSocket({
url: wsurl,
success: (res) => {
console.log("websocket连接成功");
},
fail: (err) => {
console.log(e);
console.log("websocket连接失败");
reConnect(); //如果无法连接上webSocket 那么重新连接！可能会因为服务器重新部署，或者短暂断网等导致无法创建连接
}
});
// 不能绑定多次事件,不然多触发，即便之前已经调了uni.closeSocket
if(hasInit){ if(hasInit){
return; return;
} }
hasInit = true; hasInit = true;
uni.onSocketOpen((res) => { uni.onSocketOpen((res) => {
console.log("WebSocket连接已打开"); console.log("WebSocket连接已打开");
isConnect = true; isConnect = true;
@ -48,11 +30,9 @@ let initWebSocket = () => {
}); });
}) })
uni.onSocketMessage((res) => { uni.onSocketMessage((res) => {
let sendInfo = JSON.parse(res.data) let sendInfo = JSON.parse(res.data)
if (sendInfo.cmd == 0) { if (sendInfo.cmd == 0) {
hasLogin = true;
heartCheck.start() heartCheck.start()
console.log('WebSocket登录成功') console.log('WebSocket登录成功')
// 登录成功才算连接完成 // 登录成功才算连接完成
@ -71,53 +51,54 @@ let initWebSocket = () => {
console.log(res) console.log(res)
console.log('WebSocket连接关闭') console.log('WebSocket连接关闭')
isConnect = false; //断开后修改标识 isConnect = false; //断开后修改标识
//reConnect(); closeCallBack && closeCallBack(res);
}) })
uni.onSocketError((err) => { uni.onSocketError((e) => {
console.log(err) console.log(e)
isConnect = false; //连接断开修改标识 isConnect = false; //连接断开修改标识
uni.showModal({ uni.showModal({
content: '连接失败，可能是websocket服务不可用，请稍后再试', content: '连接失败，可能是websocket服务不可用，请稍后再试',
showCancel: false, showCancel: false,
}) })
}) })
};
//定义重连函数
let reConnect = () => {
console.log("尝试重新连接");
if (isConnect) return; //如果已经连上就不在重连了
rec && clearTimeout(rec);
rec = setTimeout(function() { // 延迟5秒重连 避免过多次过频繁请求重连
initWebSocket();
}, 5000);
}; };
//设置关闭连接 let connect = ()=>{
let closeWebSocket = () => { if (isConnect) {
return new Promise((resolve, reject) => { return;
if (!isConnect) { }
resolve(); uni.connectSocket({
return; url: wsurl,
success: (res) => {
console.log("websocket连接成功");
},
fail: (e) => {
console.log(e);
console.log("websocket连接失败，10s后重连");
setTimeout(()=>{
connect();
},10000)
} }
uni.closeSocket({ });
code: 3000, }
complete: (res) => {
console.log("关闭websocket连接");
hasLogin = false;
isConnect = false;
resolve();
},
fail:(e)=>{
console.log("关闭websocket连接失败",e);
}
})
})
//设置关闭连接
let close = () => {
if (!isConnect) {
return;
}
uni.closeSocket({
code: 3000,
complete: (res) => {
console.log("关闭websocket连接");
isConnect = false;
},
fail:(e)=>{
console.log("关闭websocket连接失败",e);
}
});
}; };
@ -157,24 +138,26 @@ function sendMessage(agentData) {
} }
function onmessage(callback) { function onMessage(callback) {
messageCallBack = callback; messageCallBack = callback;
} }
function onOpen(callback) {
function onopen(callback) {
openCallBack = callback; openCallBack = callback;
if (hasLogin) { }
openCallBack();
} function onClose(callback) {
closeCallBack = callback;
} }
// 将方法暴露出去 // 将方法暴露出去
export { export {
createWebSocket, init,
closeWebSocket, connect,
close,
sendMessage, sendMessage,
onmessage, onMessage,
onopen onOpen,
onClose
} }

10
im-uniapp/pages/chat/chat.vue
View File

@ -83,7 +83,8 @@
}) })
} else { } else {
uni.removeTabBarBadge({ uni.removeTabBarBadge({
index: 0 index: 0,
complete:()=>{}
}) })
} }
@ -98,7 +99,12 @@
return count; return count;
} }
}, },
onLoad() { watch:{
unreadCount(newCount,oldCount){
this.refreshUnreadBadge();
}
},
onShow() {
this.refreshUnreadBadge(); this.refreshUnreadBadge();
} }
} }

Write Preview
Loading…
Cancel
Save