資訊專欄INFORMATION COLUMN
摘要：你的頁面還是無法正常使用微信函數(shù)的。這樣似乎就解決了微信簽名失敗的問題。但是，我們又遇到了另外一種情況在微信小程序里用內(nèi)嵌的網(wǎng)頁，在安卓下也報和錯誤。
幾乎每一個開發(fā)用于微信公眾號頁面的工程師都遇到過微信jssdk報的各種錯誤，通常是permission denied，類似這樣：
通常他們會建議你把debug選項開開，比如這樣：
wechat.config({
debug: true,
appId: appId,
timestamp: timestamp,
nonceStr: nonceStr,
signature: signature,
jsApiList: ["scanQRCode"],
});
結(jié)果你又遇到了invalid signature。類似這樣：
簽名不對，這是什么意思？可是這簽名是后端給過來的，我怎么知道它為什么不對？后端用的是標(biāo)準(zhǔn)算法，不可能不對啊。
查網(wǎng)上各種教程，或者微信官網(wǎng)，他們總是不厭其煩地告訴你，讓你去檢查簽名算法，然而根本沒有用！
90%的這種情況下，其實只是一個原因：你用于計算簽名的URL地址不對，跟算法沒有任何關(guān)系，完全不必浪費(fèi)時間去看什么簽名算法。
我又遇到了一種新情況，所以還是有必要進(jìn)入微信公眾號管理后臺按照以下順序檢查：第一，在接口配置頁面檢查是否把你的服務(wù)器的域名加入了信任域名？第二，在基本配置頁面檢查是否把你的服務(wù)器的IP地址加入了白名單？
微信要求：如果我們需要在頁面中調(diào)用微信的某個方法，則必須用這個頁面的URL地址獲取簽名。聽上去似乎很好理解，但是實際上URL地址包含的部分很多，有問號，有#號，你所要做的是取出#前面的部分。比如說你的URL地址是這樣：https://www.abc.com/abc.html?abc=def#xyz，那么你用于計算簽名的URL地址不可以是https://www.abc.com/abc.html，也不能是https://www.abc.com/abc.html?abc=def#xyz，而必須只能是https://www.abc.com/abc.html?abc=def。
如何獲取當(dāng)前頁面的URL地址呢？這個很簡單：
let wechaturl = window.location.href.split("#")[0];
然而你以為事情就這樣結(jié)束了？太天真。你的頁面還是無法正常使用微信函數(shù)的。
因為：微信內(nèi)嵌瀏覽器在iOS和安卓下的表現(xiàn)不一樣。
在安卓下，你確實用上面的方法是可以調(diào)用了。但是在iOS下，簽名依然失敗！因為在iOS下，微信需要你傳遞的是入口URL，而不是當(dāng)前頁面的URL！
比如說，你在微信公眾號的某個菜單鏈接進(jìn)入了A頁面，然后從A頁面的某個鏈接跳轉(zhuǎn)到B頁面，然后你在B頁面獲取簽名，如果是在安卓下，你應(yīng)該用B頁面的URL地址來獲取，但是在iOS下，你還必須用A頁面的URL地址來獲取，否則就還是簽名失敗！
知道了原因，就有很多種解決辦法。
首先，我們可以在入口的A頁面里增加這樣的判斷：
if (navigator.userAgent.indexOf("iPhone") !== -1) {
window.wechaturl = window.location + "";
}
然后，在B頁面需要調(diào)用簽名的地方，再增加這樣的判斷：
let wechaturl = window.location.href.split("#")[0];
if (window.wechaturl !== undefined) {
wechaturl = window.wechaturl;
}
這樣我們就有效地區(qū)分開了iOS和安卓。但問題是在iOS下，如果我的另外一個菜單入口是B頁面，我從B頁面跳轉(zhuǎn)到A頁面，這時候我的入口鏈接被強(qiáng)制變成了A頁面，依然會產(chǎn)生簽名失敗的錯誤。
所以我們還需要在微信公眾號的每一個入口菜單鏈接里加一個特殊的參數(shù)，例如wechat=1，變成這樣：https://www.abc.com/abc.html?abc=def&wechat=1，
然后我們再增加一層判斷，變成這樣：
if (navigator.userAgent.indexOf("iPhone") !== -1) {
if (this.$route.query.wechat !== undefined && this.$route.query.wechat === "1") {
window.wechaturl = window.location + "";
}
}
這里我用了vue的寫法，但原理是一樣的。只有我檢測到了wechat這個參數(shù)，我才認(rèn)為當(dāng)前頁面是入口頁面，如果沒有檢測到，則不必強(qiáng)行設(shè)置為入口頁面。
這樣似乎就解決了微信簽名失敗的問題。
但是，我們又遇到了另外一種情況：在微信小程序里用web-view內(nèi)嵌的網(wǎng)頁，在安卓下也報permission denied和invalid signature錯誤。不過有了上面的經(jīng)驗，我們診斷錯誤根源還是URL入口地址的問題。果然，在安卓下用入口地址獲取簽名成功，而用當(dāng)前地址獲取簽名失敗，為此，我們在入口頁面里再加一個判斷：
if (navigator.userAgent.indexOf("miniProgram") !== -1) {
window.wechaturl = window.location + "";
}
至此，各種簽名錯誤的問題才算是全部解決。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/100969.html
摘要：簡直是個神坑，被坑哭了，所以記錄一下把微信和改用存，為了避免并發(fā)導(dǎo)致次數(shù)被用完，加了鎖，為了避免以后擴(kuò)展，改用了分布式鎖，改完用并發(fā)測試了下，一切正常，。 簡直是個神坑，被坑哭了，所以記錄一下！ 把微信token和ticket改用redis存，為了避免并發(fā)導(dǎo)致token次數(shù)被用完，加了鎖，為了避免以后redis擴(kuò)展，改用了分布式鎖，改完用100并發(fā)測試了下，一切正常，perfect。 ...
摘要：微信分享可以實現(xiàn)自己的網(wǎng)頁在微信自定義圖標(biāo)，標(biāo)題，還有描述，還可以分享到朋友圈，分享到微信群，分享給朋友等操作。 微信JSSDK分享可以實現(xiàn)自己的網(wǎng)頁在微信自定義圖標(biāo)，標(biāo)題，還有描述，還可以分享到朋友圈，分享到微信群，分享給朋友等操作。 showImg(https://segmentfault.com/img/bVbiGlk?w=1214&h=1079); 上圖就是，左側(cè)是分享到朋友圈...
摘要：本篇文章就記錄我的做微信分享信息定制的過程和踩坑總結(jié)。但是，這就要求在每個組件中都加微信分享代碼，會導(dǎo)致維護(hù)困難。 在微信瀏覽器內(nèi)打開任何網(wǎng)頁，若不配置分享接口，微信會默認(rèn)使用如下信息作為分享信息： 默認(rèn)標(biāo)題：HTML的title 默認(rèn)連接：當(dāng)前頁面的地址，即location.href 默認(rèn)圖片：會取當(dāng)前頁面body內(nèi)最前面的一張符合條件的圖片（尺寸必須大于300px × 300px...
摘要：路由守衛(wèi)內(nèi)觸發(fā)更新簽名獲取真實有效微信簽名此處需要自行處理在路由守衛(wèi)內(nèi)更新簽名，保證是使用當(dāng)前頁面，是使用目標(biāo)路由完整地址再加上域名使用簽名調(diào)用在使用的頁面通過取出緩存的微信簽名，然后進(jìn)行簽名。 背景 手機(jī)型號： 型號：iphone 7 / iphone xs max版本：ios 10.3.1 / ios 12.1微信版本：WeChat 6.7.3 問題還原： Vue應(yīng)用(vue-ro...
閱讀 3715·2021-11-11 16:55
閱讀 1656·2021-10-08 10:04
閱讀 3591·2021-09-27 13:36
閱讀 2790·2019-08-30 15:53
閱讀 1872·2019-08-30 11:17
閱讀 1274·2019-08-29 16:55
閱讀 2114·2019-08-29 13:57
閱讀 2529·2019-08-29 13:13
