// main.js ... import wx from 'weixin-js-sdk' import request from 'axios' ... router.afterEach((to, from) => { let _url = window.location.origin + to.fullPath // 非ios设备，切换路由时候进行重新签名 if (window.__wxjs_is_wkwebview !== true) { request.get('/api/jssdk?url=' + encodeURIComponent(_url)).then(function (_lists) { // 注入配置 wx.config({ ... }) }) } // 微信分享配置 wx.ready(function () { wx.onMenuShareTimeline({ ... }) wx.onMenuShareAppMessage({ ... }) }) }) ... // ios 设备进入页面则进行js-sdk签名 if (window.__wxjs_is_wkwebview === true) { let _url = window.location.href.split('#')[0] request.get('/api/jssdk?url=' + encodeURIComponent(_url)).then(function (res) { let _lists = res wx.config({ debug: false, appId: _lists.appId, timestamp: _lists.timestamp, nonceStr: _lists.nonceStr, signature: _lists.signature, jsApiList: ['chooseImage', 'uploadImage', 'previewImage', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareTimeline', 'chooseWXPay'] }) }) }
总结： 总之简要概括就是要想分享成功，必须签名是成功的，要想签名成功，必须保证调用签名配置的时候微信校验签名获取的url（ios永远是第一次进入页面的url）和我们请求服务端获取签名时提交的url一致。
调用微信支付
两个方案何去何从
h5使用微信支付，细心的人会发现，微信是有两个方案的，我大致了解了一个，一个是js-sdk中开放的能力，一个是微信支付开放平台提供的接口
如果你只需要在公众号中调用支付，两个方法都可以，笔者由于已经使用js-sdk接入了其他功能，所以这里就选择了chooseWXPay方式。
接入步骤
在其他功能都接入成功的前提下，接支付就很快很方便了，笔者把主要步骤列下：
微信公众平台中配置好js安全接口域名（例如），这个是调用js-sdk的前提，公众号支付也是基于js-sdk；
微信支付平台中设置支付目录，参见微信支付开发文档，这里要说明的是，你需要进行支付的页面路由是什么，就要配置什么，而且需要在后边加上/（例如）
调用js-sdk签名配置（wechat.config），上文已有提及。
在点击支付按钮的逻辑中，调用wechat.chooseWXPay()方法，该方法也涉及到支付签名，需要从服务端去获取签名信息
注意的点：访问支付页面务必不要遗漏/，微信那边会严格比较调用第4步骤时你所在的页面路由和支付平台中设置的路由是否一致。
Coding
这里主要展示第4步骤中笔者的写法，仅供参考
... methods () { handlerPay () {**粗体文本** let self = this // 进行支付签名 apiUtil.get('/api/jssdk/pay', {amount: this.amount}).then(function (wxmsg) { self.$wechat.chooseWXPay({ // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 appId: wxmsg.appId, timestamp: wxmsg.timeStamp, nonceStr: wxmsg.nonceStr, // 支付签名随机串，不长于 32 位 package: wxmsg.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***） signType: wxmsg.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5' paySign: wxmsg.paySign, // 支付签名 success: function (res) { // 支付成功的回调函数 }, cancel: function (res) { // 支付取消的回调函数 }, error: function (res) { // 支付失败的回调函数 } }).catch(function () { ... }) } }