अभी लॉगिन करें 做过微信H5页面的人大概都遇到过这种情况：同一个链接，自己转发出去只有干巴巴的默认样式，别人家的分享卡片却带着精心设计的标题、描述和封面图。差别就在于有没有做自定义分享。要实现这个效果，核心是三件事——后端生成签名、前端引入并配置JS-SDK、调用接口设置分享内容。流程本身不算复杂，但环节多、坑也不少，下面按实际开发的顺序捋一遍。
动手之前，先得把准备工作做扎实。自定义分享依赖微信JS-SDK的能力，前提是你有一个已认证的微信公众号，最好是企业资质，个人订阅号很多接口权限拿不到。认证完成后，在微信公众平台能拿到AppID和AppSecret，后面每一步都离不开这两个值。接着去"开发-基本配置"里设置JS接口安全域名，网页必须部署在这个域名之下，域名本身还得完成ICP备案，否则config阶段直接报错。另外别忘了把服务器IP加进白名单，不然后端请求微信接口换票据时会被拒掉。
准备就绪，进入后端环节。第一步是拿access_token：用AppID和AppSecret向 https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET 发起GET请求即可。这个token有效期7200秒，千万别每次有用户打开页面就去请求一次，微信对调用频率有限制，正确的做法是在服务端全局缓存，临近过期再刷新。拿到token之后，再用它去换jsapi_ticket，请求 https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=ACCESS_TOKEN 。ticket的有效期同样是7200秒，也要缓存起来，它就是生成签名的核心原料。
签名这一步是新手最容易翻车的地方。需要把jsapi_ticket、noncestr（随机字符串）、timestamp（当前时间戳）以及当前页面的URL按规则排序拼接，然后用sha1算法加密。这里最要留心的是那个URL：必须是调用JS接口页面的完整地址，去掉#后面的hash部分，并做encodeURIComponent编码。很多人本地调试一切正常，一上线就报invalid signature，十有八九是前后端URL没对上。稳妥的做法是让前端把当前地址（location.href去掉hash）传给后端去签名，而不是让后端自己猜。
后端算好签名后，把appId、timestamp、nonceStr、signature一并返回给前端。前端先通过script标签引入微信JS-SDK文件，然后调用wx.config注入配置，把这些参数填进去，并在jsApiList里声明要用的接口。config执行完无非两种结果：验证通过会触发wx.ready()，所有分享设置都应该写在这个回调里，因为接口必须等验证通过才能调用；失败则进入wx.error()，常见原因是签名错误、域名没配对或者时间戳不一致。调试阶段建议打开debug模式，配合微信开发者工具看具体报错，比盲猜效率高得多。
验证通过，就可以设置分享内容了。分享到朋友圈用wx.onMenuShareTimeline，能自定义标题、链接和图标；分享给好友或群聊用wx.onMenuShareAppMessage，比前者多一个描述字段。两个接口建议都配上——用户从哪条路径分享出去你控制不了，只配一个的话，另一条路径照样露出默认样式，等于前功尽弃。
最后再唠叨几个容易忽略的点。签名有有效期，如果用户在页面上停留太久才点击分享，签名可能已经失效，必要时可以在分享动作触发时动态重新签名。URL编码问题前面提过，这里再强调一次：前后端必须严格一致。access_token和jsapi_ticket务必在服务端集中缓存、统一管理刷新逻辑，多实例部署时尤其要小心互相覆盖导致ticket失效。另外，微信在SDK 1.4.0之后推荐改用updateAppMessageShareData和updateTimelineShareData这两个新接口，老接口虽然暂时还能用，但官方已标记废弃，新项目直接上新的更省心。
整个流程走完，链接在微信里转发就能带上定制的标题、描述和封面了。说白了，自定义分享的难点从来不在代码量，而在于配置链条长、环节多，任何一环对不上都会失败。把域名、白名单、缓存、URL这几处关键点盯紧，剩下的就是按部就班的事。
