HTML5技术

运用google-protobuf的IM消息应用开发(前端篇) - 子慕大诗人(3)

字号+ 作者:H5之家 来源:H5之家 2017-03-30 18:00 我要评论( )

官方说退出微信账号后,将会清空所有Cookie和localStorage。 网上有人说还有部分机型据说会出现无法存储或者退出webview之后就会被清除(这个没有亲自做验证)。 那么我需要做的未读消息状态就没法保证在任何情况下

  官方说退出微信账号后,将会清空所有Cookie和localStorage。 网上有人说还有部分机型据说会出现无法存储或者退出webview之后就会被清除(这个没有亲自做验证)。 那么我需要做的未读消息状态就没法保证在任何情况下都能正确存取。 解决方案是后端提供一个可以读取的接口,我去存取一个key和value,自己来维护状态。 在h5做未读消息状态还真不容易,我需要在接收到消息的时候做一个判断,如果当前用户没有在和某一个人的对话页面,那么这个人的消息肯定是未读的,我需要总未读计数+1,和这个人的未读计数+1,当进到某个人的会话页面,这个人的未读数将被清空,第一次登陆之后还会拉取离线消息,然后把离线消息的整理一下做次统计,每次未读消息出现变更都需要把之前的数据进行对比并且更新,页面跳转或者未读出现变化的时候需要给底部tab和消息列表dom做一次状态更新。给一个静态图,看下效果:

  

  4.websocket断线重连把自己踢下线的问题:

  我们会避免用户重复登录websocket,如果当前用户第二次连接websocket的话 会把上一次登录的一端给踢下线,被踢下线的一端会收到一个消息,当收到踢下线的消息之后我便不会进行重连。 因为网络原因、异常原因或者后端主动要求我重连,我便会去进行重连,但是有时候出现就在同一个地方执行了重复连接,实际都是自己这一个端,那么就会出现登录上之后,又收到踢下去的消息,把自己给踢下去了,踢下去就不会再重连了,这样就永久断开了,这属于逻辑没控制好。 解决这个问题是首先要保证重连之前先主动对当前的websocket执行一次close,close的时候后端是会收到断开的通知,这样我们再去连接就不会重复登录了。

 

 结语:

  这次自己碰到很多不熟悉的知识,也问了server同事很多问题,学到很多,有靠谱的大牛同事就是爽! 也出过一些bug和问题,多次反复追溯才查出问题的根源,有时候1个bug可能是几个地方代码写错造成的问题。 第一个版本已经顺利上线,后面还有很多重要的工作要做,单从前端来说,还需要把封装的websocket和ImInstance写得更好,文档,扩展性这些都要考虑(已经是一个公共类了,以后还会作为sdk开放给三方平台);还需要做一个监控展示,帮助实时监控服务器CPU,带宽,性能等。 经历了一次大版本的迭代,加了一个月的班,熬了几天夜,和团队一起在进步,收获到这么多经验包也是很开心的。

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • HTML5 学习笔记(五)——WebSocket与消息推送 - SeeYouBug

    HTML5 学习笔记(五)——WebSocket与消息推送 - SeeYouBug

    2016-12-05 10:00

  • 使用专业的消息队列产品rabbitmq之centos7环境安装 - 一线码农

    使用专业的消息队列产品rabbitmq之centos7环境安装 - 一线码农

    2016-10-29 16:00

  • Ionic 的 ng-class 在聊天功能上面的巧妙运用 - 小月博客

    Ionic 的 ng-class 在聊天功能上面的巧妙运用 - 小月博客

    2016-10-02 15:00

  • 酷酷的CSS3三角形运用 - keepfool

    酷酷的CSS3三角形运用 - keepfool

    2016-06-26 13:00

网友点评
t