微信内部浏览器私有接口 - WeixinJSBridge介绍

 

 

申请达人，去除赞助商链接

微信网页进入，右上角有三个小点，没错，我们用到的就是它！我们只要通过将小点列表下的按钮进行自定义，就可以随心所欲的分享我们自己的内容了。

 注意：（WeixinJSBridge只能在微信内打开的网页有效）

按钮一之------发送给好友

1. function sendMessage(){
2.  
3. WeixinJSBridge.on('menu:share:appmessage',function(argv){ alert("发送给好友");});
4.  
5. }

这样，只要在某处调用 sendMessage  函数就可以改变发送好友的按钮响应了，再点击，便会弹出“发送给好友字符串”，是不是很简单。

 

分享函数

1. WeixinJSBridge.invoke('sendAppMessage',{
2. "appid":"",//appid 设置空就好了。
3. "img_url": imgUrl,//分享时所带的图片路径
4. "img_width":"120",//图片宽度
5. "img_height":"120",//图片高度
6. "link":url,//分享附带链接地址
7. "desc":"我是一个介绍",//分享内容介绍
8. "title":"标题，再简单不过了。"
9. },function(res){/*** 回调函数，最好设置为空 ***/});

注意，如果将这个微信私有函数单独拿出来调用，道理上是讲的通，但是！第一次打开页面直接调用它的话，无论如何是没有任何反映的，必须要手动，点一 下右上角分享给好友按钮，待弹出一次通讯录之后，返回来在直接使用，就没有任何问题，似乎内部初始化什么东西一样。所以建议直接嵌入到上面那个 绑定方法中。

如下：

1. function sendMessage(){
2. WeixinJSBridge.on('menu:share:appmessage',function(argv){
3. WeixinJSBridge.invoke('sendAppMessage',{
4.  
5. "appid":"",//appid 设置空就好了。
6. "img_url": imgUrl,//分享时所带的图片路径
7. "img_width":"120",//图片宽度
8. "img_height":"120",//图片高度
9. "link":url,//分享附带链接地址
10. "desc":"我是一个介绍",//分享内容介绍
11. "title":"标题，再简单不过了。"
12. },function(res){/*** 回调函数，最好设置为空 ***/
13.  
14. });
15.  
16. });
17. }

这样，你在点击发送给好友按钮，就可以直接弹出通讯录选择 ‘单个’ 好友进行分享。

同理,分享到朋友圈也是调用 invoke 私有函数，只是按钮绑定名称不同而已。

1. function sendMessage(){
2.  
3.  
4. ......//此处省略发送给好友代码
5.  
6.  
7. WeixinJSBridge.on('menu:share:timeline',function(argv){
8.  
9. WeixinJSBridge.invoke('shareTimeline',{
10.  
11. "appid":"",//appid 设置空就好了。
12. "img_url": imgUrl,//分享时所带的图片路径
13. "img_width":"120",//图片宽度
14. "img_height":"120",//图片高度
15. "link":url,//分享附带链接地址
16. "desc":"我是一个介绍",//分享内容介绍
17. "title":"标题，再简单不过了。"
18. },function(res){/*** 回调函数，最好设置为空 ***/});
19.  
20. });
21.  
22. });
23.  
24. }

注意，on绑定的是 “menu:share:timeline” 不是 "menu:share:appmessage"。invoke里面也是。

还一个微博分享，我没试过，不知道有没有用，想玩的试试，一切分享都是调用当前微信帐号分享。

1. WeixinJSBridge.on('menu:share:weibo',function(argv){
2. WeixinJSBridge.invoke('shareWeibo',{
3. "content":dataForWeixin.title+' '+dataForWeixin.url,
4. "url":dataForWeixin.url
5. },function(res){});
6. });

如果微信浏览器内部尚未初始化，所有的接口都会是undefined。为了避免进去马上就调用出错，获取微信初始化完成响应事件，初始化完成调用sendMessage进行绑定。

如下：

1. if(document.addEventListener){
2. document.addEventListener('WeixinJSBridgeReady',sendMessage,false);}elseif(document.attachEvent){
3. document.attachEvent('WeixinJSBridgeReady',sendMessage); document.attachEvent('onWeixinJSBridgeReady',sendMessage);}

下面还有几个小功能： 

1. WeixinJSBridge.call('hideToolbar');//隐藏右下面工具栏
2.  
3. WeixinJSBridge.call('showToolbar');//显示右下面工具栏
4.  
5. WeixinJSBridge.call('hideOptionMenu');//隐藏右上角三个点按钮。
6.  
7. WeixinJSBridge.call('showOptionMenu');//显示右上角三个点按钮。
8.  

我是一个菜鸟，写完了，写的不好，请大家多多包含！

相关代码演示：http://www.gbtags.com/gb/share/2949.htm