小程序集成环信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; };

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