有时,我们希望一个链接通过微信分享的时候,能自定义标题或者图片啥的,把方法总结下来,以后可以用。
其实在微信加载页面成功之后,会有一个WeixinJSBridgeReady事件和一个全局变量WeixinJSBridge,通过操作这两个东西,可以实现自定的分享操作。
一、分享操作
1、发送给好友
通过监控menu:share:appmessage
实现
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
var config = {
// 如果是正常的网页分享,则不要添加。否则会出现未审核应用
appid: ‘APP_ID’, // 公共账号ID?
img_url: ‘http://IMG_URL’,
img_width: ‘IMG_WIDTH’, // 可不设
img_height: ‘IMG_HEIGHT’, // 可不设
link: location.href,
desc: ‘DESCRIPTION’,
title: ‘TITLE’
};
// 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
document.addEventListener(‘WeixinJSBridgeReady’, function() {
var WJ = WeixinJSBridge;
// 发送给好友
WJ.on(‘menu:share:appmessage’, function() {
WJ.invoke(‘sendAppMessage’, config, function(res) {
if(res.err_msg != ‘send_app_msg:cancel’){
alert(‘分享失败’);
} else {
alert(‘分享成功’);
}
});
});
});
|
2、发送到朋友圈
监控menu:share:timeline
事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
document.addEventListener(‘WeixinJSBridgeReady’, function() {
var WJ = WeixinJSBridge;
// 发送到朋友圈
WJ.on(‘menu:share:timeline’, function() {
WJ.invoke(‘sendAppMessage’, config, function(res) {
if(res.err_msg != ‘send_app_msg:cancel’){
alert(‘分享失败’);
} else {
alert(‘分享成功’);
}
});
});
});
|
3、发送到QQ好友
监控menu:share:qq
事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
document.addEventListener(‘WeixinJSBridgeReady’, function() {
var WJ = WeixinJSBridge;
// 发送给QQ好友
WJ.on(‘menu:share:qq’, function() {
WJ.invoke(‘sendAppMessage’, config, function(res) {
if(res.err_msg != ‘send_app_msg:cancel’){
alert(‘分享失败’);
} else {
alert(‘分享成功’);
}
});
});
});
|
二、特殊操作
1、隐藏微信中网页右上角按钮
某些时候,在有需要时(如不需要用户分享某个页面),可在网页中通过JavaScript代码隐藏网页右上角按钮。
1
2
3
4
5
6
|
document.addEventListener(‘WeixinJSBridgeReady’, function() {
// 隐藏按钮,对应的展示参数是:showOptionMenu
WeixinJSBridge.call(‘hideOptionMenu’);
});
|
2、隐藏微信中网页底部导航栏
某些时候,在有需要时(如认为用户在该页面不会用到浏览器前进后退功能),可在网页中通过JavaScript代码隐藏网页底部导航栏。
1
2
3
4
5
6
|
document.addEventListener(‘WeixinJSBridgeReady’, function() {
// 隐藏导航栏,对应的展示参数是:showToolbar
WeixinJSBridge.call(‘hideToolbar’);
});
|
3、网页获取用户网络状态
这个接口可以让我们在网页中使用JavaScript代码调用来获取网络状态,可以方便我们根据用户的网络状态来提供不同质量的服务。
1
2
3
4
5
6
7
8
9
10
11
|
document.addEventListener(‘WeixinJSBridgeReady’, function() {
var connection = WeixinJSBridge.invoke(‘getNetworkType’,{}, function(e){
WeixinJSBridge.log(e.err_msg);
});
});
// connection.network_type:wifi wifi网络
// connection.network_type:edge 非wifi,包含3G/2G
// connection.network_type:fail 网络断开连接
// connection.network_type:wwan(2g或者3g)
|
注:以上内容都是2013年的内容,微信JS有更多的新功能,建议查看http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html