微信分享jssdk实例

<?php
require_once "jssdk/jssdk.php";
$jssdk = new JSSDK("Yourkey", "YourSecret");
$signPackage = $jssdk->GetSignPackage();
?>
<!DOCTYPE html>
<html class="no-js" lang="en"><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>雅姿hydra水润保湿系列-手机瑞丽网</title>
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=1, user-scalable=no">

<link rel="stylesheet" href="css/swiper.min.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/ysldcss.css">
<script src="js/jquery-1.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
  /*
   * 注意:
   * 1. 所有的JS接口只能在公众号绑定的域名下调用,公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
   * 2. 如果发现在 Android 不能分享自定义内容,请到官网下载最新的包覆盖安装,Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
   * 3. 常见问题及完整 JS-SDK 文档地址:http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
   *
   * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决,如仍未能解决可通过以下渠道反馈:
   * 邮箱地址:weixin-open@qq.com
   * 邮件主题:【微信JS-SDK反馈】具体问题
   * 邮件内容说明:用简明的语言描述问题所在,并交代清楚遇到该问题的场景,可附上截屏图片,微信团队会尽快处理你的反馈。
   */
	wx.config({
	debug: false,
	appId: '<?php echo $signPackage["appId"];?>',
	timestamp: <?php echo $signPackage["timestamp"];?>,
	nonceStr: '<?php echo $signPackage["nonceStr"];?>',
	signature: '<?php echo $signPackage["signature"];?>',
	jsApiList: [
	  // 所有要调用的 API 都要加到这个列表中
		'checkJsApi',
		'onMenuShareTimeline',
		'onMenuShareAppMessage'
	]
	});
	
	//自定义内容
	var dataForWeixin = {
		title: '全新雅姿水润保湿系列',
		desc: '诺贝尔奖灵感启迪突破,倾灌肌肤内外臻纯活水',
		imgUrl: 'http://m.rayli.com.cn/mini/2015/artistry/images/share.jpg',
		link: 'http://m.rayli.com.cn/mini/2015/artistry/index.php'
	};
	
	wx.ready(function () {
		// 在这里调用 API
		wx.onMenuShareTimeline({
			title: dataForWeixin.title, // 分享标题
			link: dataForWeixin.link, // 分享链接
			imgUrl: dataForWeixin.imgUrl, // 分享图标
			success: function () { 
				// 用户确认分享后执行的回调函数
			},
			cancel: function () { 
				// 用户取消分享后执行的回调函数
			}
		});

		wx.onMenuShareAppMessage({
		title: dataForWeixin.title, // 分享标题
		desc: dataForWeixin.desc, // 分享描述
		link: dataForWeixin.link, // 分享链接
		imgUrl: dataForWeixin.imgUrl, // 分享图标
		type: '', // 分享类型,music、video或link,不填默认为link
		dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
		success: function () { 
			// 用户确认分享后执行的回调函数
		},
		cancel: function () { 
			// 用户取消分享后执行的回调函数
		}
	});
});
</script>
</head>
<body></body></html>

<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">微信6.0.2版本后,</span><span style="background-color: rgb(255, 255, 255); color: rgb(51, 51, 51); font-family: verdana, Arial, Helvetica, sans-serif; line-height: 25.200000762939453px;">分享的标题、描述、图片、链接地址失效</span>


临时解决方案:

标题:修改<title></title>中的内容
图片:在<body>最前面添加一个图片 \
<div style=”height:1px;overflow:hidden;”>
    <img src=”xxx” />
</div> 
微信分享的时候会去读取第一张200*200以上大小的图片作为分享的图片,
链接:链接地址
描述:暂时没有办法修改。

最终解决方案


  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在Vue2中接入微信公众号JSSDK,您需要按照以下步骤进行操作: 1. 在公众号后台配置JS接口安全域名,确保您的域名已经添加到了微信公众平台的安全域名列表中。 2. 安装使用`weixin-js-sdk`库,可以通过npm进行安装: ``` npm install weixin-js-sdk ``` 3. 在需要使用JSSDK的组件或页面中引入`weixin-js-sdk`库: ```javascript import wx from 'weixin-js-sdk'; ``` 4. 在组件或页面的`mounted`生命周期钩子函数中初始化JSSDK,并进行相关配置: ```javascript mounted() { this.initWeChatJSSDK(); }, methods: { initWeChatJSSDK() { // 异步请求后端接口获取微信配置信息 axios.get('/api/getWeChatConfig') .then(response => { const { appId, timestamp, nonceStr, signature } = response.data; wx.config({ debug: false, appId, timestamp, nonceStr, signature, jsApiList: ['chooseImage', 'scanQRCode'] // 需要使用的JSSDK接口 }); wx.ready(() => { // JSSDK配置成功后的回调函数 console.log('JSSDK配置成功'); }); wx.error((res) => { // JSSDK配置失败后的回调函数 console.error('JSSDK配置失败', res); }); }) .catch(error => { console.error('获取微信配置信息失败', error); }); } } ``` 5. 在需要使用JSSDK的地方调用对应的接口,比如选择图片接口`chooseImage`: ```javascript methods: { chooseImage() { wx.chooseImage({ count: 1, success: function (res) { // 选择图片成功后的处理逻辑 const localIds = res.localIds; // ... }, fail: function (error) { // 选择图片失败后的处理逻辑 console.error('选择图片失败', error); } }); } } ``` 以上是在Vue2中接入微信公众号JSSDK的基本步骤,您可以根据实际需求进行相应的配置和调用。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值