JSSDK使用步骤
接入准备:拥有一个认证订阅号/认证服务号,如果还没有,请前往微信公众平台注册并通过微信认证。
步骤一:绑定域名
先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
建议填写一级域名,则该域名下的所有子域名均在安全域名下。
步骤二:引入JS文件
步骤三:配置wx.config
wx.config({
appId: "wxdxxxxxxxxxxxx", //必填,公众号的唯一标识
timestamp: "", //必填,生成签名的时间戳
nonceStr: "", //必填,生成签名的随机串
signature: "", //必填,签名,见 http://t.cn/RL24Fgw
jsApiList: [
"getNetworkType",
"getLocation",
"onMenuShareTimeline",
"onMenuShareAppMessage",
"onMenuShareQQ",
"onMenuShareWeibo",
"onMenuShareQZone" //如业务需求,可继续加入其他微信JS接口
]
});
步骤四:配置wx.ready
请注意,wx.ready 依赖 tar.config 和 wx.config,请保证这两项配置在wx.ready之前完成。
wx.ready(function () {
var shareData64 = {
title: "", //必填,分享标题
desc: "", //选填,分享描述
imgUrl: "", //选填,分享图片
link: "http://www.xxx.com/…" //必填,支持直接填写location.href
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
};
wx.onMenuShareAppMessage(tar.shapeShareAppMessage(shareData64));
wx.onMenuShareTimeline(tar.shapeShareTimeline(shareData64));
});
常见错误及解决方法
invalid url domain当前页面所在域名与使用的appid没有绑定,请确认正确填写绑定的域名,如果使用了端口号,则配置的绑定域名也要加上端口号(一个appid可以绑定三个有效域名)。
permission denied该公众号没有权限使用这个JSAPI,或者是调用的JSAPI没有传入config的jsApiList参数中(部分接口需要认证之后才能使用)。
在iOS和Android都无法分享(请确认公众号已经认证,只有认证的公众号才具有分享相关接口权限,如果确实已经认证,则要检查监听接口是否在wx.ready回调函数中触发)
服务上线之后无法获取jsapi_ticket,自己测试时没问题。(因为access_token和jsapi_ticket必须要在自己的服务器缓存,否则上线后会触发频率限制。请确保一定对token和ticket做缓存以减少2次服务器请求,不仅可以避免触发频率限制,还加快你们自己的服务速度。目前为了方便测试提供了1w的获取量,超过阀值后,服务将不再可用,请确保在服务上线前一定全局缓存access_token和jsapi_ticket,两者有效期均为7200秒,否则一旦上线触发频率限制,服务将不再可用)。
通过a链接(例如先通过微信授权登录)跳转到b链接,invalid signature签名失败(后台生成签名的链接为使用jssdk的当前链接,也就是跳转后的b链接,请不要用微信登录的授权链接进行签名计算,后台签名的url一定是使用jssdk的当前页面的完整url除去'#'部分)
出现config:fail错误(这是由于传入的config参数不全导致,请确保传入正确的appId、timestamp、nonceStr、signature和需要使用的jsApiList)
绑定父级域名,是否其子域名也是可用的(是的,合法的子域名在绑定父域名之后是完全支持的)
在iOS微信6.1版本中,分享的图片外链不显示,只能显示公众号页面内链的图片或者微信服务器的图片,已在6.2中修复
是否需要对低版本自己做兼容(jssdk都是兼容低版本的,不需要第三方自己额外做更多工作,但有的接口是6.0.2新引入的,只有新版才可调用)
目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题已在Android6.2中修复
require subscribe错误说明你没有订阅该测试号,该错误仅测试号会出现
ICP备案数据同步有一天延迟,所以请在第二日绑定
invalid signature签名错误。建议按如下顺序检查:
-
确认config中nonceStr(js中驼峰标准大写S), timestamp与用以签名中的对应noncestr, timestamp一致。
确认url是页面完整的url(请在当前页面alert(location.href.split('#')[0])确认),包括'http(s):'部分,以及'?'后面的GET参数部分,但不包括'#'hash后面的部分。
确认 config 中的 appid 与用来获取 jsapi_ticket 的 appid 一致。
确保一定缓存access_token和jsapi_ticket。
确保你获取用来签名的url是动态获取的,动态页面可参见实例代码中php的实现方式。如果是html的静态页面在前端通过ajax将url传到后台签名,前端需要用js获取当前页面除去'#'hash部分的链接(可用location.href.split('#')[0]获取,而且需要encodeURIComponent),因为页面一旦分享,微信客户端会在你的链接末尾加入其它参数,如果不是动态获取当前链接,将导致分享后的页面签名失败。