Shulou(Shulou.com)06/03 Report--

How to use Mini Program to integrate Huanxin IM, for this problem, this article introduces the corresponding analysis and solution in detail, hoping to help more partners who want to solve this problem to find a more simple and feasible way.

Mini Program integrated Huanxin IM

Recently, I am doing a Mini Program with voice live broadcast function, using the Huanxin IM integration function, because I searched that there are very few people using Huanxin to do Mini Program at present, and the Huanxin official said that the code will not be updated from February (I did not ask the specific reason, maybe Wechat itself is a chat tool, so it is not very useful)

We need to use the chat room function for our products. You can join the chat room after logging in on H5:

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

The same method doesn't work on Mini Program, reporting errors all the time:

Cannot read property 'sendIQ' of undefined

Baidu said for a moment that joining a chat room should be placed in the callback after a successful login, then checked its source code connection.js and found that:

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 {/ / callback function 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: 'login successful', icon: 'none', duration: 4000}) } / / execute this method _ login (data.data, conn) after the callback is successful;} 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, in which a _ login (data.data, conn) method is called:

/ / specific execution to check the source code, I will not post the code 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) {/ / login succeeded} 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 }

Through the breakpoint, it is found that when executing to 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 included in this judgment. My specific approach is as follows:

/ / encapsulate a chat room function joinRoom in the project: function () {var option1 = {}; var option2 = {}; / / join chat room WebIM.conn.joinChatRoom (option1); WebIM.conn.joinChatRoom (option2);} / / add your own callback to the Huanxin login function: var options = {apiUrl: WebIM.config.apiURL, user: userId +', pwd: userId +'', grant_type: "password", appKey: WebIM.config.appkey, / / the callback function callBack:function () {/ / you add to join the chat room () }}; WebIM.conn.open (options)

Modify the connection.js code of Huanxin:

/ / login code connection.prototype.open = function (options) {var suc = function (data, xhr, myName) {/ / callBack is passed to join the chat room callback _ login (data.data, conn, options.callBack);} Var options = {url: apiUrl +'/'+ orgName +'/'+ appName +'/ token', data: loginfo, success: suc | | _ utils.emptyfn, / / add callback function callBack: options.callBack, error: error | | _ utils.emptyfn};}} / / _ login code var _ login = function (options, conn,callBack) {var callback = function (status, msg) {/ / pass the join chat room function to the _ login callback function _ loginCallback (status, msg, conn,callBack);};}; / _ loginCallback code var _ loginCallback = function (status, msg, conn,callBack) {var conflict, error / / console.log ('_ loginCallback 1trades, 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) {/ / Log in to join chat room 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 like this, as there are many holes in the Mini Program code, so if you encounter problems, look at the source code, and some functions need to be modified by yourself.

This is the end of the answer to the question about how to use Mini Program to integrate Huanxin IM. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel for more related knowledge.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.