一、基本介绍
MobileIMSDK-Web是一套纯JS编写的Web端IM即时通讯框架(含服务端):
- 1)超轻量级、极少依赖;
- 2)纯JS编写、高度提炼,简单易用;
- 3)基于著名的socket.io网络库实现,浏览器兼容性好、服务端并发性能好;
- 4)支持运行于iOS、Android等移动端浏览器和各种PC端浏览器;
- 5)能与MobileIMSDK的APP版(原生移动端代码编写)完美互通;
- 6)可应用于手机端/PC端的网页聊天应用、企业OA、Web端消息推送等场景。
☞ 补充说明:MobileIMSDK-Web是 MobileIMSDK 的姊妹工程,MobileIMSDK-Web专注于Web端网页聊天(或推送),而MobileIMSDK用于原生代码编写的移动端IM(或推送)应用,但二者可完美互通——从而实现原生代码编写的移动端与基于html的网页聊天完美互通。
☞ 关于为何使用的是Socket.io而不是Netty作为MobileIMSDK-Web的网络层,详见:《MobileIMSDK-Web的网络层框架为何使用的是Socket.io而不是Netty?》。
二、与MobileIMSDK的区别
☞ 关于MobileIMSDK:
MobileIMSDK主要使用原生代码编写,应用于非Web网页方式的移动端即时通讯场景下(当然最新的MobileIMSDK框架也支持基于HTML5的WebSocket客户端)。
⭐️ 同步开源地址:
- ❶ GitHub:https://github.com/JackJiang2011/MobileIMSDK
- ❷ 码云gitee:https://gitee.com/jackjiang/MobileIMSDK
- ❸ Gitcode:https://gitcode.com/hellojackjiang2011/MobileIMSDK
☞ 关于MobileIMSDK-Web:
MobileIMSDK-Web完全使用JavaScript编写,主要应用于不支持HTML5的需要兼容旧式浏览器的Web网页方式的即时通讯场景下(包括但不限于手机端、PC端的网页聊天(或消息推送)等)。
☞ MobileIMSDK与MobileIMSDK-Web的互通:
基于MobileIMSDK-Web开发的开发的网页聊天等和基于MobileIMSDK开发的移动端IM等可以无缝地进行消息互通,两个框架之间的通信协议完全兼容,从而实现您的网页聊天(或推送)与手机端原生代码开发的IM(或推送)进行完美协作,实现多端通信。
☞ 我该如何选择?
选择一:如果您的应用是用原生代码编写,如移动端是原生代码编写或者不需要兼容旧式浏览器,那么您可以将 MobileIMSDK 引入到您的项目中从而实现IM(或推送)应用;
选择二:如果您的应用是基于Web网页且需要兼容旧式浏览器,那么您的最佳选择就是使用MobileIMSDK-Web来开发您的网页端聊天(或消息推送)。
三、设计目标
原生的WebSocket代码或者原始的socket.io代码,使得网络通信代码与大量前端UI界面代码混在一起,使得UI界面的重构、维护、改版都非常困难。而MobileIMSDK-Web工程将让开发者专注于UI应用层的开发,网络通信层专业的代码交由SDK开发人员,从而解偶Web端IM的UI前端和通信层的耦合性,同时大大降低复杂性。
总结一下,MobileIMSDK-Web的设计目标是为您的Web端IM带来以下便利:
- 1)前端UI代码与网络通信代码解耦:UI界面的重构、维护、改版都非常容易和优雅;
- 2)服务端网络通信代码与业务代码解耦:使得服务端的业务逻辑实现起来清晰简单;
- 3)浏览器端的高兼容性:受益于socket.io框架,MobileIMSDK-Web在不支持WebSocket的旧式浏览器上仍可很好地工作;
- 4)服务端的高并发、高性能:得益于Nodejs的异步编程模型和高并发特性,基于MobileIMSDK-Web编写的IM服务端拥有极高的并发处理性能。
四、框架组成
整套MobileIMSDK-Web框架由以下2部分组成:
- 1)浏览器端SDK:用于开发浏览器端页面,纯JS编写,极少依赖,方便对接基于原生JS、Angular、EmberJS、VUE等各种前端框架;
- 2)服务器端SDK:用于开发Web端IM的服务端,支持高性能和高并发。
五、技术亮点
- ✅️ 轻量易使用:超轻量级——纯JS编写且极少依赖,高度提炼——简单易用;
- ✅️ 兼容性好:基于socket.io网络框架,浏览器兼容性好,在不支持WebSocket的旧式浏览器上仍可很好地工作;
- ✅️ QoS机制:完善的消息送达保证机制(真正ACK应答机制),确保不漏过每一条消息;
- ✅️ 断网恢复能力:拥有网络状况自动检测、断网自动治愈的能力;
- ✅️ 支持多种设备:支持运行于iOS、Android等移动端浏览器和各种PC端浏览器;
- ✅️ 封装的通信协议:实现了一个对上层透明的即时通讯通信协议模型;
- ✅️ 身份认证机制:实现了简单合理的身份认证机制(socket.io官方并未实现之,资料也几乎没有);
- ✅️ 全消息路径:实现了client to server、server to client、client to client 共3种消息路径(socket.io官方只演示了广播消息,一对一发送无资料);
- ✅️ 服务端慢io解偶:开发者可通过使用MQ进行DB等慢io的读、写解偶,保证IM实时消息高吞吐和性能;
- ✅️ 服务端代码解偶:实现了上层应用代码与sdk核心代码的解偶,上线、下线、c2s消息、c2c消息、身份认证等的回调通知;
- ✅️ 实现了在线列表:服务端实现了一个高性能的在线用户列表机制;
- ✅️ 完善的log记录:服务端接入了log4js日志框架,确保MobileIMSDK-Web中的每一个关键步骤都有日志输出,让您的运行调试更为便利;
- ✅️ 浏览器端代码解耦:实现了UI前端代码与sdk网络通信代码解偶,防止前端代码跟IM核心代码混在一起,不利于持续升级、重用和维护;
- ✅️ 轻松开启数据加密:一个参数即可开启SSL/TLS通信加密;
- ✅️ 聊天协议兼容:实现了与MobileIMSDK 完全兼容的协议模型。
MobileIMSDK-Web的浏览器兼容性:
(☞ MobileIMSDK-Web的兼容性由socket.io网络框架决定:点此查看兼容性说明)
六、性能负载
得益于socket.io网络框架的高性能和Nodejs的异步编程模型,MobileIMSDK-Web可支持单机数万甚至上十万并发连接。当然,每种应用场景都有各自的特点和差异,请视具体场景具体评估之,性能数据仅供参考。(关于为何使用的是Socket.io而不是Netty作为MobileIMSDK-Web的网络层,详见《MobileIMSDK-Web的网络层框架为何使用的是Socket.io而不是Netty?》)
☞ socket.io性能测试讨论:socket.io 高并发实战、socket.io保持6万+连接测试?、如何实现单服务器300万个长连接的?。
七、开发者手册
八、Demo运行截图
九、产品案例
以下为基于MobileIMSDK-Web的Web端IM产品案例 RainbowChat-Web 的产品情况。
下图为RainbowChat-Web的主界面(更多截图、更多演示视频):
下图为RainbowChat-Web的主界面[聊天窗全屏时] (更多截图、更多演示视频):
(本文内容引用自:http://www.52im.net/thread-959-1-1.html)