微信分享 使用weixin js sdk 兼容 旧版本 分类: 微信分享 微信 微信js sdk 2015-01-28 13:09 550人阅读 评论(3) 收藏

首先头部使用微信js sdk php版本demo上头部php配置appid和appsecret那几行


js部分,除了调用基本js库,weixin js sdk库,自己另外封装了一个core.js


其中判断weixin版本使用的是之前在

http://blog.csdn.net/snow_finland/article/details/43227643

这个当中提到的封装的函数


function get_broswer_info(){
	var ua = navigator.userAgent.toLowerCase();
	if(ua.match(/weibo/i) == "weibo"){
		return 1;
	}else if(ua.indexOf('qq/')!= -1){
		return 2;
	}else if(ua.match(/MicroMessenger/i)=="micromessenger"){
		var v_weixin = ua.split('micromessenger')[1];
		v_weixin = v_weixin.substring(1,6);
		v_weixin = v_weixin.split(' ')[0];
		if(v_weixin.split('.').length == 2){
			v_weixin = v_weixin + '.0';
		}
		if(v_weixin < '6.0.2'){
			return 3;
		}else{
			return 4;
		}
	}else{
		return 0;
	}
}

function reset_weixin_share(){
	wx.ready(function () {	
		wx.onMenuShareTimeline({ // 分享到朋友圈
			title: window.ShareData.TimelineTitle, // 分享标题
			link: window.ShareData.link, // 分享链接
			imgUrl: window.ShareData.img, // 分享图标
			success: function () { 
				// 用户确认分享后执行的回调函数
				window.ShareData.TimelineSuccess();
			},
			cancel: function () { 
				// 用户取消分享后执行的回调函数
			}
		});
		
		wx.onMenuShareAppMessage({ // 分享给朋友
			title: window.ShareData.FriendTitle, // 分享标题
			desc: window.ShareData.FriendDesc, // 分享描述
			link: window.ShareData.link, // 分享链接
			imgUrl: window.ShareData.img, // 分享图标
			type: '', // 分享类型,music、video或link,不填默认为link
			dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
			success: function () { 
				// 用户确认分享后执行的回调函数
				window.ShareData.NormalSuccess();
			},
			cancel: function () { 
				// 用户取消分享后执行的回调函数
			}
		});
		
		wx.onMenuShareQQ({ // 分享到QQ
			title: window.ShareData.QQTitle, // 分享标题
			desc: window.ShareData.QQDesc, // 分享描述
			link: window.ShareData.link, // 分享链接
			imgUrl: window.ShareData.img, // 分享图标
			success: function () { 
			   // 用户确认分享后执行的回调函数
			   window.ShareData.NormalSuccess();
			},
			cancel: function () { 
			   // 用户取消分享后执行的回调函数
			}
		});
		
		wx.onMenuShareWeibo({ // 分享到腾讯微博
			title: window.ShareData.WeiboTitle, // 分享标题
			desc: window.ShareData.WeiboDesc, // 分享描述
			link: window.ShareData.link, // 分享链接
			imgUrl: window.ShareData.img, // 分享图标
			success: function () { 
			   // 用户确认分享后执行的回调函数
			   window.ShareData.NormalSuccess();
			},
			cancel: function () { 
				// 用户取消分享后执行的回调函数
			}
		});
		
		// wx.hideOptionMenu(); // 隐藏右上角菜单接口
		
		wx.showOptionMenu(); // 显示右上角菜单接口
	});
}

function set_weixin_share(){
	if(broswer == 3){
		function onBridgeReady(){
			WeixinJSBridge.call('showOptionMenu');  // 显示右上角菜单
			// WeixinJSBridge.call('hideOptionMenu'); // 隐藏右上角菜单
		}

		if (typeof WeixinJSBridge == "undefined"){
			if( document.addEventListener ){
				document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
			}else if (document.attachEvent){
				document.attachEvent('WeixinJSBridgeReady', onBridgeReady); 
				document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
			}
		}else{
			onBridgeReady();
		}

		document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
			
			WeixinJSBridge.on('menu:share:appmessage', function(argv) { // 分享给朋友
				WeixinJSBridge.invoke('sendAppMessage', {
					"img_url": window.ShareData.img,
					"link": window.ShareData.link,
					"desc": window.ShareData.FriendDesc,
					"title": window.ShareData.FriendTitle
				}, function(res) {
					window.ShareData.NormalSuccess();
				})
			});

			WeixinJSBridge.on('menu:share:timeline', function(argv) { // 分享到朋友圈
				WeixinJSBridge.invoke('shareTimeline', {
					"img_url": window.ShareData.img,
					"link": window.ShareData.link,
					"desc": window.ShareData.TimelineTitle,
					"title": window.ShareData.TimelineTitle
				}, function(res) {	 
					window.ShareData.TimelineSuccess();
				});
			});
			
			WeixinJSBridge.on('menu:share:weibo', function(argv) { // 分享到腾讯微博
				WeixinJSBridge.invoke('shareWeibo', {
					"content": window.ShareData.WeiboDesc,
					"url": window.ShareData.link
				}, function(res) {
					window.ShareData.NormalSuccess();
				});
			});
		}, false);
	}else if(broswer == 4){
		wx.config({
			debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
			appId: config_info.appId,// 必填,公众号的唯一标识
			timestamp: config_info.timestamp,// 必填,生成签名的时间戳
			nonceStr: config_info.nonceStr,// 必填,生成签名的随机串
			signature: config_info.signature,// 必填,签名,见附录1
			jsApiList: [
				// 必填,需要使用的JS接口列表,所有JS接口列表见附录2
				// 所有要调用的 API 都要加到这个列表中
				'onMenuShareTimeline',
				'onMenuShareAppMessage',
				'onMenuShareQQ',
				'onMenuShareWeibo',
				
				'hideOptionMenu',
				'showOptionMenu'
			]
		});
		
		reset_weixin_share();
	}
}

set_weixin_share是兼容新版和旧版本的微信分享,

旧版本(微信说是被修复的漏洞)中,会根据window.ShareData配置的值动态变化,所以只需要调用一次即可

新版本中config的配置只需要一次,而动态变化的话,需要反复调用,所以ready的方法单独封装了,方便反复调用


在头部使用微信js sdk php版本demo上头部php配置的php(html)文件中的js部分


var broswer = get_broswer_info();

var config_info = {
	appId: '<?php echo $signPackage["appId"];?>',// 必填,公众号的唯一标识
	timestamp: <?php echo $signPackage["timestamp"];?>,// 必填,生成签名的时间戳
	nonceStr: '<?php echo $signPackage["nonceStr"];?>',// 必填,生成签名的随机串
	signature: '<?php echo $signPackage["signature"];?>'// 必填,签名,见附录1
};

window.ShareData = {
	link : , // 链接地址
	img : , // 分享图标
	TimelineTitle : '这里是朋友圈标题', // 朋友圈标题
	FriendTitle : '这里是朋友标题', // 朋友标题
	FriendDesc : '朋友描述在这里', // 朋友描述
	QQTitle : 'qq标题', // QQ标题
	QQDesc : 'qq描述在这里', // QQ描述
	WeiboTitle : 'weibo标题', // Weibo标题
	WeiboDesc : '这是weibo描述', // Weibo描述
	TimelineSuccess : function(){ // 朋友圈分享成功
		alert('朋友圈分享成功!');
	},
	NormalSuccess : function(){ // 其它分享成功
		alert('其它分享成功!');
	}
};

$('#changeShare').bind({
	'touchstart' : function(){ // 这里是模拟动态改变分享内容的部分
		var rand_num = Math.floor(Math.random() * ( 1000 + 1));
		window.ShareData.TimelineTitle = '这里是朋友圈'+rand_num+'标题'; // 朋友圈标题
		window.ShareData.FriendTitle = '这里是朋友'+rand_num+'标题'; // 朋友标题
		window.ShareData.FriendDesc = '朋友描述'+rand_num+'在这里'; // 朋友描述
		window.ShareData.QQTitle = 'qq'+rand_num+'标题'; // QQ标题
		window.ShareData.QQDesc = 'qq'+rand_num+'描述在这里'; // QQ描述
		window.ShareData.WeiboTitle = 'weibo'+rand_num+'标题'; // Weibo标题
		window.ShareData.WeiboDesc = '这是weibo'+rand_num+'描述'; // Weibo描述
		
		if(broswer == 4){
			reset_weixin_share();
		}
	}
});

set_weixin_share();


版权声明:本文为博主原创文章,未经博主允许不得转载。

posted @ 2015-01-28 13:09  snow_finland  阅读(229)  评论(0编辑  收藏  举报