WeChat built-in browser private interface WeixinJSBridge introduction _ javascript skills

This article mainly introduces the built-in private interface WeixinJSBridge of the browser. This article describes the functions such as sending to friends, sharing functions, hiding the toolbar, and hiding the three click buttons. For more information, see

Webpage entry. There are three dots in the upper right corner. that's right. we use it! You only need to customize the buttons in the small list to share your content as you like.

Note: (WeixinJSBridge is valid only for webpages that can be opened inside)

Button 1 ------ send to friend

The code is as follows:

Function sendMessage (){

WeixinJSBridge. on ('menu: share: appmessage', function (argv) {alert ("Send to friend ");});

}

In this way, if you call the sendMessage function somewhere, you can change the response of the send friend button. Then, click it, and the "send to friend string" dialog box will pop up. isn't it easy.

Sharing functions

The code is as follows:

WeixinJSBridge. invoke ('sendappmessage ',{
"Appid": "", // Set appid to null.
"Img_url": imgUrl, // path of the image to be shared
"Img_width": "120", // image width
"Img_height": "120", // Image height
"Link": url, // link to share
"Desc": "I am an introduction", // share content
"Title": "title. it's easy. "
}, Function (res) {/*** callback function, preferably set to null ***/});

Note: If you call this private function separately, it is reasonable,! If you open the page for the first time and call it directly, you must manually click the Share to friend button in the upper right corner. after an address book pops up, it will be directly used, there is no problem. it seems that the same thing is initialized internally. Therefore, we recommend that you embed it directly into the binding method above.

As follows:

The code is as follows:

Function sendMessage (){
WeixinJSBridge. on ('menu: share: appmessage', function (argv ){

WeixinJSBridge. invoke ('sendappmessage ',{

"Appid": "", // Set appid to null.
"Img_url": imgUrl, // path of the image to be shared
"Img_width": "120", // image width
"Img_height": "120", // Image height
"Link": url, // link to share
"Desc": "I am an introduction", // share content
"Title": "title. it's easy. "
}, Function (res) {/*** callback function, preferably set to null ***/

});

});
}

In this way, you can click the send to friend button to bring up the address book and select a single friend for sharing.

Similarly, sharing to a circle of friends also calls the invoke private function, but the button binding name is different.

The code is as follows:

Function sendMessage (){



...... // The code sent to a friend is omitted here



WeixinJSBridge. on ('menu: share: timeline ', function (argv ){

WeixinJSBridge. invoke ('effectimeline ',{

"Appid": "", // Set appid to null.
"Img_url": imgUrl, // path of the image to be shared
"Img_width": "120", // image width
"Img_height": "120", // Image height
"Link": url, // link to share
"Desc": "I am an introduction", // share content
"Title": "title. it's easy. "
}, Function (res) {/*** callback function, preferably set to null ***/});

});

});

}

Note: on is bound with "menu: share: timeline" instead of "menu: share: appmessage ". The same is true for invoke.

I have not tried another Weibo sharing. I don't know if it is useless. I want to try it. all sharing is to call the current account to share it.

The code is as follows:

WeixinJSBridge. on ('menu: share: Weaver ', function (argv ){
WeixinJSBridge. invoke ('invalid WEIO ',{
"Content": dataForWeixin. title + ''+ dataForWeixin. url,
"Url": dataForWeixin. url
}, Function (res ){});
});

If the browser has not been initialized, all interfaces will be undefined. In order to avoid calling errors immediately, get the initialization completion response event, and call sendMessage after initialization is complete for binding.

As follows:

The code is as follows:

If (document. addEventListener ){
Document. addEventListener ('weixinjsbridgeready', sendMessage, false);} else if (document. attachEvent ){
Document. attachEvent ('weixinjsbridgeready', sendMessage); document. attachEvent ('onweixinjsbridgeready', sendMessage );}

The following are some other functions:

The code is as follows:

WeixinJSBridge. call ('hidetoolbar'); // hide the toolbar in the lower right corner.

WeixinJSBridge. call ('showtoolbar'); // display the toolbar in the lower right corner.

WeixinJSBridge. call ('hideoptionmenu '); // hide the three dots in the upper-right corner.

WeixinJSBridge. call ('showoptionmenu '); // three dots in the upper right corner are displayed.

I am a Cainiao. I have finished writing and it is not easy to write. please include it more!

Complete test code (open ):

The code is as follows:

Interface Test

Script
Function sendMessage (){
WeixinJSBridge. on ('menu: share: appmessage', function (argv ){
WeixinJSBridge. invoke ('sendappmessage ',{

"Appid": "", // Set appid to null.
"Img_url": "", // path of the image to be shared
"Img_width": "120", // image width
"Img_height": "120", // Image height
"Link": "http://www.jb51.net", // share link
"Desc": "geek tag-http://www.jb51.net", // share content
"Title": "Discovering geeks tags-creating the best geeks knowledge sharing platform"
}, Function (res) {/*** callback function, preferably set to null ***/

});
});

WeixinJSBridge. on ('menu: share: timeline ', function (argv ){

WeixinJSBridge. invoke ('effectimeline ',{

"Appid": "", // Set appid to null.
"Img_url": "", // path of the image to be shared
"Img_width": "120", // image width
"Img_height": "120", // Image height
"Link": "http://www.jb51.net", // share link
"Desc": "geek tag-http://www.jb51.net", // share content
"Title": "Discovering geeks tags-creating the best geeks knowledge sharing platform"
}, Function (res) {/*** callback function, preferably set to null ***/
});

});

Alert ("call successful! Now you can click the button in the upper right corner to share it with friends or friends! ");

}

Function hideMenu (){
WeixinJSBridge. call ('hideoptionmenu ');
}

Function showMenu (){
WeixinJSBridge. call ('showoptionmenu ');
}

Function hideTool (){
WeixinJSBridge. call ('hidetoolbar ');
}

Function showTool (){
WeixinJSBridge. call ('showtoolbar ');
}

If (document. addEventListener ){
Document. addEventListener ('weixinjsbridgeready', sendMessage, false );
} Else if (document. attachEvent ){
Document. attachEvent ('weixinjsbridgeready', sendMessage );
Document. attachEvent ('onweixinjsbridgeready', sendMessage );
}

// Determine whether the webpage is called in
Var ua = navigator. userAgent. toLowerCase ();
If (ua. match (/MicroMessenger/I) = "micromessenger "){
} Else {
Alert ("the call failed. scan the following QR code to open the webpage! ");
}

Script

Click Share in the upper right corner
Hide three dots in the upper-right corner


Show three dots in the upper-right corner


Hide the following guide


Show the following guide