脚本宝典收集整理的这篇文章主要介绍了vue cli单页模式下偶尔报错 invalid signature 的错误，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

最近遇到一个需求是调用jSSDk进行语音录制的功能,功能已经开发好了,只是经常偶然性的config会报报错,大部分是报invalid signature的错误,这个错误不是必现的,只是经常性地出现.后来发现了原因.

1. 原因是使用了vue-router里面的history模式,这种模式下的url是不断变化的,而jssdk的在每一次url变化的时候都需要重新config,导致每一个跳转一个页面都需要重新去进行config,

2. 而使用vue-router的默认模式,只是hash部分(#后面的内容)变化,这种变化是不需要重新进行config的

3. 使用默认的vue-router的hash mode就可以,在根组件(一般是app.vue)里面配置config信息即可,代码如下

const wx = require('weixin-js-sdk')
// 配置微信 config信息
let data = {
  noncestr: 'Wm3WZYTPz0wzccnWsss',
  timestamp: +new Date(),
  url: window.location.href.split('#')[0],
  jsApiList: ['chooseImage', 'startRecord', 'playVoice', 'stoPRecord', 'downloadVoice', 'uploadVoice', 'stopvoice']
}
// m6Get 是我自己封装的fetch方法
// 从后台获取appid和对应的signature
m6Get('getWechatSu', data).then((@H_406_71@res) => {
  wx.config({
    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
    appId: res.data.appid, // 必填，公众号的唯一标识
    timestamp: data.timestamp, // 必填，生成签名的时间戳
    nonceStr: data.noncestr, // 必填，生成签名的随机串
    signature: res.data.signature, // 必填，签名，见附录1
    jsApiList: data.jsApiList // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
  })
})

1. 之后其他页面不用再进行config配置了,可以直接使用 :)

脚本宝典总结

以上是脚本宝典为你收集整理的vue cli单页模式下偶尔报错 invalid signature 的错误全部内容，希望文章能够帮你解决vue cli单页模式下偶尔报错 invalid signature 的错误所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。