vue1.x 网易云信开发过程中遇到的问题

vue1.x + 网易云信开发过程中遇到的问题

vue单页面应用中,切换路由时,因为没有收到服务器的回包,所以登录成功的回调就不执行了,登录没成功,后面的同步信息也就同步不到了,因为网易云信的SDK是单实例

解决方法如下:
  • 主要是在刚进入这个页面的时候检测需不需要reload此页面,用session来存一个标识,再在切换路由时销毁此标识
  • 主要就是需要重新加载一次页面,因为不手动刷新就没有相应的回调
methods: {validate() { // 登录验证setCookie('uid', this.loginMsg.account.toLocaleLowerCase())setCookie('sdktoken', this.loginMsg.token)this.sdk()},unvalidate() {// 断开 IMnim.disconnect();delCookie('uid');delCookie('sdktoken');this.$route.router.go("/welcome")window.location.reload()},sdk() {let _this = thisvar data = {}// 注意这里, 引入的 SDK 文件不一样的话, 你可能需要使用 SDK.NIM.getInstance 来调用接口nim = NIM.getInstance({// debug: true,db: true,appKey: _this.loginMsg.appKey,  // 心猫account: readCookie('uid'), //token: readCookie('sdktoken'), //onconnect: onConnect,onwillreconnect: onWillReconnect,ondisconnect: onDisconnect,onerror: onError,onmyinfo: onMyInfo,onroamingmsgs: onRoamingMsgs,onofflinemsgs: onOfflineMsgs,onsessions: onSessions,onupdatesession: onUpdateSession,onusers: onUsers,onfriends: onFriends,onsyncfriendaction: onSyncFriendAction})console.log(nim)console.log('db:' + NIM.support.db) // 支持数据库function getUsersDone(error, users) {console.log(error);console.log(users);// console.log('获取用户资料数组' + (!error?'成功':'失败'));if (!error) {onUsersFriends(users);}}function onUsersFriends(users) {data.users = nim.mergeUsers(data.users, users);_this.friendsInfoList = data.users// console.log('收到haoyou用户名片列表', JSON.stringify(users));}function onUsers(users) {data.users = nim.mergeUsers(data.users, users);_this.sdkData.users = data.usersconsole.log('收到用户名片列表', JSON.stringify(users));}function onDisconnect(error) {// 此时说明 `SDK` 处于断开状态,开发者此时应该根据错误码提示相应的错误信息,并且跳转到登录页面var that = this;console.log('连接断开');alert('连接断开')if (error) {switch (error.code) {// 账号或者密码错误, 请跳转到登录页面并提示错误case 302:alert(error.message);delCookie('uid');delCookie('sdktoken');window.location.href = './welcome';break;// 被踢, 请提示错误后跳转到登录页面case 'kicked':var map = {PC: "电脑版",Web: "网页版",Android: "手机版",iOS: "手机版",WindowsPhone: "手机版"};var str = error.from;alert("你的帐号于" + dateFormat(+new Date(), "HH:mm") + "被" + (map[str] || "其他端") + "踢出下线,请确定帐号信息安全!");delCookie('uid');delCookie('sdktoken');window.location.href = './welcome';break;default:break;}}}function onRoamingMsgs(obj) {console.log('漫游消息', obj);}function onOfflineMsgs(obj) {console.log('收到离线消息', obj);}function onMyInfo(data) {console.log('onMyInfo');console.log(data.account)_this.Object.account = data.account_this.Object.avatar = data.avatar_this.Object.createTime = data.createTime_this.Object.gender = data.gender_this.Object.nick = data.nick_this.Object.updateTime = data.updateTimeconsole.log(_this.Object.updateTime)}function onConnect(data) {console.log(data)_this.loginMsg = '连接成功'console.log("连接成功----------------", _this.loginMsg)}function onWillReconnect(obj) {// 此时说明 SDK 已经断开连接 请开发者在界面上提示用户连接已断开, 而且正在重新建立连接console.log('即将重连');console.log(obj.retryCount);console.log(obj.duration);}function onDisconnect(error) {// 此时说明 SDK 处于断开状态, 开发者此时应该根据错误码提示相应的错误信息, 并且跳转到登录页面alert(`丢失连接:${error.message}`)if (error) {switch (error.code) {// 账号或者密码错误, 请跳转到登录页面并提示错误case 302:break;// 重复登录, 已经在其它端登录了, 请跳转到登录页面并提示错误case 417:break;// 被踢, 请提示错误后跳转到登录页面case 'kicked':break;default:break;}}}function onError(error) {console.log(error);}function onSessions(sessions) {console.log("收到会话哈哈哈------------------------", sessions)data.sessions = nim.mergeSessions(data.sessions, sessions)console.log(data.sessions)_this.sdkData.sessions = data.sessions// getAvatar(data.sessions)getAvatarFilter(data.sessions)_this.getLocalHistory() // 刷新界面}function onUpdateSession(session) {console.log('会话更新了', session)console.log(window._chatImThis, _this)// 向上层发送消息if (window.location.pathname.split("?")[0].split("/")[1] !== "imChat"  && session.unread > 0) {document.querySelector('#im-unread-number-id-wrap').style.display = "list-item"document.querySelector("#im-unread-number-id").innerHTML = session.unread} else {document.querySelector('#im-unread-number-id-wrap').style.display = "none"}data.sessions = nim.mergeSessions(data.sessions, session)_this.sdkData.sessions = data.sessions// getAvatar(data.sessions)getAvatarFilter(data.sessions)_this.getLocalHistory(); // 刷新界面nim.getFriends({done: getFriendsDone});function getFriendsDone(error, friends) {console.log('获取好友列表' + (!error?'成功':'失败'), error, friends);if (!error) {onFriends(friends);}}}function getAvatar(sessions) {   // 头像列表let arr = [], avatarArr = []sessions.forEach((item) => {let account = item.id.split('-')[1]   111111111111111111111arr.push(account)})nim.getUsers({accounts: arr,done: setChatList})}function getAvatarFilter(sessions) {   //   对话不过滤 只过滤需要显示头像的账号let arr = [], avatarArr = []sessions.forEach((item) => {if (accountFliter(item.lastMsg)) {let account = item.id.split('-')[1]   111111111111111111111arr.push(account)}})nim.getUsers({accounts: arr,done: setChatList})}function accountFliter(lastMsg) {let bool = truelet type = lastMsg.typeif (type == 'custom') {try {let xmType = JSON.parse(lastMsg.content).xmMessageTypeif (xmType != 3 && xmType != 102 && xmType != 103 && xmType != 104 && xmType != 105) {bool = false}} catch(e) {console.log(e)}}return bool}function setChatList(error, users) {if (!error) {users.forEach((item, index) => {_this.sdkData.sessions.forEach((chat) => {if (chat.id.split('-')[1] == item.account) {chat.path = item.avatarchat.nick = item.nick}})})}_this.sessions = _this.sdkData.sessions}},},route: {deactivate(transition) {window.sessionStorage.removeItem("imChatIsNeedReload")transition.next()}},ready() {if (!sessionStorage.getItem('imChatIsNeedReload')) {window.sessionStorage.imChatIsNeedReload = '11111111111'window.location.reload()}this.validate();}
复制代码

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Powered By Z-BlogPHP 1.7.3

Copyright www.122dh.com Rights Reserved.