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