项目场景：

公众号网页开发请求微信授权调用微信SDK 扫一扫相机/相册接口

问题描述：

项目在安卓上顺利运行在iOS 无法调起微信SDK 报错为签名错误

原因分析：

在安卓能跑通说明后端的签名算法正确问题还在前端
百度发现微信浏览器中 iOS使用的wkwebview内核不会对vue-router反应只记录了第一次进入页面地址微信授权放在APP.vue中使用localtion的属性或方法强行重置历史记录会导致APP.vue刷新页面不停循环跳转走不通
因此判断在iOS设备上使用第一次进入地址去配置config 但是还是签名错误继续寻找问题所在
之后各种手动配置URL 还是报错因为项目需要获得微信用户授权第一次进入页面时后面跟着授权参数所以iOS因此应该是记录了此时带着授权参数的URL

解决方案：

无意间发现某位博主的代码片段对授权参数进行了转码 encodeURIComponent()
配合安卓iOS环境判断对iOS使用第一次进入地址并对授权参数转码成功
以下贴上完整代码

在 src/router/index.js 里监听路由变化

router.afterEach(async (to) => {let baseLocation = "http://www.xx.cn"//自行改为项目地址if (window.__wxjs_is_wkwebview) { // 通过此属性判断IOSif (window.entryUrl == '' || window.entryUrl == undefined) {var url = baseLocation + encodeURIComponent(to.fullPath)window.entryUrl = url}} else { // 安卓window.entryUrl = baseLocation +to.fullPath}sessionStorage.setItem("url", window.entryUrl) //直接在使用页面 用来请求接口配置config
})

2.使用页面可以直接调这个函数

// 微信配置
get_config() {this.url = sessionStorage.getItem("url");//读取地址this.$axios.get(`xx?zz=${this.url}`).then((res) => {//此处自行配置接口地址console.log(res, "微信配置");if (res.code == 200) {wx.config({debug: false, // 这里一般在测试阶段先用true，等打包给后台的时候就改回false,appId: res.data.appId, // 必填，公众号的唯一标识timestamp: res.data.timestamp, // 必填，生成签名的时间戳nonceStr: res.data.nonceStr, // 必填，生成签名的随机串signature: res.data.signature, // 必填，签名jsApiList: ["scanQRCode"], // 必填，需要使用的JS接口列表 根据你的需求自行写入});}});
},

以我调用的扫一扫举例

wx.ready(() => {wx.checkJsApi({jsApiList: ["scanQRCode"],success: function (res1) {console.log("成功", res1);},fail: function (res1) {console.log("失败", res1);},});wx.scanQRCode({needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，scanType: ["qrCode"], // 可以指定扫二维码还是一维码，默认二者都有success: (res) => {//注意这里写法 微信官方默认为es5写法 这里获取不到this 需改为箭头函数或者提前保存this等方法// var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果},});
});
wx.error(function (res) {console.log(res, "失败");
});

如果还有问题请在评论区反馈第一次写博客可能有些遗漏敬请体谅

解决公众号开发安卓正常 iOS调微信SDK失败签名错误相关推荐

实例：用C#.NET手把手教你做微信公众号开发（20）--使用微信支付线上收款：jsapi方式
在做线上.线下销售时,可以使用微信便捷支付,通过微信公众号收款有很多种收款方式,如下图: 今天我们来讲一下jsapi支付,场景就是在微信内打开某个页面,完成在线支付,同样一个网页,使用微信打开就是js ...
实例：用C#.NET手把手教你做微信公众号开发（21）--使用微信支付线上收款：H5方式
在做线上.线下销售时,可以使用微信便捷支付,通过微信公众号收款有很多种收款方式,如下图: 今天我们来讲一下H5场景支付,使用手机浏览器打开就是H5方式,最常见的推广是短信内置链接,这种场景需要调用微信 ...
微信公众号开发C#系列-12、微信前端开发利器：WeUI
本文目录 1.前言 2.WeUI基本介绍 2.1 WeUI概述 2.2 为什么选择jQuery WeUI 3.jQuery WeUI基本用法 4.其他基础组件展示 4.1.switch开关 4.2.文 ...
微信公众号开发之使用eclipse创建微信web工程并发布到BAE测试
本篇博文主要是讲一下在eclipse上创建一个微信web工程并发布到BAE上,其中会讲一些应该注意的问题 1.切入正题,为了减少麻烦,我使用百度提供的一键安装版的Eclipse,下载地址:http:/ ...
微信公众号开发《四》调用微信JS-SDK实现上传手机图片到服务器
在这粘贴上三篇博文链接,方便大家查阅互相学习: 微信公众号开发<一>OAuth2.0网页授权认证获取用户的详细信息,实现自动登陆微信公众号开发<二>发送模板消息实现消息业务实 ...
微信公众号开发《四》使用微信JS-SDK实现手机图片上传，支持压缩、预览。并下载图片到自身服务器
在这粘贴上三篇博文链接,方便大家查阅互相学习: 微信公众号开发<一>OAuth2.0网页授权认证获取用户的详细信息,实现自动登陆微信公众号开发<二>发送模板消息实现消息业务实 ...
公众号开发素材管理效果演示-微信开发素材管理1
你在微信公众号文章中, 看到丰富多彩的内容, 像图片,视频,语音这些类型的素材. 这些素材我们不能从你的web服务器直接使用, 而是要把它们上传到微信服务器, 然后再使用. 所以接下来子恒老师跟你分享 ...
实例：用C#.NET手把手教你做微信公众号开发（19）--使用微信支付转账到微信粉丝零钱账户
公众号给微信用户支付费用的方式有很多种,最常用的是发红包和转账到零钱账户,上一篇文章详细讲解了使用发红包的过程,从公众号内的配置,到微信支付的配置,再到具体的类实现. 本篇主要讲解转账到零钱,具体的类 ...
微信公众号开发中分享功能分享微信朋友圈/微信好友
微信公众号中经常遇到的问题就是分享链接到微信朋友圈微信好友一类的需求. 下边走一下需要操作的流程 1.首先再项目中(一般就放到自己的公共文件中引入即可,vue中引入到index.html中)引入微信 ...

解决公众号开发安卓正常 iOS调微信SDK失败签名错误

项目场景：

问题描述：

原因分析：

解决方案：

解决公众号开发安卓正常 iOS调微信SDK失败签名错误相关推荐

最新文章

热门文章

解决公众号开发 安卓正常 iOS调微信SDK失败 签名错误

项目场景：

问题描述：

原因分析：

解决方案：

解决公众号开发 安卓正常 iOS调微信SDK失败 签名错误相关推荐

最新文章

热门文章

解决公众号开发安卓正常 iOS调微信SDK失败签名错误

解决公众号开发安卓正常 iOS调微信SDK失败签名错误相关推荐