微信JSSDK分享缩略图片在IOS中不显示的问题--已解决

说明：项目前端框架vue,
解决问题：微信JSSDK分享缩略图片在IOS中不显示，在安卓中显示正常。

1.在基本配置中，获取AppID,并配置IP白名单

2.设置js接口安全域名

（坑一！！！遇到的第一个坑就是只配置了业务域名，以及网页授权域名，没有配置JS接口安全域名，导致前端一直报错invalid signature）

3.安装微信sdk

1. 安装

npm install weixin-js-sdk

2. 引用，在index.html中

    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" type="text/javascript">

4.上代码

以下操作都在App.vue中完成

1. 获取wx.config的配置参数，从后台获取
2. 配置wx.config，并调用方法

//在create中调用此方法

getConfigParam(){
   ajaxSubmit(
       this.$http,
       getConfigParam,
       "get",
       { url:location.href.split('#')[0]},
       resData => {
            	wx.config({
				    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				    appId: _AppID, // 必填，公众号的唯一标识
				    timestamp:resData.data.timestamp , // 必填，生成签名的时间戳
				    nonceStr: resData.data.noncestr , // 必填，生成签名的随机串
				    signature: resData.data.signature ,// 必填，签名
				    jsApiList: ['onMenuShareAppMessage','onMenuShareTimeline'] // 必填，需要使用的JS接口列表
				});
				wx.error(function(res){
				    console.log(res)
				});
				wx.ready(function(){
			  		var shareTitle="***"
			  		var shareDesc="***************************************"
			  		var shareLink=_localBaseUrl+"login"
			  		var shareImg="################"
			  		wx.onMenuShareAppMessage({
							title: shareTitle, // 分享标题
							desc: shareDesc, // 分享描述
							link: shareLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
							imgUrl:shareImg, // 分享图标
							type: '', // 分享类型,music、video或link，不填默认为link
							dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
							success: function () {
							// 用户点击了分享后执行的回调函数
							}
						});
						wx.onMenuShareTimeline({
					    title: shareTitle, // 分享标题
					    link:shareLink, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
					    imgUrl:shareImg, // 分享图标
					    success: function () {
							},
			  		});
	  	})
       }
      )
  	}

需要注意的地方：

关于微信config:invalid signature：

1. 配置JS接口安全域名
2. 确认url是页面完整的url(请在当前页面alert(location.href.split(’#’)[0])确认)，包括’http(s)?/‘部分，以及’？‘后面的GET参数部分,但不包括’#'hash后面的部分。
3. 确认签名算法正确，可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 页面工具进行校验。

微信JSSDK分享缩略图片

1. 分享缩略图imgUrl不支持相对位置（例如："…/…/…/static/images/share_img.jpg"），只支持绝对位置（“http://www.baidu.com/static/images/share_img.jpg”）
2. 分享缩略图片在IOS中不显示，但是在安卓中显示没有问题。官方给出原因是：在iOS微信6.1版本中，分享的图片外链不显示，只能显示公众号页面内链的图片或者微信服务器的图片（微信团队已经确认此问题，会在6.2中修复）
   但是我也不知道为什么在7.0以上版本的微信依旧存在这个问题，
   我的解决方法：
   将图片上传到微信公众号，然后把上传后图片地址考出来放进代码imgUrl

好啦，以上就是我的一个小方法，希望对大家有帮助！