WebApp快捷打包
即时通讯
转到模块插件

敬告：此 DEMO 演示为开放测试页面，仅用于开发者快速测试体验应用功能，请严格遵守开发者协议，了解更多。

♦ JS-SDK 引用方式：

♦ 普通网页 script 方式加载：下载最新版 jsBridge-v20241118.zip，请在页面上调用 jsBridge 接口之前引用 jsbridge-mini.js 库；

♦ js module 方式引用：npm install ym-jsbridge 具体请参考 npm package

♦ 融云 - IM 即时通讯 / 音视频通话 SDK；

♦ 去申请 接入应用；

♦ js API 接入步骤：

♦ 1. 执行 jsBridge.rc.init 初始化融云系统；

♦ 2. 执行 jsBridge.rc.setUserInfoListener 设置用户资料监听器；

♦ 3. 执行 jsBridge.rc.connect 连接服务器；

♦ 4. 调用业务接口；

基础

init 初始化

• 调用融云其他 API 接口之前需先执行初始化，只需执行一次。

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_init

jsBridge.rc.init({
  //在融云上创建应用获得的 App Key
  //注意：开发环境 与 生产环境 的 App Key 是不同的
  appKey    : "8luwapkv8bqil",
  //是否启用离线推送功能
  //需配置推送功能：融云后台 - IM 服务 - 应用标识 - 设置推送
  enablePush: true
}, function(succ) {
  alert(succ ? "成功" : "失败");
});

setUserInfo 设置用户资料

jsBridge.rc.setUserInfo({
  //用户ID
  userId    : "yimenapp2",
  //昵称
  userName  : "userId 的昵称",
  //头像
  userAvatar: "http://pics.sc.chinaz.com/Files/pic/icons128/5104/3.png"
});
alert("已设置");

setUserInfoListener 设置用户资料 监听器

• 当 APP 要显示用户信息（昵称，头像）的时候会调用此监听器，参数 userId 指示要显示哪个用户的信息；

• 请在回调函数内调用 jsBridge.rc.setUserInfo 设置用户信息；

jsBridge.rc.setUserInfoListener(function(userId) {
  //userId 用户Id
  console.log(userId);
  //从服务器获取用户信息，调用 setUserInfo 设置昵称和头像
  jsBridge.rc.setUserInfo({
    userId    : userId,
    userName  : "userId 的昵称",
    userAvatar: "http://pics.sc.chinaz.com/Files/pic/icons128/5104/3.png" //userId 的头像
  });
});
alert("已设置");

connect 连接服务器 - 用户1

• 成功连接到融云服务器后才能正常调用其他业务接口。

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_connect

• 服务器端接口 https://www.rongcloud.cn/docs/server.html#user_get_token

//用执行服务器端接口 User.register(user) 拿到的 token 连接服务器
// https://www.rongcloud.cn/docs/server_sdk_api/user/user.html#register
jsBridge.rc.connect({
  //yimenapp
  //调用融云服务器端接口获取到的用户 token
  //参考 https://www.rongcloud.cn/docs/server.html#user_get_token
  token     : "dLOiJyJ0kc5ABa68y0cHJTF0GMKRswiHFWMCwqh7SVAltzgqDNpv9OZ0fkoXqaFF4jPVy7sE8TMyVlnBmTl3MA==",
  //用户昵称
  userName  : "闲张三",
  //用户头像
  userAvatar: "http://pics.sc.chinaz.com/Files/pic/icons128/5104/3.png",
  //可选，字符串类型，视频解析度与帧率，默认 VD_480x640_15f
  //仅用于视频会话
  callVideoProfile: "VD_480x640_15f"
}, function(succ, message) {
  alert(succ ? "成功" : "失败:\n" + message);
});
/**
callVideoProfile 属性支持以下字符串：
字符串             支持平台
VD_144x176_15f     Android & iOS
VD_144x176_24f     Android
VD_144x176_30f     Android
VD_144x256_15f     Android
VD_144x256_24f     Android
VD_144x256_30f     Android
VD_240x240_15f     Android
VD_240x240_24f     Android
VD_240x240_30f     Android
VD_240x320_15f     Android & iOS
VD_240x320_24f     Android
VD_240x320_30f     Android
VD_360x480_15f     Android & iOS
VD_360x480_24f     Android
VD_360x480_30f     Android
VD_360x640_15f     Android & iOS
VD_360x640_24f     Android
VD_360x640_30f     Android
VD_368x640_15f     Android
VD_368x640_24f     Android
VD_368x640_30f     Android
VD_480x640_15f     Android & iOS （默认）
VD_480x640_24f     Android
VD_480x640_30f     Android
VD_480x720_15f     Android & iOS
VD_480x720_24f     Android
VD_480x720_30f     Android
VD_480x854_15f     Android
VD_480x854_24f     Android
VD_480x854_30f     Android
VD_720x1280_15f    Android & iOS
VD_720x1280_24f    Android
VD_720x1280_30f    Android
VD_1080x1920_15f   Android
VD_1080x1920_24f   Android
VD_1080x1920_30f   Android
**/

connect 连接服务器 - 用户2

• 成功连接到融云服务器后才能正常调用其他业务接口。

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_connect

//用执行服务器端接口 User.register(user) 拿到的 token 连接服务器
// https://www.rongcloud.cn/docs/server_sdk_api/user/user.html#register
jsBridge.rc.connect({
  //yimenapp2
  token: "W32PGRIGhAhmh26VMKrXq42Wpo2+AX21vVOA1b6ApXlc5/BkuadzUMEtOTpSNVXz2LBdfVOKzahPHvB7RVTxzKZd9ZqgLua5",
  //用户昵称
  userName  : "忙李四",
  //用户头像
  userAvatar: "http://pics.sc.chinaz.com/Files/pic/icons128/5105/0.png"
}, function(succ, message) {
  alert(succ ? "成功" : "失败:\n" + message);
});

connect 连接服务器 - 用户3

• 成功连接到融云服务器后才能正常调用其他业务接口。

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_connect

//用执行服务器端接口 User.register(user) 拿到的 token 连接服务器
// https://www.rongcloud.cn/docs/server_sdk_api/user/user.html#register
jsBridge.rc.connect({
  //yimen_user3
  token: "XHMN0tTzZkgjSwBR2Rxgro2Wpo2+AX21vVOA1b6ApXlc5/BkuadzULefDnkh25P0IvNFgwKkf89Za+nUfdtouaolVx8L+Gtp",
  //用户昵称
  userName  : "枯叶碟",
  //用户头像
  userAvatar: "http://pics.sc.chinaz.com/Files/pic/icons128/7422/m13.png"
}, function(succ, message) {
  alert(succ ? "成功" : "失败:\n" + message);
});

disconnect 断开服务器连接

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_disconnect

jsBridge.rc.disconnect(function(succ) {
  alert(succ ? "成功" : "失败");
});

logout 断开服务器连接并退出融云

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_disconnect

jsBridge.rc.logout(function(succ) {
  alert(succ ? "成功" : "失败");
});

IM 即时通讯

startConversation 启动聊天会话 1

• 开启会话

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_conversation_list_config

//开启会话
jsBridge.rcIM.startConversation({
  //必须，数字类型，会话类型
  conversationType: 1,
  //必须，字符串类型，会话对象，根据不同的 conversationType，可能是用户Id、群组Id 或 聊天室Id
  targetId: "yimenapp",
  //可选，字符串类型，会话标题
  title   : "聊起来1~~"
}, function(succ) {
  if (!succ) alert("失败");
});

/**
会话类型说明(conversationType)：
1 : private
2 : discussion
3 : group
4 : chatroom
5 : customer_service
6 : system
7 : app_public_service
8 : public_service
9 : push_service
11: encrypted
12: rtc_room
**/

startConversation 启动聊天会话 2

• 开启会话

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_conversation_list_config

//开启会话
jsBridge.rcIM.startConversation({
  //必须，数字类型，会话类型
  conversationType: 1,
  //必须，字符串类型，会话对象，根据不同的 conversationType，可能是用户Id、群组Id 或 聊天室Id
  targetId: "yimenapp2",
  //可选，字符串类型，会话标题
  title   : "聊起来2~~"
}, function(succ) {
  if (!succ) alert("失败");
});

startConversationList 启动聊天会话列表

• 打开全部类型的会话列表

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_conversation_list_config

//打开全部类型的会话列表
jsBridge.rcIM.startConversationList({
  //可选，数字数组，指定需要展开显示的会话类型（会话列表默认为分组聚合(折叠)显示，这里指定不折叠（展开）显示的会话类型，参见 startConversation 方法
  flat: [2, 3, 5]
}, function(succ) {
  if (!succ) alert("失败");
});

startSubConversationList 启动聚合后的某类型会话列表

• 打开某种类型会话列表

• 参考官方说明 https://www.rongcloud.cn/docs/android.html#integration_conversation_list_config

//打开单个类型的会话列表
jsBridge.rcIM.startSubConversationList({
  //必须，数字类型，打开单个类型的会话列表，会话类型 startConversation 方法
  conversationType: 1
}, function(succ) {
  if (!succ) alert("失败");
});

unreadMessageCount 获取未读消息数量

• 获取未读消息数量

jsBridge.rcIM.unreadMessageCount(function(count) {
  alert(count + " 条未读");
});

音视频通话

startSingleCall 发起单人通话 - 用户1

• 发起单人通话

• 参考官方说明 https://www.rongcloud.cn/docs/ios_callkit.html#start_call

jsBridge.rcCall.startSingleCall({
  //通话对方用户 id
  targetId: "yimenapp",
  //true - 视频通话，false - 音频通话
  video   : true
}, function(succ) {
  if (!succ) alert("失败");
});

startSingleCall 发起单人通话 - 用户2

• 发起单人通话

• 参考官方说明 https://www.rongcloud.cn/docs/ios_callkit.html#start_call

jsBridge.rcCall.startSingleCall({
  //通话对方用户 id
  targetId: "yimenapp2",
  //true - 视频通话，false - 音频通话
  video   : true
}, function(succ) {
  if (!succ) alert("失败");
});

startMultiCall 发起多人通话 - 用户3

• 发起多人通话

• 参考官方说明 https://www.rongcloud.cn/docs/ios_callkit.html#start_call

jsBridge.rcCall.startMultiCall({
  //通话对方用户 id
  targetId: "yimenapp2",
  //true - 视频通话，false - 音频通话
  video   : true,
  //会话类型
  conversationType: 1,
  //参与者用户 id 列表
  userIds : ["yimenapp2", "yimen_user3"]
}, function(succ) {
  if (!succ) alert("失败");
});

/**
会话类型(conversationType)：
1 : private             私聊
2 : discussion          讨论组
3 : group               群组
4 : chatroom            聊天室
5 : customer_service
6 : system
7 : app_public_service
8 : public_service
9 : push_service
11: encrypted
12: rtc_room
**/

全部示例
Copyright © 2024 WebApp快捷打包