请选择 进入手机版 | 继续访问电脑版

默认
打赏 发表评论 9
Web版即时通讯/IM系统:RainbowChat-Web基本介绍

1、基本介绍


未标题-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/建议发送至:jb2011@163.com
  • 技术培训/转让/合作/咨询等欢迎联系作者 QQ:413980957、微信:hellojackjiang

5、技术转让和授权方式


实施细则:RainbowChat-Web 技术转让说明、授权协议书范本》。
补充说明:如果还需了解更多技术细节或解答其他疑问,请联系作者,QQ:413980957、微信:hellojackjiang、邮箱:jack.jiang@52im.net

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浏览器、世界之窗浏览器等▼

RainbowChat-Web在部分主流浏览器上的运行截图.jpg
▲ 在各种主流浏览器上的运行情况更多截图点此进入更多演示视频点此进入

222.jpg
▲ 超宽屏上的显示情况更多截图点此进入更多演示视频点此进入

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)架构简洁:简单直接,易于学习,能少一个分层则绝不强行炫技;
  • 3)不使用任何企业框架:前端包括AngularJS/VUE/EmberJS/React等、后端包括express/koa/thinkjs/egg等,返璞归真,技术和性能完全可控;
  • 4)简单地就是最好的:始终贯彻简单直接的互联网产品技术理念。

12、技术合法性


111.jpg
说明:完全自主产权,全套高质量源码和设计文件,绝无隐藏的第3方依赖(详见《RainbowChat-Web 技术转让说明、授权协议书范本》)。

13、部分概览截图


* 详细截图说明请查看《RainbowChat-Web前端功能截图
* 运行演示视频请查看《RainbowChat-Web运行演示视频

以下为主要界面截图概览:

aa.jpg
▲ 主界面更多截图点此进入更多演示视频点此进入

bb.jpg
▲ 主界面(聊天窗全屏时)更多截图点此进入更多演示视频点此进入

cc.jpg
▲ 主界面(聊天窗关闭时)更多截图点此进入更多演示视频点此进入

即时通讯网 - 即时通讯开发者社区! 来源: - 即时通讯开发者社区!

推荐方案
评论 9
你好,请问我只需要群聊和文件传输功能可以吗
就是在那个web版的demo上增添一个群聊和文件传输功能以及用户列表
引用:天上白玉京 发表于 2019-05-05 08:47
就是在那个web版的demo上增添一个群聊和文件传输功能以及用户列表

功能说起来都很简单,但细细一理,一样都少不了:
1)群聊需要群成员列表吧,列表怎么建立的?群怎么群立的?邀请入群呢?删除成员呢?群怎么解散?群名要改吗?等等
2)文件传输功能:怎么上传呢?指令怎么发送?指令怎么解析?界面UI怎么显示?怎么下载呢?
3)用户列表怎么建立的问题:用户从哪里来的?(注册?)列表成员是互加的还是怎么的。。。

你自已试着从编码的角度仔细想想。。。 就像别人说需要聊天产品一样,我就只需要个聊天而已,然而,再怎么简单,基础功能一样也少不了。。。。。
签名: 《快速了解Electron:新一代基于Web的跨平台桌面技术》http://www.52im.net/thread-2616-1-1.html
我需要实现的比较简单,不需要这么复杂。
1关于群聊,就是一个客户发送消息到服务器端,然后其他的客户端都能接受这个消息就可以了
2关于用户列表功能,就是在聊天页面把在登录界面注册过的昵称显示出来,用户断开连接显示用户已下线就可以。
3文件传输功能的话,就是客户端能一对一传输文件,现在我能把文件传输到服务器端(网上有不少这方面demo),但是服务器端怎么把文件发送给指定用户,还有用户如何下载还不会。
关于这些你能帮忙做吗,价钱可以商量
引用:天上白玉京 发表于 2019-05-05 10:26
我需要实现的比较简单,不需要这么复杂。
1关于群聊,就是一个客户发送消息到服务器端,然后其他的客户端 ...

你说的这一点也不简单,你认为简单,只是你还没有了解具体该怎么做而已。
而且,你也没有理解我在4楼回复你的,引导你理解如何时具体去落地这些功能。

这种情况下,如果别人帮你定制的话,从人性上来说:别人跟你说工作量,你会说这个很简单,别人说价钱,你肯定会说太贵了。建议你自已做,又会觉得太繁琐、太难。就是这么自相矛盾。

所以,这种情况你最好自已提前多考虑清楚。而且,这种情况,我是绝对不会接,也不会碰的。请谅解。

我给你的建议是,你要么自已基于MobileIMSDK-Web开发,要么基于RainbowChat-Web 2次修改。当然,出于尊重对方的选择权,我从不兜售东西,你完全也可以直接买第3方的,如果恰好如你所说的很简单的话,那就是皆大欢喜的事了
签名: 《快速了解Electron:新一代基于Web的跨平台桌面技术》http://www.52im.net/thread-2616-1-1.html
好的,还是谢谢你了
学习
学习了,长知识了,为了金币
签名: sf
打赏楼主 ×
使用微信打赏! 使用支付宝打赏!

返回顶部