https://developer.rongcloud.cn 详情见融云官网
一、IM融云及时通讯主要应用在web端,APP移动端的及时通讯聊天,聊天类型有:单聊,聊天室,群聊,直播间聊天等等
今天主要讲web端单聊和聊天室的实现
实现步骤如下:
1.用户登录后获取token,这个指的是融云token,需要appkey(注册融云的时候申请) ,App Secret
获取token的接口
URL:http://api.cn.ronghub.com/user/getToken.[format]
参数:
userId | String | 用户 Id,支持大小写英文字母、数字、部分特殊符号 + | = - _ 的组合方式,最大长度 64 字节。是用户在 App 中的唯一标识码,必须保证在同一个 App 内不重复,重复的用户 Id 将被当作是同一用户。(必传) |
name | String | 用户名称,最大长度 128 字节。用来在 Push 推送时显示用户的名称。(必传) |
portraitUri | String | 用户头像 URI,最大长度 1024 字节。(必传) |
此时以获取与userId 绑定的token
2.前端拿到token后,首先初始化融云客户端
2.1需要引入融云js
2.2初始化客户端
RongIMLib.RongIMClient.init("appkey");
2.3 拿到token,用客户端链接融云服务器
var token = "mKmyKqTSf7aNDinwAFMnz7NXKILeV3X0+CCRBOxmtOApmvQjMathViWrePIfq0GuTu9jELQqsckv4AhfjCAKgQ==";
RongIMClient.connect(token, {
onSuccess: function(userId) {
console.log("Connect successfully." + userId);
},
onTokenIncorrect: function() {
console.log('token无效');
},
onError:function(errorCode){
var info = '';
switch (errorCode) {
case RongIMLib.ErrorCode.TIMEOUT:
info = '超时';
break;
case RongIMLib.ConnectionState.UNACCEPTABLE_PAROTOCOL_VERSION:
info = '不可接受的协议版本';
break;
case RongIMLib.ConnectionState.IDENTIFIER_REJECTED:
info = 'appkey不正确';
break;
case RongIMLib.ConnectionState.SERVER_UNAVAILABLE:
info = '服务器不可用';
break;
}
console.log(errorCode);
}
});
2.4 设置监听状态
// 设置连接监听状态 ( status 标识当前连接状态 )
// 连接状态监听器
RongIMClient.setConnectionStatusListener({
onChanged: function (status) {
switch (status) {
case RongIMLib.ConnectionStatus.CONNECTED:
console.log('链接成功');
break;
case RongIMLib.ConnectionStatus.CONNECTING:
console.log('正在链接');
break;
case RongIMLib.ConnectionStatus.DISCONNECTED:
console.log('断开连接');
break;
case RongIMLib.ConnectionStatus.KICKED_OFFLINE_BY_OTHER_CLIENT:
console.log('其他设备登录');
break;
case RongIMLib.ConnectionStatus.DOMAIN_INCORRECT:
console.log('域名不正确');
break;
case RongIMLib.ConnectionStatus.NETWORK_UNAVAILABLE:
console.log('网络不可用');
break;
}
}});
2.5设置消息监听器,监听收到的消息
// 消息监听器
RongIMClient.setOnReceiveMessageListener({
// 接收到的消息
onReceived: function (message) {
// 判断消息类型
switch(message.messageType){
case RongIMClient.MessageType.TextMessage:
// message.content.content => 消息内容
break;
case RongIMClient.MessageType.VoiceMessage:
// 对声音进行预加载
// message.content.content 格式为 AMR 格式的 base64 码
break;
case RongIMClient.MessageType.ImageMessage:
// message.content.content => 图片缩略图 base64。
// message.content.imageUri => 原图 URL。
break;
case RongIMClient.MessageType.DiscussionNotificationMessage:
// message.content.extension => 讨论组中的人员。
break;
case RongIMClient.MessageType.LocationMessage:
// message.content.latiude => 纬度。
// message.content.longitude => 经度。
// message.content.content => 位置图片 base64。
break;
case RongIMClient.MessageType.RichContentMessage:
// message.content.content => 文本消息内容。
// message.content.imageUri => 图片 base64。
// message.content.url => 原图 URL。
break;
case RongIMClient.MessageType.InformationNotificationMessage:
// do something...
break;
case RongIMClient.MessageType.ContactNotificationMessage:
// do something...
break;
case RongIMClient.MessageType.ProfileNotificationMessage:
// do something...
break;
case RongIMClient.MessageType.CommandNotificationMessage:
// do something...
break;
case RongIMClient.MessageType.CommandMessage:
// do something...
break;
case RongIMClient.MessageType.UnknownMessage:
// do something...
break;
default:
// do something...
}
}
});
2.6发送消息
var msg = new RongIMLib.TextMessage({content:"hello RongCloud!",extra:"附加信息"});
var conversationtype = RongIMLib.ConversationType.PRIVATE; // 单聊,其他会话选择相应的消息类型即可。
var targetId = "xxx"; // 目标 Id
RongIMClient.getInstance().sendMessage(conversationtype, targetId, msg, {
onSuccess: function (message) {
//message 为发送的消息对象并且包含服务器返回的消息唯一Id和发送消息时间戳
console.log("Send successfully");
},
onError: function (errorCode,message) {
var info = '';
switch (errorCode) {
case RongIMLib.ErrorCode.TIMEOUT:
info = '超时';
break;
case RongIMLib.ErrorCode.UNKNOWN_ERROR:
info = '未知错误';
break;
case RongIMLib.ErrorCode.REJECTED_BY_BLACKLIST:
info = '在黑名单中,无法向对方发送消息';
break;
case RongIMLib.ErrorCode.NOT_IN_DISCUSSION:
info = '不在讨论组中';
break;
case RongIMLib.ErrorCode.NOT_IN_GROUP:
info = '不在群组中';
break;
case RongIMLib.ErrorCode.NOT_IN_CHATROOM:
info = '不在聊天室中';
break;
default :
info = x;
break;
}
console.log('发送失败:' + info);
}
}
);
可以设置消息类型
会话名称 | 会话类型枚举 ConversationType | 对应的 targetId |
---|---|---|
单聊 | PRIVATE | 用户的 Id(userId) |
群组 | GROUP | 群组的 Id(groupId) |
聊天室 | CHATROOM | 聊天室的 Id(chatroomId) |
客服 | CUSTOMER_SERVICE | 客服的 Id(customerServiceId) |
系统会话 | SYSTEM | 系统账户 Id。可以理解为 QQ 的 10000 号的角色 |
应用公众服务 | APP_PUBLIC_SERVICE | 应用公众服务的 Id(publicServiceId) |
公众服务 | PUBLIC_SERVICE | 公众服务的 Id(publicServiceId) |
如果是聊天室,则消息类型为CHATROOM targetId为 聊天室Id
3.聊天室
3.1创建聊天室
可以在后端server创建聊天室
URL:http://api.cn.ronghub.com/chatroom/create.[format]
参数:
id:聊天室Id 唯一标识
name: 聊天室名称
3.2 web端加入聊天室 可以在建立链接的成功的回调函数中执行加入聊天室的方法
var chatRoomId = "xxxx"; // 聊天室 Id。
var count = 10;// 拉取最近聊天最多 50 条。
RongIMClient.getInstance().joinChatRoom(chatRoomId, count, {
onSuccess: function() {
// 加入聊天室成功。
},
onError: function(error) {
// 加入聊天室失败
}
});
如果此时聊天室id不存在,则会重新创建一个聊天室
发送聊天与上述方法相同,只是消息类型不同,targetId不同
3.3退出聊天室
var chatRoomId = "xxxx"; // 聊天室 Id。
RongIMClient.getInstance().quitChatRoom(chatRoomId, {
onSuccess: function() {
// 退出聊天室成功。
},
onError: function(error) {
// 退出聊天室失败。
}
});
3.4获取聊天室信息
var chatRoomId = "xxxx";// 聊天室 Id。
var count = 10; // 获取聊天室人数 (范围 0-20 )
var order = RongIMLib.GetChatRoomType.REVERSE;// 排序方式。
RongIMClient.getInstance().getChatRoomInfo(chatRoomId, count, order, {
onSuccess: function(chatRoom) {
// chatRoom => 聊天室信息。
// chatRoom.userInfos => 返回聊天室成员。
// chatRoom.userTotalNums => 当前聊天室总人数。
},
onError: function(error) {
// 获取聊天室信息失败。
}
});
3.5获取云端历史消息
//获取历史消息的起始位置
var chatRoomId = 'xxxx';
var timestamp = 0; // 获取历史消息起始时间(毫秒)
RongIMClient.getInstance().setChatroomHisMessageTimestamp(chatRoomId, timestamp);
var chatRoomId = 'xxxx';
var count = 10; // 拉取的条数 count <= 200
var order = 1; // 1正序;0倒序
RongIMClient.getInstance().getChatRoomHistoryMessages(chatRoomId, count, order, {
onSuccess: function(list, hasMore) {
// list => 消息数组
// hasMore => 是否有更多的历史消息
},
onError: function(error) {
}
});
3.6 服务端销毁聊天室
URL:http://api.cn.ronghub.com/chatroom/destroy.[format]
参数:
名称 | 类型 | 说明 |
---|---|---|
chatroomId | String | 要销毁的聊天室 Id。(必传) |
补充内容:关于聊天的一些监听方法,如监听链接状态,建立链接,初始化客户端
如果链接状态不改变,则改方法的回调函数不执行
如果已经是链接状态,那么再次建立链接方法不执行
如果客户端已经存在,那么初始化客户端不能重新被初始化,需要先用disconnection()方法,断开客户端链接
js方法都是异步执行,需要有先后顺序,很多方法是在前一个方法执行过后的回调函数中执行