网站有些内容需要分享到微信朋友圈，或者发送给微信好友。分享到微信朋友圈的网页链接没有缩略图图标，发给微信好友的网页链接没有图标与摘要，明显就不上档次了…
如下图所示：
分享到朋友圈没有缩略图图标
发送给微信好友没有图标与摘要
查找了一些资料，发现要解决此问题，必须符合微信分享的策略：
JSSDK自定义分享接口的策略调整
为规范自定义分享链接功能在网页上的使用，自2017年4月25日起，JSSDK“分享到朋友圈”及“发送给朋友”接口，自定义的分享链接，其域名或路径必须与当前页面对应的公众号JS安全域名一致，否则将调用失败。
例如，当前页面是 http://www.abc.com/123，其公众号对应的JS安全域名为 www.abc.com 以及 www.xyz.com，则分享自定义链接 http://www.abc.com/456 可以成功，分享 http://www.xyz.com/123 或 http://www.def.com/123 均将失败。
对于未接入微信JSSDK或已接入但JSSDK调用失败的网页，被用户分享时，分享卡片将统一使用默认缩略图和标题简介，不允许自定义。
接口完整用法请参考《微信JSSDK说明文档》，请开发者及时完成调整。
因此需要具备以下2个条件
1、微信公众号
微信公众号（服务号、订阅号），我的只是个人申请的订阅号
2、网站必需已完成备案
如果没有备案的网站就不用继续了。
条件具备了，下面是设置公众号与配置网站
参照 微信JS-SDK说明文档
大致步骤如下
一：绑定域名
二：引入JS文件
三：通过config接口注入权限验证配置
四：通过ready接口处理成功验证
五：通过error接口处理失败验证
一、设置公众号，绑定域名
1、设置JS接口安全域名，才能在该域名下调用微信开放的JS接口
进入公众号→设置→公众号设置→功能设置
JS接口安全域名→设置
这里我们要下载文件MP_verify_zsB3mdwTTjCFzn20.txt ，上传至网站根目录才能完成绑定域名（注意网站如果有WP Super Cache缓存的话，要先清除缓存，否则无法成功）
2、获取开发者ID与密码，设置IP白名单
进入公众号→开发→基本配置
开发者ID（AppID）直接可以查看到，开发者密码（AppSecret）无法直接查看，点击重置获取
我们先记录好开发者ID与密码，稍后配置网站时需要使用。
IP白名单是将需要我们网站固定IP地址填上即可。
二、配置网站，引入JS文件
1、在需要调用JS接口的页面引入JS文件
<body> //在需要调用JS接口的页面的body与body之间插入配置代码。
//引入如下JS文件
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script>
//通过config接口注入权限验证配置
wx.config({
debug: false, // true为开启，false为关闭。开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '<?php echo $signPackage["appId"];?>', // 必填，公众号的唯一标识
timestamp: <?php echo $signPackage["timestamp"];?>, // 必填，生成签名的时间戳
nonceStr: '<?php echo $signPackage["nonceStr"];?>', // 必填，生成签名的随机串
signature: '<?php echo $signPackage["signature"];?>', // 必填，签名
jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'] // 必填，需要使用的JS接口列表
});
//通过ready接口处理成功验证
wx.ready(function () {
//获取“分享到朋友圈”按钮点击状态及自定义分享内容接口（即将废弃）
//但我使用新接口updateTimelineShareData却报错permission denied该公众号没有权限使用这个JSAPI
wx.onMenuShareTimeline({
title: '', // 分享标题
link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
}
});
//获取“分享给朋友”按钮点击状态及自定义分享内容接口（即将废弃）
//但我使用新接口wx.updateAppMessageShareData却报错permission denied该公众号没有权限使用这个JSAPI
wx.onMenuShareAppMessage({
title: '', // 分享标题
desc: '', // 分享描述
link: '', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
}
});
});
//通过error接口处理失败验证
wx.error(function(res){
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
});
</script>
</body>
2、配置后端PHP代码
下载微信示例代码http://demo.open.weixin.qq.com/jssdk/sample.zip
将下载下来的sample压缩包里面的jssdk.php解压出来，上传到网站主题需要调用JS接口的模板目录（我这里只针对我使用的WordPress子主题的操作）
在主题头部header.php插入jssdk的代码（或者在需要调用JS接口的页面插入代码）
<?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package WordPress
* @subpackage Twenty_Seventeen
* @since 1.0
* @version 1.0
*/
//插入代码
require_once "jssdk.php";
$jssdk = new JSSDK("wxae*********02cc", "99***********************52e5"); // 填上"wxae*********02cc"开发者ID（AppID），"99***********************52e5"开发者密码（AppSecret）
$signPackage = $jssdk->GetSignPackage();
?><!DOCTYPE html>
至此完成《网页分享到微信显示图标、标题、摘要》所有的配置了。本篇配置步骤仅适用于我现在使用的WordPress，至于其它类型的网站仅供参考。
需要注意的是使用WP Super Cache缓存时间过长，会导致JS接口出现各种问题哟！
配置JSSDK经历的各种各样的坑，后续有时间再做详细记录吧。