一、基本介紹
MobileIMSDK的H5端是一套純JS編寫的基于標準WebSocket的即時通訊庫:- 1)超輕量級、極少依賴;
- 2)純JS編寫、高度提煉,簡單易用;
- 3)基于標準WebSocket協議,客戶端兼容性好;
- 4)支持運行于iOS、Android等移動端瀏覽器和各種PC端瀏覽器;
- 5)能與 MobileIMSDK(Github托管鏈接)的各種APP原生代碼客戶端完美互通;
- 6)可應用于手機端/PC端的網頁聊天應用、企業OA、Web端等即時通訊場景。
二、與MobileIMSDK的關系
MobileIMSDK-H5端 是基于標準HTML5的WebSocket協議的 MobileIMSDK配套客戶端庫。
以下是MobileIMSDK的通信架構圖:
MobileIMSDK是一套專為移動端開發的原創開源IM通信層框架:
- 1)歷經8年、久經考驗;
- 2)超輕量級、高度提煉,lib包50KB以內;
- 3)精心封裝,一套API同時支持UDP、TCP、WebSocket三種協議(可能是全網唯一開源的);
- 4)客戶端支持iOS、Android、標準Java、H5(暫未開源)、微信小程序(暫未開源)、Uniapp
(暫未開源);
- 5)服務端基于Netty,性能卓越、易于擴展;
- 6)可與姊妹工程 MobileIMSDK-Web 無縫互通實現網頁端聊天或推送等;
- 7)可應用于跨設備、跨網絡的聊天APP、企業OA、消息推送等各種場景。
PS: MobileIMSDK一直在持續開發和升級中,新Uniapp端是MobileIMSDK工程的最新成果。
三、與MobileIMSDK-Web的關系
MobileIMSDK-Web也是一套純JS編寫的Web端即時通訊框架(含服務端)。MobileIMSDK-Web框架與MobileIMSDK-H5端的相同點:
- 1)都是Web端即時通訊框架;
- 2)都是純JS編寫;
- 3)都可以運行在手機、pc端的瀏覽器或web容器內。
- 1)MobileIMSDK-Web可以兼容不支持HTML5的舊版瀏覽器或容器,而MobileIMSDK-H5端必須運行在當前主流的HTML5瀏覽器或容器;
- 2)MobileIMSDK-Web需依賴于socket.io這種第3方通信層庫,而MobileIMSDK-H5端無任何額外依賴。
- 選擇一:如果您的應用必須兼容舊版瀏覽器(包括舊版IE等):
那唯一的選擇就是MobileIMSDK-Web,因為它存在的主要價值就是為了兼容舊版瀏覽器; - 選擇二:如果您的應用只需運行在現今主流的HTML5瀏覽器或容器:
那么建議您優先使用MobileIMSDK的H5端,必竟直接調用標準HTML5的WebSocket API,要簡潔、輕量多了,也沒有第3方依賴。
四、設計目標
直接使用原生的WebSocket有以下問題和劣勢:- 1)功能有限:沒有提供心跳保活、斷線重連、送達保證(重傳和去重)等即時通訊關鍵算法和邏輯;
- 2)API 簡陋:在如此有限的標準API下,能邏輯清晰和健壯地實現并組合心跳保活、斷線重連、送達保證等算法,需要相當高的技術掌控力;
- 3)邏輯耦合:經驗欠缺的開發人員,會將WebSocket通信代碼與前端UI界面代碼混在一起,使得UI界面的編寫、維護、改版都非常困難。
總結一下,MobileIMSDK-H5端庫的設計目標是為您的Web端IM帶來以下便利:
- 1)前端與通信解偶:前端UI與網絡通信代碼解耦,UI界面的重構、維護、改版都非常容易和優雅;
- 2)輕量級和兼容性:受益于標準WebSocket,可很好地運行于現今主流的H5瀏覽器上,且無需額外依賴;
- 3)核心內聚和收斂:得益于長期的提煉和經驗積累,SDK核心層高度封裝,開發者無需理解復雜算法即可簡單上手。
- 4)純JS輕量級實現:純JS編寫,無Angular、EmberJS、VUE等各種重量級前端框架依賴,方便對接各種既有系統;
五、技術亮點
- 1)輕量易使用:超輕量級——純JS編寫且極少依賴,高度提煉——簡單易用;
- 2)兼容性很好:基于標準WebSocket,可很好地運行于現今主流的H5瀏覽器上,且無需額外依賴;
- 3)斷網恢復能力:擁有網絡狀況自動檢測、斷網自動治愈的能力;
- 4)送達保證機制:完善的QoS消息送達保證機制(自動重傳、消息去重、狀態反饋等),不漏過每一條消息;
- 5)支持多種設備:支持運行于iOS、Android等移動端瀏覽器和各種PC端瀏覽器;
- 6)通信協議封裝:實現了一個對上層透明的即時通訊通信協議模型;
- 7)身份認證機制:實現了簡單合理的身份認證機制;
- 8)完善的log信息:在開發調試階段,確保每一個算法關鍵步驟都有日志輸出,讓您的運行調試更為便利;
- 9)前端代碼解耦:實現了UI前端代碼與sdk網絡通信代碼解偶,防止前端代碼跟IM核心代碼混在一起,不利于持續升級、重用和維護;
- 10)多端協議兼容:實現了與MobileIMSDK各APP端完全兼容的協議模型;
六、文件組成
SDK代碼文件概覽:
SDK代碼文件用途說明:
七、Demo功能預覽和說明
八、Demo運行效果實拍圖
1)Demo在手機端瀏覽器中的真機實拍圖:
2)Demo在電腦端瀏覽器中的真機實拍圖:
八、更多Demo運行效果截圖
1)Demo在PC端瀏覽器運行效果:

3)Demo在PC端主流瀏覽器的運行效果(點擊可看大圖 ▼):
十、詳盡開發者手冊
① MobileIMSDK-H5端的詳細介紹:點此查看 ??② MobileIMSDK-H5端的開發手冊(網頁版):點此查看 ??
③ MobileIMSDK-H5端的開發手冊(精編PDF版):點此查看 ?? (* 推薦)
④ MobileIMSDK-開源框架的詳細介紹:https://gitee.com/jackjiang/MobileIMSDK (Github托管鏈接)??
十一、相關資料
[1] HTML5 WebSocket API 文檔[2] MobileIMSDK開源框架的API文檔
[3] MobileIMSDK開源IM框架源碼(Github地址點此)
[4] MobileIMSDK-Web框架基礎介紹
posted @ 2024-09-18 10:36 Jack Jiang 閱讀(92) | 評論 (0) | 編輯 收藏