快捷導(dǎo)航

解決SDK注入權(quán)限驗(yàn)證安卓正常，IOS出現(xiàn)config fail的方法

更新時(shí)間：2019年06月25日 08:32:11 作者：沉淀的風(fēng)

這篇文章主要介紹了解決SDK注入權(quán)限驗(yàn)證安卓正常，IOS出現(xiàn)config fail的方法,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

實(shí)測(cè)有效解決微信游覽器和企業(yè)微信游覽器JSSDK注入權(quán)限驗(yàn)證安卓正常，IOS出現(xiàn)config fail

一開始我們想到的是可能微信這邊的Bug，但細(xì)想一下應(yīng)該不是。因?yàn)榭赡苌婕暗搅薎OS的底層原理的問(wèn)題，可能是不受微信所控。（有問(wèn)題歡迎拍磚）

出現(xiàn)問(wèn)題得解決問(wèn)題啊，不能把問(wèn)題晾在那邊不管，這是程序員的尊嚴(yán)！

我這個(gè)是SPA應(yīng)用，所以拿其中一個(gè)vue項(xiàng)目來(lái)做探討，其他SPA應(yīng)用同理

首先我們想到在安卓中生效，在IOS中不生效是什么原因？

我們把所有設(shè)置都檢查了一遍，最終發(fā)現(xiàn)是當(dāng)前路由location.href不一致的問(wèn)題

我們可以去嘗試一下去到具體某個(gè)頁(yè)面：

在Android下微信復(fù)制當(dāng)前鏈接然后粘貼到輸入框里，會(huì)發(fā)現(xiàn)路由是具體到某個(gè)路由。例如：www.xxxx.com/news/xxxx

在IOS下微信復(fù)制當(dāng)前鏈接然后粘貼到輸入框里，會(huì)發(fā)現(xiàn)路由是首頁(yè)。例如：wwwx.xxxx.com/index

所以問(wèn)題就定位在了url上，這次我只拿調(diào)取掃一掃功能，其余功能自行加上。

那我們只需要判斷訪問(wèn)設(shè)備是安卓還是IOS即可

首先在index.html頁(yè)面中引入JSSDK文件

然后在App.vue文件中

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
 const url = location.href
 const res = await getSignature(url) //獲取設(shè)置config的參數(shù)
 let { timestamp, noncestr, signature, appId } = res.data
 wx.config({
  beta: true,
  debug: false,
  appId: appId,
  timestamp: timestamp,
  nonceStr: noncestr,
  signature: signature,
  jsApiList: ['scanQRCode']
 });
 wx.ready(function () {
  console.log('設(shè)備已經(jīng)可以使用')
 })
}

具體到某個(gè)頁(yè)面的時(shí)候例如：news下

if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
 const url = location.href
 const res = await getSignature(url) //獲取設(shè)置config的參數(shù)
 let { timestamp, noncestr, signature, appId } = res.data
 wx.config({
  beta: true,
  debug: false,
  appId: appId,
  timestamp: timestamp,
  nonceStr: noncestr,
  signature: signature,
  jsApiList: ['scanQRCode']
 });
 wx.ready(function () {
  console.log('設(shè)備已經(jīng)可以使用')
 })
}

這僅限于在微信自帶的游覽器上。企業(yè)微信自帶的游覽器這方法是不行的。

通過(guò)微信企業(yè)瀏覽器掃碼獲取到的微信瀏覽器信息如下：（圖片摘取于CSDN）

微信客戶端掃碼獲取到的信息如下:

對(duì)比企業(yè)微信游覽其和微信游覽器的信息，多出了wxwork。那么我們只需要添加多一個(gè)判斷條件就好了

在App.vue文件中

if (/(wxwork)/i.test(navigator.userAgent)) {
 return
}
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
 const url = location.href
 const res = await getSignature(url) //獲取設(shè)置config的參數(shù)
 let { timestamp, noncestr, signature, appId } = res.data
 wx.config({
  beta: true,
  debug: false,
  appId: appId,
  timestamp: timestamp,
  nonceStr: noncestr,
  signature: signature,
  jsApiList: ['scanQRCode']
 });
 wx.ready(function () {
  console.log('設(shè)備已經(jīng)可以使用')
 })
}

在news文件中

if (/(wxwork)/i.test(navigator.userAgent)) {
 return
}
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
 const url = location.href
 const res = await getSignature(url) //獲取設(shè)置config的參數(shù)
 let { timestamp, noncestr, signature, appId } = res.data
 wx.config({
  beta: true,
  debug: false,
  appId: appId,
  timestamp: timestamp,
  nonceStr: noncestr,
  signature: signature,
  jsApiList: ['scanQRCode']
 });
 wx.ready(function () {
  console.log('設(shè)備已經(jīng)可以使用')
 })
}

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: