作爲小白接融雲 IM SDK 新路體驗~
前提說明
應項目需求，實現即時通訊功能，業務場景相對單一，僅有單聊場景。選用的是融雲的 IM SDK。
作爲小白的初期心路歷程
由於本人之前沒有了解過即時通訊初期瞭解還是費了不少時間的。藍瘦~
話不多說，請看操作
第一步：註冊
首先要在融雲的開發者後臺註冊拿到相應的信息。
由於初期瞭解，自己註冊了一個開發者賬號，沒有用公司的，自己搞了個 appkey 和測試的 token，想着先弄個出樣子。賬號的註冊參考的文檔的快速集成中的 前提條件。
參考地址：
https://docs.rongcloud.cn/v4/views/im/noui/guide/quick/premise/ios.html
後續這個服務端會給我們提供連接用的 token。這裏先不做過多介紹。
第二步：看文檔
由於之前對即時通訊業務的盲區，其實最開始公司給出的一對一聊天室有些無從下手的。接下來是漫無目的的逛文檔。文檔目錄還是很對我口味的，個人感覺還不錯，在不經意間發現了個切換文檔佈局的小功能個人比較喜歡。如果場景不清楚就用場景的文檔，清楚了可以切換成平臺的，很方便很清晰。~(｡≧3≦)ﾉ⌒☆
我主要是通過看單聊的文檔還有切換成平臺模式的 web 端文檔實現的集成。
附上文檔地址：https://docs.rongcloud.cn/v4/views/im/noui/guide/quick/include/web.html
第三步：先弄個簡單的示例
示例我參考了快速集成。SDK 使用的是 web 3.x 的 SDK
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://cdn.ronghub.com/RongIMLib-3.0.5-dev.js"></script>
</head>
<body>
<input id='messageValue' type="text/">
<button onclick="sendMessage()">發送</button>
<button onclick="getMessageList()">獲取歷史消息</button>
</body>
<script>
var appkey = 'XXX';
var token = 'XXXX';
var im;
var conversationList = [];
function init() {
im = RongIMLib.init({ appkey: appkey });
im.watch({
conversation: function (event) {
var updatedConversationList = event.updatedConversationList;
console.log('更新會話彙總:', updatedConversationList);
console.log('最新會話列表:', im.Conversation.merge({
conversationList,
updatedConversationList
}));
},
message: function (event) {
var message = event.message;
console.log('收到新消息:', message);
},
status: function (event) {
var status = event.status;
console.log('連接狀態碼:', status);
}
});
}
function connect() {
var user = { token: token };
im.connect(user).then(function (user) {
console.log('鏈接成功, 鏈接用戶 id 爲: ', user.id);
}).catch(function (error) {
console.log('鏈接失敗: ', error.code, error.msg);
});
}
function sendMessage() {
var inputText = document.getElementById('messageValue').value;
var conversation = im.Conversation.get({
targetId: 'user1',
type: RongIMLib.CONVERSATION_TYPE.PRIVATE
});
conversation.send({
messageType: RongIMLib.MESSAGE_TYPE.TEXT,
content: {
content: inputText
}
}).then(function (message) {
console.log('發送文字消息成功', message);
});
}
function getMessageList() {
var conversation = im.Conversation.get({
targetId: 'user1',
type: RongIMLib.CONVERSATION_TYPE.PRIVATE
});
var option = {
timestrap: +new Date(),
count: 20
};
conversation.getMessages(option).then(function (result) {
var list = result.list;
var hasMore = result.hasMore;
console.log('獲取歷史消息成功', list, hasMore);
});
}
init();
connect();
</script>
</html>根據文檔一步一步操作，都很順利。體感不錯。
額。。。請忽略我沒有寫 UI，只有個輸入框和發消息按鈕。此處也想給融雲提個小建議，要是有 UI 組件或者含 UI 的 SDK那就更完美了。
遇到的坑
由於看文檔時沒有注意到獲取歷史消息需要先開通服務。導致自己消息發送成功再去獲取歷史消息有問題，自己研究獲取歷史消息的方法研究了半天。