easemob / webim Goto Github PK

View Code? Open in Web Editor NEW

124.0 21.0 96.0 20.05 MB

Shell 2.10% JavaScript 83.73% HTML 14.17%

webim's Introduction

React Demo（WebIM）介绍

更新时间：2023-04-10

新增群组Mentions 功能, 使用Antd Mentions组件

实现方案:

文本消息新增扩展字段em_at_list, 表示被@的用户ID,

'ALL' 表示@所有人
['userId', 'userId2'] 表示@指定用户

const MENTION_ALL = 'ALL';
let mentionList = ['userId', 'userId1'];
let isMentionALl = true

let txt = {
	to: 'groupId',
	chatType: 'groupChat',
	msg: '@user 你好',
	type: 'txt',
	ext: {
		em_at_list: isMentionALl ? MENTION_ALL : atList
	}
}

收到文本消息, 如扩展字段包含em_at_list则表示为@消息，如果em_at_list包含当前用户,则进行UI更新

// onTextMessage回调中
let mentionList = message?.ext?.em_at_list
// 如果存在mentionList, 并且不是当前用户多端同步的消息
if(mentionList && message.from !== WebIM.conn.user){
	// 如果是@所有人或者mentionList包含当前用户ID
	if(mentionList === MENTION_ALL || mentionList.includes(WebIM.conn.user)){
		// 则进行UI更新
	}
}

更新时间：2022-07-15

环信即时通讯 WEB 端提供示例应用可供体验。为方便体验，建议使用你自己的 Demo 应用，具体步骤如下：

在环信即时通讯云 IM 管理后台通过邮箱注册，可以看到默认的 Demo 应用（默认应用是全功能开通的应用）；
在上图页面 Demo 应用右侧点击查看，选择 开放注册；

打开 Demo，点击 服务器配置；
将 Demo 的 App Key 填入，点击 保存配置；
然后点击 注册用户 进行体验。

注意

注册模式分两种，开放注册和授权注册。只有开放注册时，才可以客户端注册。

开放注册是为了测试使用，正式环境中不推荐使用该方式注册环信账号；
授权注册的流程应该是你的应用服务器通过环信提供的 REST API 注册，之后将 token 保存到你的应用服务器或返回给客户端。

代码下载

下载源代码：github 源码地址

欢迎大家提交 PR 改进和修复 WebIM 中的问题。

运行 WebIM 工程

从IM SDK 及 Demo 下载下载 WEB SDK 压缩包，然后解压。解压后在 demo 文件夹下，即为 WebIM 的工程目录。

初始化安装
- 在/demo下执行 npm install
运行demo
- cd demo && npm start
  
  http://localhost:3001
- cd demo && HTTPS=true npm start (webrtc supports HTTPS only)
  
  https://localhost:3001

主要模块介绍

Demo 中有几大模块

components —— 项目中定义的组件
config —— SDK 初始化配置
containers —— 容器组件，包含 contact, chat, login/regester
layout —— chat 部分的布局
selectors —— 缓存数据，优化性能
utils —— 数据库和工具方法

webim's People

Contributors

Stargazers

Watchers

Forkers

luojiahao123 dhcai fanjiangwei7 githubzhaoliang hq-610 kokome01 hyphenateinc vikibeta lyzardiar andrewzheng easezy wiladog sunylt pickercc iofan fushanlang fendaq chengxiuning lianchengtong lixinkuan geekoutnet fuhai7312484 cca313 sznsky zengxm dangluhua fanzhiyi0601 liuyun3640 myzhangdong 00zhengfu00 daheaths anygong astra-zhao changpan87 jettangtzj hdzxy123 ericsb freexiangfly tianheil3 wangkunmin ssshaoshuai brucewu16899 gravelchen shiyude lorrinami jujulike chen20181120 leisongn zhangsongren numberen wangzb26 qwk-001 andy-upp nofulls linxinqiang chinesecabbagew 424363283 icodeartist jyozeenxujun23 itoorchen xqx1998 chenxiaofan123 nenx wangzhezichuan z857039580 iq9891 deific yj445649862 orientswift huangyilin smz8023 x-flysnail zwq8299174 wlxweb yanxiaoxuloveyou hankangkangjim boxshadow daodangui zongdaling biz-project 1016724678 wster11 luleiyu wangying-sarah rectmoon chenchencoding droidsde numbpeople fengguoxiang agoraio-usecase fragransq lizg001 will-yc wwk-home sanjiaomao215 jerry-chao

webim's Issues

可以拆分自定义的功能模块吗？

目前我们的这个SDK只用到了聊天，其他功能模块都没有用到，所以只想抽离其中的聊天功能就可以了，其他类似，加好友，群组之类的，不需要。抽离的主要原因是，目前引入完整的SDk就算用了cdn也还是达到50多KB，所以能麻烦可以精简一下吗？或者有什么途径方案 @myZhangDong

你们不能只管react呀，其他框架的咋办，demo.html已废

sdk/demo.html引入的js基本都找不到，webrtc的居然直接注释掉，你们确定是在做产品吗？

没法进行群组管理。

branches dev 虽然修改了无法发送表情的bug，但是没法申请进群,一直显示在已经在群组中，也没法拉人进群, 报错信息如下

在sendTxtMessage成功后怎么在本地服务器上获取回调的信息？

服务器已经配置过了是不是前端还要配置什么东西？没看到文档里有相关说明

Web端是否有像Android，iOS端那样getAllConversations方法获取临时会话？

背景：公司当前App的集成的方式全部是不加好友，直接向某个userId的联系人发送消息，这种方式在App端可以通过getAllConversations 获取到历史会话，但我查阅web端的文档没有发现等效的方法。

请问是否有类似方法？

开发环境信息

☁ demo [dev_3.0] ⚡ node -v
v18.9.1

项目版本

demo [dev_3.0]

操作步骤

1.在demo/src/config 更换 WebIMConfig.js 中的 appkey echo MTE2MzE3MTAyNjExNTc1MyUyM2RlbW8= | base64 --decode
2.npm install
3.HTTPS=true npm start
4.访问：https://localhost:3001/#/login
用户名：123456 密码：123456（已在环信后台创建）