Recently I am making a small program with live voice function, using the Huanxin IM integration function, because I searched Currently, there are indeed very few people using Huanxin to make small programs, and Huanxin officially said that they will no longer update the code from February (I didn’t ask for the specific reason, maybe WeChat itself is a chat tool, so it is not very useful)
Our product needs to use the chat room function. You can join the chat room after completing the H5 client login before:
?WebIM.conn.open(options); ?WebIM.conn.joinChatRoom(option1);
The same method does not work on the mini program, and an error keeps reporting:
Cannot?read?property?'sendIQ'?of?undefined
Baidu looked at it and said that joining the chat room should be placed in the callback after successful login, so I checked its source code connection.js and found:
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?{ ???????//登錄成功的回調函數(shù) ????????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 ????????????????}); ????????????} ????????????//回調成功后執(zhí)行這個方法 ????????????_login(data.data,?conn); ??????????? ????????}; ???????? ????????var?options?=?{ ????????????url:?apiUrl?+?'/'?+?orgName?+?'/'?+?appName?+?'/token', ????????????data:?loginfo, ?????????????success:?suc?||?_utils.emptyfn, ????????????error:?error?||?_utils.emptyfn ????????}; ????????_utils.ajax(options); ????}
There is an internal callback for successful login, and a _login is called in the callback (data.data, conn) method:
//具體里面執(zhí)行什么去源代碼查看,我就不貼代碼了 var?_login?=?function?(options,?conn)?{ ???? ????var?callback?=?function?(status,?msg)?{ ??????_loginCallback(status,?msg,?conn); ????}; };
After executing the login method, there is a _loginCallback callback:
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; };
Discover through breakpoints when the execution reaches else if (status == Strophe.Status.ATTACHED || status == Strophe.Status.CONNECTED), the login is successful. Therefore, the callback for joining the chat room needs to be placed in this judgment. My specific method is as follows:
//項目中封裝一個加入聊天室函數(shù) ?joinRoom:?function?()?{ ????var?option1?=?{}; ????var?option2?=?{}; ????//加入聊天室 ????WebIM.conn.joinChatRoom(option1); ????WebIM.conn.joinChatRoom(option2); ??}; ???//在環(huán)信登錄函數(shù)中添加一個自己的回調: ????var?options?=?{ ??????apiUrl:?WebIM.config.apiURL, ??????user:?userId?+?'', ??????pwd:?userId?+?'', ??????grant_type:?"password", ??????appKey:?WebIM.config.appkey, ??????//自己添加的回調函數(shù) ??????callBack:function(){ ??????//調用加入聊天室 ????????that.joinRoom(); ??????} ????}; ????WebIM.conn.open(options);
Modify the Huanxin connection.js code:
//登錄代碼 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, ?????????????//添加加入聊天室的回調函數(shù) ?????????????callBack:?options.callBack, ????????????error:?error?||?_utils.emptyfn ????????}; ????} }; //_login代碼 var?_login?=?function?(options,?conn,?callBack)?{ ????? ????var?callback?=?function?(status,?msg)?{ ????//把加入聊天室函數(shù)傳給_login回調函數(shù) ??????_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)?{ ??????//登錄成功執(zhí)行加入聊天室 ???????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; };
The specific idea is this. Since the Huanxin applet code has many pitfalls, if you encounter problems, look at the source code. For some functions, you need to modify the code yourself. This is the environmental information work order that answers my question: