小程序集成环信IM

摘要：最近在做一款有语音直播功能的小程序，用到了环信集成功能，由于我搜了下目前用环信做小程序的的确是少之又少，而且环信官方说从月份不再更新代码具体原因我也没问，可能本身微信就是一款聊天工具所以用处不大我们产品需要用到聊天室功能，之前做端登录完成之

最近在做一款有语音直播功能的小程序，用到了环信IM集成功能，由于我搜了下目前用环信做小程序的的确是少之又少，而且环信官方说从2月份不再更新代码（具体原因我也没问，可能本身微信就是一款聊天工具所以用处不大）

我们产品需要用到聊天室功能，之前做H5端登录完成之后加入聊天室即可：

 WebIM.conn.open(options);
 WebIM.conn.joinChatRoom(option1);

同样方法在小程序上不行，一直报错：

Cannot read property "sendIQ" of undefined

百度了一下，说加入聊天室要放在登录成功后的回调里，于是查看它的源码connection.js发现:

connection.prototype.open = function (options) {


    var pass = _validCheck(options, this);

    if (!pass) {
        return;
    }
    var conn = this;

    if (conn.isOpening() || conn.isOpened()) {
        return;
    }

    if (options.accessToken) {
        options.access_token = options.accessToken;
        _login(options, conn);
    } else {
       //登录成功的回调函数
        var suc = function (data, xhr, myName) {
            conn.context.status = _code.STATUS_DOLOGIN_IM;
            conn.context.restTokenData = data;
            if (data.statusCode != "404" && data.statusCode != "400") {
                wx.showToast({
                    title: "登录成功",
                    icon: "none",
                    duration: 4000
                });
            }
            //回调成功后执行这个方法
            _login(data.data, conn);
           
        };
        
        var options = {
            url: apiUrl + "/" + orgName + "/" + appName + "/token",
            data: loginfo,
             success: suc || _utils.emptyfn,
            error: error || _utils.emptyfn
        };
        _utils.ajax(options);
    }

登录成功有一个内部回调，回调里面调用了一个 _login(data.data, conn)的方法：

//具体里面执行什么去源代码查看，我就不贴代码了
var _login = function (options, conn) {
    
    var callback = function (status, msg) {
      _loginCallback(status, msg, conn);
    };


};

执行完login方法有一个_loginCallback回调：

var _loginCallback = function (status, msg, conn) {
    var conflict, error;
    //console.log("_loginCallback 1", Strophe.Status, status, msg)
    if (msg === "conflict") {
        conflict = true;
    }
    console.log(status)
    if (status == Strophe.Status.CONNFAIL) {
     
    } else if (status == Strophe.Status.ATTACHED || status == Strophe.Status.CONNECTED) {
      //登录成功
       
    } else if (status == Strophe.Status.DISCONNECTING) {
  
    } else if (status == Strophe.Status.DISCONNECTED) {
      
    } else if (status == Strophe.Status.AUTHFAIL) {
     
    } else if (status == Strophe.Status.ERROR) {

    }
    conn.context.status_now = status;
};

通过断点发现当执行到 else if (status == Strophe.Status.ATTACHED || status == Strophe.Status.CONNECTED)时，登录成功.所以需要把加入聊天室的回调需要放在这个判断里面,我的具体做法如下：

//项目中封装一个加入聊天室函数
 joinRoom: function () {
    var option1 = {};
    var option2 = {};
    //加入聊天室
    WebIM.conn.joinChatRoom(option1);
    WebIM.conn.joinChatRoom(option2);
  }；
   //在环信登录函数中添加一个自己的回调：
    var options = {
      apiUrl: WebIM.config.apiURL,
      user: userId + "",
      pwd: userId + "",
      grant_type: "password",
      appKey: WebIM.config.appkey,
      //自己添加的回调函数
      callBack:function(){
      //调用加入聊天室
        that.joinRoom();
      }
    };
    WebIM.conn.open(options);
    

修改环信connection.js代码：

//登录代码
connection.prototype.open = function (options) {

        var suc = function (data, xhr, myName) {
            //callBack传入加入聊天室回调
            _login(data.data, conn, options.callBack);
        };
        var options = {
            url: apiUrl + "/" + orgName + "/" + appName + "/token",
            data: loginfo,
             success: suc || _utils.emptyfn,
             //添加加入聊天室的回调函数
             callBack: options.callBack,
            error: error || _utils.emptyfn
        };
    }
};
//_login代码
var _login = function (options, conn, callBack) {
     
    var callback = function (status, msg) {
    //把加入聊天室函数传给_login回调函数
      _loginCallback(status, msg, conn, callBack);
    };
};
//_loginCallback代码
var _loginCallback = function (status, msg, conn,callBack) {
    var conflict, error;
    //console.log("_loginCallback 1", Strophe.Status, status, msg)
    if (msg === "conflict") {
        conflict = true;
    }
    console.log(status)
    if (status == Strophe.Status.CONNFAIL) {
     
    } else if (status == Strophe.Status.ATTACHED || status == Strophe.Status.CONNECTED) {
      //登录成功执行加入聊天室
       callBack();
    } else if (status == Strophe.Status.DISCONNECTING) {
  
    } else if (status == Strophe.Status.DISCONNECTED) {
      
    } else if (status == Strophe.Status.AUTHFAIL) {
     
    } else if (status == Strophe.Status.ERROR) {

    }
    conn.context.status_now = status;
};

具体思路就是这样，由于环信小程序代码有很多坑，所以遇到问题多看看源码，有些功能就需要自己去修改代码，这是环信工单回答我的问题：