融云web API 使用心得
总体思路，按手册的来就行了。先引入相关js，再初始化，然后连接融云服务器，设置连接状态监听器以及消息监听器，（消息监听器可以获取接受到的message，取要显示的内容显示在页面上，这里就和页面连接上了，不过样式得自己写的），将生成消息方法绑定事件，触发事件发送消息。
1.首先
获取官方 Web SDK (目前版本为 2.2.5 ) 地址加入到自己页面中 如下(支持 https):我建议一定要引最新版本。
<script src="http://cdn.ronghub.com/RongIMLib-2.2.5.min.js">script> - 1
- 1
引入以上一个以及其他要引入的
2.初始化（填入自己申请的 appkey值 和 token值 ） //获取融云的token,官方文档说的很清楚。
RongIMClient.init("appkey值");//这是初始化，需要填参数就是你的APPKEY。这个不难理解。
var token = "token值";- 1
- 2
- 1
- 2
3.连接融云服务器
// 连接融云服务器。
RongIMClient.connect(token, {
onSuccess: function(userId) {
console.log("Login successfully."+ userId);
//userId是申请token时的填写的id，到时候可以封装在下面的extra中传过去
},
onTokenIncorrect: function() {
console.log('token无效');
},
onError:function(errorCode){
var info = '';
switch (errorCode) {
case RongIMLib.ErrorCode.TIMEOUT:
info = '超时';
break;
case RongIMLib.ErrorCode.UNKNOWN_ERROR:
info = '未知错误';
break;
case RongIMLib.ErrorCode.UNACCEPTABLE_PaROTOCOL_VERSION:
info = '不可接受的协议版本';
break;
case RongIMLib.ErrorCode.IDENTIFIER_REJECTED:
info = 'appkey不正确';
break;
case RongIMLib.ErrorCode.SERVER_UNAVAILABLE:
info = '服务器不可用';
break;
}
console.log(errorCode);
}
});
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
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.NETWORK_UNAVAILABLE:
console.log('网络不可用');
break;
}
}
});- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
5.消息监听器
// 消息监听器
RongIMClient.setOnReceiveMessageListener({
// 接收到的消息
onReceived: function (message) {
// 判断消息类型
switch(message.messageType){
console.log(message.content.content);
//message接受到的消息（包含发送的信息，也可以在extra中添加要传递的值，如：时间等）
break;
case RongIMClient.MessageType.ImageMessage:
// do something...
break;
case RongIMClient.MessageType.DiscussionNotificationMessage:
// do something...
break;
case RongIMClient.MessageType.LocationMessage:
// do something...
break;
case RongIMClient.MessageType.RichContentMessage:
// do something...
break;
case RongIMClient.MessageType.DiscussionNotificationMessage:
// do something...
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...
}
}
});- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
6.生成聊天内容
我将生成消息的方法，绑定在按钮的点击事件上，点击发送消息
function getMessage(){
//生成聊天内容
$('.content_box').append( 。。。);
//在页面追加你要生成的内容
// 定义消息类型,文字消息使用 RongIMLib.TextMessage
var msg = new RongIMLib.TextMessage({content:"hello",extra:"附加要传递的值"});
var conversationtype = RongIMLib.ConversationType.PRIVATE; // 私聊
var targetId = "输入目标的userId"; // 目标 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);
}
}
);
}