非出网教程:是一个免费提供流行杀毒软件教程、在线学习分享的学习平台!

微信内置浏览器私有接口WeixinJSBridge说一下_Javascript指南

微信(WeChat)是腾讯公司于2011年1月21日推出的一个为智能终端提供即时通讯服务的免费应用程序,由张小龙所带领的腾讯广州研发中心产品团队打造 。微信支持跨通信运营商、跨操作系统平台通过网络快速发送免费(需消耗少量网络流量)语音短信、视频、图片和文字,同时,也可以使用通过共享流媒体内容的资料和基于位置的社交插件“摇一摇”、“漂流瓶”、“朋友圈”、”公众平台“、”语音记事本“等服务插件。
这篇文章主要介绍了微信内置浏览器私有接口WeixinJSBridge介绍,本文讲解了发送给好友、分享函数、隐藏工具栏、隐藏三个点按钮等功能,需要的朋友可以参考下
 
 

微信内置浏览器私有接口WeixinJSBridge说一下_Javascript指南

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

注意:(WeixinJSBridge只能在微信内打开的网页有效)

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

 代码如下:

function sendMessage(){

WeixinJSBridge.on('menu:share:appmessage', function(argv){ alert("发送给好友"); });

}

 

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

分享函数

 

复制代码 代码如下:

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

 

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

如下:

 

 代码如下:

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

WeixinJSBridge.invoke('sendAppMessage',{

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

});

});
}

 


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

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

 

 代码如下:

function sendMessage(){



......//此处省略发送给好友代码



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

WeixinJSBridge.invoke('shareTimeline',{

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

});

});

}

 

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

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

 

 代码如下:

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

 


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

如下:

代码如下:

if(document.addEventListener){
document.addEventListener('WeixinJSBridgeReady', sendMessage, false); }else if(document.attachEvent){
document.attachEvent('WeixinJSBridgeReady' , sendMessage); document.attachEvent('onWeixinJSBridgeReady' , sendMessage); }

下面还有几个小功能:

 

 

 代码如下:

WeixinJSBridge.call('hideToolbar'); //隐藏右下面工具栏

WeixinJSBridge.call('showToolbar'); //显示右下面工具栏

WeixinJSBridge.call('hideOptionMenu'); //隐藏右上角三个点按钮。

WeixinJSBridge.call('showOptionMenu'); //显示右上角三个点按钮。

 


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


完整测试代码(用微信打开):

 

 代码如下:

 

<!docType html>
<html>
<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />

<title>微信接口测试</title>

<script>
function sendMessage(){
WeixinJSBridge.on('menu:share:appmessage', function(argv){
WeixinJSBridge.invoke('sendAppMessage',{

"appid":"", //appid 设置空就好了。
"img_url":"", //分享时所带的图片路径
"img_width":"120", //图片宽度
"img_height":"120", //图片高度
"link":"http://www.3lian.net", //分享附带链接地址
"desc":"极客标签--http://www.jb51.net", //分享内容介绍
"title":"发现 极客标签 - 做最棒的极客知识分享平台"
}, function(res){/*** 回调函数,最好设置为空 ***/

});
});

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

WeixinJSBridge.invoke('shareTimeline',{

"appid":"", //appid 设置空就好了。
"img_url":"", //分享时所带的图片路径
"img_width":"120", //图片宽度
"img_height":"120", //图片高度
"link":"http://www.3lian.net", //分享附带链接地址
"desc":"极客标签--http://www.jb51.net", //分享内容介绍
"title":"发现 极客标签 - 做最棒的极客知识分享平台"
}, function(res){/*** 回调函数,最好设置为空 ***/
});

});


alert("调用成功!现在可以通过右上角按钮分享给朋友或者朋友圈!");

}

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);
}

//判断网页是否在微信中被调用
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
} else {
alert("调用失败,请用微信扫一扫,扫描下面二维码打开网页!");
}

</script>

</head>

<body>
<center>
<h2>分享请点击右上角</h2>
<button onclick="hideMenu()" style="width:100px;height:100px;font-size:16px;">隐藏右上角三个点</button> <br /><br />
<button onclick="showMenu()" style="width:100px;height:100px;font-size:16px;">显示右上角三个点</button> <br /><br />
<button onclick="hideTool()" style="width:100px;height:100px;font-size:16px;">隐藏下面导条</button> <br /><br />
<button onclick="showTool()" style="width:100px;height:100px;font-size:16px;">显示下面导条</button> <br /><br />
</center>
</body>

</html>


微信支持多种语言,支持Wi-Fi无线局域网、2G,3G和4G移动数据网络,iOS版,Android版、Windows Phone版、Blackberry版、诺基亚S40版、S60V3和S60V5版



软件推荐:      



相关软件

2345安全卫士最新官方版

2345安全卫士官方版 | 45.34MB

2345安全卫士官方版

2345安全卫士是集电脑体检、木马查杀、垃圾清理、修复系统漏洞、系统加速、软件管理等功能为一体的电脑安全管理的软件.提供全方位检测,用户可以通过检测结果快速了解自己的电脑并且对电脑进行优化..

360杀毒软件官方正式版

360杀毒软件官方正式版 | 35.10MB

360杀毒软件官方正式版

360杀毒具有查杀率高、资源占用少、升级迅速等优点。零广告、零打扰、零胁迫,一键扫描,快速、全面地诊断系统安全状况和健康程度,并进行精准修复,带来安全、专业、有效、新颖的查杀防护体验...

360安全卫士最新版下载

360安全卫士最新版下载 | 50.3MB

360安全卫士最新版下载

360安全卫士是一款由奇虎360公司推出的功能强、效果好、受用户欢迎的安全杀毒软件。360安全卫士拥有查杀木马、清理插件、修复漏洞、电脑体检、电脑救援、保护隐私,电脑专家,清理垃圾,清理痕迹...

QQ电脑管家官方正式版

QQ电脑管家官方正式版 | 24.2MB

QQ电脑管家官方正式版

腾讯电脑管家(Tencent PC Manager/原名QQ电脑管家)是腾讯公司推出的免费安全软件。拥有云查杀木马,系统加速,漏洞修复,实时防护,网速保护,电脑诊所,健康小助手...

金山毒霸2022最新版下载

金山毒霸2022下载 | 37MB

金山毒霸2018最新版下载

金山毒霸融合了启发式搜索、代码分析、虚拟机查毒等技术。经业界证明成熟可靠的反病毒技术,以及丰富的经验,使其在查杀病毒种类、查杀病毒速度、未知病毒防治等多方面达到世界先进水平...

猎豹清理大师官方版下载

猎豹清理大师下载 | 47.4MB

猎豹清理大师官方版下载

猎豹清理大师(原金山清理大师)是由金山网络开发的智能手机应用。它可以清理智能手机上的应用缓存、残余程序文件、历史痕迹以及应用程序安装包...