公司移動端在ios 平臺和 安卓平臺已經(jīng)實現(xiàn)了點對點的聊天功能，產(chǎn)品需求在pc端能實現(xiàn)消息同步和互聯(lián)，因為是第一次使用，在五天之內(nèi)開發(fā)一個基礎(chǔ)版的功能，走了一些彎路在這里分享給大家，希望能夠給大家一些幫助！

chat.gif

其中最重大的一個坑就是開發(fā)的思路的問題，因為我這里是點對點的聊天，其中沒有群聊和好友的概念在里面，所以相對會簡單一些。

• 第一個步
  我們需要初始化云信的IM函數(shù)

  var ni m = NIM.getInstance({
  // debug: true,
  appKey: 'appKey',
  account: 'account',
  token: 'token',
  // privateConf: {}, // 私有化部署方案所需的配置
  onconnect: onConnect,
  onwillreconnect: onWillReconnect,
  ondisconnect: onDisconnect,
  onerror: onError
});

appKey是你登錄云信后臺去取得，這里有個小坑就是acount 和token 都只能是小寫，不能有大寫，要不然取會話列表值的時候會辨識為不同會話列表?。ㄇ杏洠?/p>

• 第二步

        onSessions: function(sessions) {
            this.sessions = nim.mergeSessions(this.sessions, sessions) // 這里使用sdk自帶的方法合并會話列表重新賦值
            this.usDateSessionsUI(); //更新UI
        },
      //更新會話
        onUpdateSession: function (session) {
            this.sessions = nim.mergeSessions(this.sessions, session)
            this.usDateSessionsUI();//更新UI
        },

因為會話列表中并不包含頭像等信息所以我們需要另一個接口給我提供這些數(shù)據(jù)

• 第三步

var accounts = this.sessions.map(function(item) {
    if(item.lastMsg){
        if(item.lastMsg.flow == 'in'){
            return item.lastMsg.from;
        } else {
            return item.lastMsg.to;
        }
    }
})

我們要匹配出發(fā)進來的id進行匹配 得到我們的 acounts

 nim.getUsers({
  accounts: accounts,
  done: function(error, users){
      if (!error) {
          that.accountList = users.map(function(it, idx){
              for(var i = 0; i < that.sessions.length; i++) {
                  if(that.sessions[i].lastMsg.flow == 'in') {
                      if(it.account === that.sessions[i].lastMsg.from) {
                        // 自己定義
                      }
                  } else {
                      if(it.account === that.sessions[i].lastMsg.to) {
                       // 自己定義
                      }
                  }
              }
              return it;
          });
      }
  }
});

把acounts傳入我們的 getUsers的接口返回我們的用戶信息 在自定義中大家可以任意拼裝我們的數(shù)據(jù)

• 第四步

 // 點擊每個會話列表中某個用戶
targetUser: function(item, index) {
    var that = this;
    this.currentAcount = item.account;
    this.currentSessionId = item.sessionsId;
    // 設置當前會話 面板打開的時候才重新設置會話未讀數(shù)量
    if(this.isBigPanel) nim.setCurrSession(item.sessionsId);
    this.currentFromInfo = item;
    this.currentIndex = item.account;
    this.getLocalMsg(); //獲取本地聊天內(nèi)容對話消息
    
},

我這里選用的獲取本地的存儲的接口數(shù)據(jù)，沒有那么占用網(wǎng)絡資源，速度也更優(yōu)，但是如果換了機器會話記錄就沒有了，各區(qū)所需。

• 第五步

  // 獲取本地信息
getLocalMsg: function(){
    var that = this;
    nim.getLocalMsgs({
        sessionId: this.currentSessionId,
        limit: 1000,
        start: this.todayTime,
        end: Infinity,
        // desc: false,
        done: function (error, obj) {
            if (!error) {
                that.messageList = obj.msgs.reverse().map(function(item) {
                    // 如果是自定義消息 將 content 轉(zhuǎn) json
                    if(item.type === 'custom') {
                        item.content = JSON.parse(item.content);
                    }
                    return item;
                });
                that.scrollToBottom();
                // that.insertTimeDom();
            }
        }
    })
},

我這里默認取了1000條數(shù)據(jù)，如果有自定義的消息大家就根據(jù)判斷取數(shù)據(jù)了。

-完-