默認
打賞 發表評論 16
想開發IM:買成品怕坑?租第3方怕貴?找開源自已擼?盡量別走彎路了... 找站長給點建議
Web版即時通訊/IM系統:RainbowChat-Web基本介紹
閱讀(33509) | 評論(16 收藏5 淘帖 2

1、基本介紹


Web版即時通訊/IM系統:RainbowChat-Web基本介紹_未標題-1.jpg

RainbowChat-Web是一套基于MobileIMSDK-Web的網頁端IM系統。不同于市面上某些開源或淘寶售賣的demo級代碼,RainbowChat-Web的產品級代碼演化自真正運營過的商業產品,其所依賴的通信層核心SDK(即MobileIMSDK-Web)已在數年內經過大量客戶及其輻射的最終用戶的使用和驗證。

RainbowChat-Web為自主知識產權的產品級工程,可方便有Web端全功能IM需求的開發者,能站在既有的成果上直接2次開發,從而快速掌握自主開發全功能Web端IM的能力、加快項目進度、同時降低項目開發的不可控風險

特別說明:本產品是RainbowChat的姊妹產品。從產品規劃上來說,RainbowChat是APP端IM系統產品,RainbowChat-Web(即本產品)是Web端IM系統產品。即RainbowChat和RainbowChat-Web(本產品)是兩套系統、兩個產品,目的是提供更靈活的選擇,因為不是所有人都需要3端(即android\ios\web)同時提供,這樣進行產品劃分可減去不需要的購買成本。但兩者的底層從第一行代碼開始就設計為無縫互通,化整為零,開發者的選擇可以更加靈活自由。(兩個產品的整合互通演示視頻:點此進入

最新動態:2019年04月12日已發布RainbowChat-Web v1.6(詳見更新說明)。

2、相關鏈接


  ① RainbowChat-Web詳細介紹:點擊進入* 本文
  ② RainbowChat-Web產品截圖:點擊進入
  ③ RainbowChat-Web演示視頻:點擊進入
  ④ RainbowChat-Web技術轉讓:點擊進入[推薦]
  ⑤ RainbowChat-Web淘寶鏈接:點擊進入
  ⑥ RainbowChat-Web更新日志:點擊進入

更多詳情,請進入:RainbowChat-Web產品專區

3、使用技術


Web端IM框架:MobileIMSDK-Web

4、技術支持


  • 討論學習和資料區:點此進入 推薦
  • 即時通訊技術交流QQ群:101279154
  • 即時通訊網VIP QQ群:200090696 推薦
  • bug/建議發送至:[email protected]
  • 技術培訓/轉讓/合作/咨詢等歡迎聯系作者 QQ:413980957、微信:hellojackjiang

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_1.png          Web版即時通訊/IM系統:RainbowChat-Web基本介紹_2.png

5、技術轉讓和授權方式


實施細則:RainbowChat-Web 技術轉讓說明、授權協議書范本》。
補充說明:如果還需了解更多技術細節或解答其他疑問,請聯系作者,QQ:413980957、微信:hellojackjiang、郵箱:[email protected]

6、品質說明


❶ 源自真正運營的商業產品:
RainbowChat-Web的技術源于真實運營的商業產品。

❷ 它不是個Demo:
不同于市面上某些開源或淘寶售賣的demo級代碼,RainbowChat-Web的產品級代碼演化自真正運營過的商業產品,其所依賴的通信層核心SDK(即MobileIMSDK-Web)已在數年內經過大量客戶及其輻射的最終用戶的使用和驗證。

❸ 簡潔、精煉、優化、原生:
RainbowChat-Web為了盡可能降低2次開發時的上手門檻、兼容性、可讀性、可維護性的難度堅持不依賴任何前端框架這些框架通常是指AngularJS、VUE、EmberJS、React等),返璞歸真,只使用原生JS+HTML+CSS(再無其它復雜性),極大降低開發者的上手難度、兼容成本,達到最簡潔、最精煉、最靈活的目標(簡潔、簡單、回歸本質的東西,才能擁最強的生命力)。(注:基于眾所周之的開發便利性,RainbowChat-Web的前端也使用了廣受歡迎的jQuery庫

截止目前:RainbowChat-Web努力保證在各主流系統、主流瀏覽器、不同分辨率屏幕上的一致體驗,包括但不限于:Chrome、Safari、FireFox、Edege、360瀏覽器、世界之窗瀏覽器等▼

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_RainbowChat-Web在部分主流瀏覽器上的運行截圖.jpg
▲ 在各種主流瀏覽器上的運行情況更多截圖點此進入更多演示視頻點此進入

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_222.jpg
▲ 超寬屏上的顯示情況更多截圖點此進入更多演示視頻點此進入

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_111.jpg
▲ 不同系統、不同分辨率屏幕的真機運行情況更多截圖點此進入更多演示視頻點此進入

7、存在的意義


1用于演示MobileIMSDK-Web開發全功能網頁端IM的能力


RainbowChat-Web的即時通訊技術層基于MobileIMSDK-Web,RainbowChat-Web的產品級代碼演化自真正運營過的商業產品。可作為MobileIMSDK-Web工程的產品級Web廟IM實現參考案例,希望對MobileIMSDK-Web的使用者有所啟發。

提示:MobileIMSDK-Web是一套純JS編寫的Web端即時通訊框架(含服務端)。MobileIMSDK-Web適用于各種Web網頁方式的即時通訊場景(包括但不限于手機端、PC端的網頁聊天(或消息推送)等)。


2RainbowChat-Web可技術轉讓進行2次開發,大幅降低自主開發網頁端IM的風險和難度


RainbowChat-Web在上手門檻、兼容性、可讀性、可維護性等方面,都做了很大努力,在我們看來,一套優秀的產品并不只是實現功能這么簡單,考慮到開發者的感受,也同樣關鍵!截止目前,RainbowChat-Web努力保證在各主流瀏覽器上的一致體驗。

RainbowChat-Web為自主知識產權的產品級工程,可進行技術轉讓,以便開發者能站在既有的成果上直接2次開發,從而快速掌握自主開發全功能網頁端IM的能力、加快項目進度、同時降低項目開發的不可控風險。技術咨詢和合作,歡迎聯系作者,支持正規公對公、或個人用戶的技術合作(詳見《RainbowChat-Web 技術轉讓說明、授權協議書范本》)。

8、運行演示


❶ 運行截圖,詳見:Web版即時通訊/IM系統:RainbowChat-Web前端功能截圖
❷ 演示視頻,詳見:Web版即時通訊/IM系統:RainbowChat-Web運行演示視頻

9、功能簡介


1、支持文本消息、語音留言消息、圖片消息、大文件消息、短視頻消息、消息表情、快捷消息等;
2、支持一對一陌生人聊天模式;
3、支持一對一正式好友聊天模式;
4、支持多對多群聊聊天模式;
5、完善的群組信息管理:建群、退群、解散、轉讓、邀請、踢人、群公告等;
6、完整的注冊、登陸、密碼找回等功能閉環;
7、個人中心功能:改基本信息、改個性簽名、改頭像、改密碼等;
8、支持查看個人相冊、個人語音介紹;
9、完整的離線消息/指令拉取機制;
10、完整的歷史消息/指令存取機制;
11、完整的好友關系管理:查找好友、發出請求、處理請求、刪除好友等;
12、以及其它未提及的功能和特性。

10、技術亮點


  • 1)輕量易使用:純原生JS編寫,堅持不依賴任何前端框架這些框架通常是指AngularJS、VUE、EmberJS、React等);
  • 2)模塊化設計:所有UI模塊、數據邏輯均由獨立封裝的JS對象管理,代碼規范、低耦合,有效防止代碼復雜性擴散(整個前端約3萬行代碼);
  • 3)支持微服務:所有前端數據請求均為AJAX調用,方便您的服務端微服務化改造;
  • 4)瀏覽器跨域:所有AJAX接口均為JSONP實現,百分百支持跨域;
  • 5)通信代碼解偶:得益于高內聚的MobileIMSDK-Web工程,實現了IM功能邏輯與網絡通信的解偶,利于持續升級、重用和維護(這是經驗不足的IM產品做不到的);
  • 6)支持WebSocket:并非某些產品中還在使用的過時“長輪詢”技術,真正的“即時通訊”
  • 7)網絡兼容性好:核心層基于MobileIMSDK-Web技術,在不支持WebSocket的情況下仍可很好地工作;
  • 8)斷網恢復能力:擁有網絡狀況自動檢測斷網自動治愈的能力;
  • 9)輕松支持加密:一個參數即可開啟SSL/TLS通信加密
  • 10)服務端慢io解偶:IM實例本身堅持不直接進行DB等慢io的讀、寫,保證IM實時消息高吞吐和性能;
  • 11)服務端邏輯解偶:得益于MobileIMSDK-Web工程,實現了上層邏輯與網絡通信核心的解偶,底層數據通信全部通過低偶合的回調通知來實現;
  • 12)完善的log記錄:服務端使用log4js日志框架,確保每一關鍵步驟都有日志輸出,讓您的運行調試更為便利;
  • 13)聊天協議兼容:實現了與RainbowChat-APP產品完全兼容的協議模型;
  • 14)消息收發互通:實現了與RainbowChat-APP產品的無縫消息互通。

11、設計原則


為了更易學習、研究、2次開發,RainbowChat-Web始終遵從:

  • 1)極少依賴:絕不存在莫名其妙的多余庫引用,復制就能運行(無需輔助構建工具),保持輕量;
  • 2)架構簡潔:簡單直接,堅持原生JS+HTML+CSS,易于學習,能少一個分層則絕不強行炫技;
  • 3)不使用任何企業框架:前端堅持不使用AngularJS/VUE/EmberJS/React等、后端也無需使用express/koa/thinkjs/egg等,返璞歸真,技術可控;
  • 4)簡單地就是最好的:始終貫徹簡單直接的互聯網產品技術理念。

12、技術合法性


Web版即時通訊/IM系統:RainbowChat-Web基本介紹_111.jpg
說明:完全自主產權,全套高質量源碼和設計文件,絕無隱藏的第3方依賴(詳見《RainbowChat-Web 技術轉讓說明、授權協議書范本》)。

13、部分概覽截圖


* 詳細截圖說明請查看《RainbowChat-Web前端功能截圖
* 運行演示視頻請查看《RainbowChat-Web運行演示視頻

以下為主要界面截圖概覽:

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_aa.jpg
▲ 主界面更多截圖點此進入更多演示視頻點此進入

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_bb.jpg
▲ 主界面(聊天窗全屏時)更多截圖點此進入更多演示視頻點此進入

Web版即時通訊/IM系統:RainbowChat-Web基本介紹_cc.jpg
▲ 主界面(聊天窗關閉時)更多截圖點此進入更多演示視頻點此進入

即時通訊網 - 即時通訊開發者社區! 來源: - 即時通訊開發者社區!

推薦方案
評論 16
你好,請問我只需要群聊和文件傳輸功能可以嗎
就是在那個web版的demo上增添一個群聊和文件傳輸功能以及用戶列表
引用:天上白玉京 發表于 2019-05-05 08:47
就是在那個web版的demo上增添一個群聊和文件傳輸功能以及用戶列表

功能說起來都很簡單,但細細一理,一樣都少不了:
1)群聊需要群成員列表吧,列表怎么建立的?群怎么群立的?邀請入群呢?刪除成員呢?群怎么解散?群名要改嗎?等等
2)文件傳輸功能:怎么上傳呢?指令怎么發送?指令怎么解析?界面UI怎么顯示?怎么下載呢?
3)用戶列表怎么建立的問題:用戶從哪里來的?(注冊?)列表成員是互加的還是怎么的。。。

你自已試著從編碼的角度仔細想想。。。 就像別人說需要聊天產品一樣,我就只需要個聊天而已,然而,再怎么簡單,基礎功能一樣也少不了。。。。。
簽名: 感覺什么也不缺,就缺錢。。
我需要實現的比較簡單,不需要這么復雜。
1關于群聊,就是一個客戶發送消息到服務器端,然后其他的客戶端都能接受這個消息就可以了
2關于用戶列表功能,就是在聊天頁面把在登錄界面注冊過的昵稱顯示出來,用戶斷開連接顯示用戶已下線就可以。
3文件傳輸功能的話,就是客戶端能一對一傳輸文件,現在我能把文件傳輸到服務器端(網上有不少這方面demo),但是服務器端怎么把文件發送給指定用戶,還有用戶如何下載還不會。
關于這些你能幫忙做嗎,價錢可以商量
引用:天上白玉京 發表于 2019-05-05 10:26
我需要實現的比較簡單,不需要這么復雜。
1關于群聊,就是一個客戶發送消息到服務器端,然后其他的客戶端 ...

你說的這一點也不簡單,你認為簡單,只是你還沒有了解具體該怎么做而已。
而且,你也沒有理解我在4樓回復你的,引導你理解如何時具體去落地這些功能。

這種情況下,如果別人幫你定制的話,從人性上來說:別人跟你說工作量,你會說這個很簡單,別人說價錢,你肯定會說太貴了。建議你自已做,又會覺得太繁瑣、太難。就是這么自相矛盾。

所以,這種情況你最好自已提前多考慮清楚。而且,這種情況,我是絕對不會接,也不會碰的。請諒解。

我給你的建議是,你要么自已基于MobileIMSDK-Web開發,要么基于RainbowChat-Web 2次修改。當然,出于尊重對方的選擇權,我從不兜售東西,你完全也可以直接買第3方的,如果恰好如你所說的很簡單的話,那就是皆大歡喜的事了
簽名: 感覺什么也不缺,就缺錢。。
好的,還是謝謝你了
學習
學習了,長知識了,為了金幣
簽名: sf
引用:JackJiang 發表于 2019-05-05 11:32
你說的這一點也不簡單,你認為簡單,只是你還沒有了解具體該怎么做而已。
而且,你也沒有理解我在4樓回 ...

太贊同你的回答了,不知道為什么,大家都喜歡說我想要的功能非常簡單這句話,只是你想的太“簡單”,而不是真正的簡單。
引用:kaga 發表于 2019-07-11 16:20
太贊同你的回答了,不知道為什么,大家都喜歡說我想要的功能非常簡單這句話,只是你想的太“簡單”,而不 ...

是讓別人做就會說簡單,讓自已做就說很復雜,人性啊
簽名: 感覺什么也不缺,就缺錢。。
不錯,我正在研究這個東西,謝謝了
這個web端的能脫離node嗎?直接集成在react項目中?
引用:子彈 發表于 2019-08-12 14:27
這個web端的能脫離node嗎?直接集成在react項目中?

這個web產品的前端是純JS+HTML+CSS,前端不依賴于node(node是服務端的事),只要你的客戶端環境能支持html5就可以運行它
簽名: 感覺什么也不缺,就缺錢。。
好像很厲害
收藏,學習了
打賞樓主 ×
使用微信打賞! 使用支付寶打賞!

返回頂部
曾氏料二肖中特