微信分享jssdk实例

最新推荐文章于 2022-01-13 10:00:00 发布

陌阡

最新推荐文章于 2022-01-13 10:00:00 发布

阅读量8.3k

点赞数 2

分类专栏： php 文章标签：微信

本文链接：https://blog.csdn.net/zhaoxuejie/article/details/44833623

版权

php 专栏收录该内容

61 篇文章 0 订阅

订阅专栏

<?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以上大小的图片作为分享的图片，
链接：链接地址
描述：暂时没有办法修改。

最终解决方案：