? ? ? ?早聞微信支付一直為移動開發者所詬病，這次公司項目新增微信支付需求，一試果然是一把辛酸淚，從配置到與后臺調試真是一波三折，整整花了一天的時間才從坑里爬出來，效率也是低。所以有必要做下總結，日后再有微信支付，三兩下便可完事。 　　因為公司項目是RN寫的，我這邊選用了目前在RN上使用較廣泛的微信支付組件，基本上都封裝好了，github直通車：react-native-wechat ? ? ? ?我們只需要實現兩步就可以調起微信支付：

• 在應用啟動的時候注冊APPID

WeChat.registerApp('appid'); 復制代碼

• 在跳轉到微信支付的點擊事件中配置參數：

wechat.isWXAppInstalled().then( ( isInstalled ) => {if ( isInstalled ) { //判斷手機是否有安裝微信wechat.pay({partnerId: wxinfo.mch_id, // 商家向財付通申請的商家idprepayId: wxinfo.prepay_id, // 預支付訂單nonceStr: wxinfo.nonce_str, // 隨機串，防重發timeStamp: result.data.time.toString() , // 時間戳，防重發.package: 'Sign=WXPay', // 商家根據財付通文檔填寫的數據和簽名sign: result.data.sign // 商家根據微信開放平臺文檔對數據做的簽名}).then((requestJson)=>{//支付成功回調console.log("----微信支付成功----",requestJson);if (requestJson.errCode=="0"){//回調成功處理}}).catch((err)=>{toastShort('支付失敗')})} else {toastShort( '沒有安裝微信軟件，請您安裝微信之后再試' );}} ); 復制代碼

? ? ? ?以上就是react native調用微信支付的過程，使用的開源庫已經幫我們封裝好了其他的一些配置，用起來也是非常的方便。 ? ? ? ?接下來就是在手機上跑一遍，魯迅說過：“新鮮事物第一次嘗試就想要成功，幾率還是很小的”。當我點擊微信支付，期待著跳出熟悉的微信支付界面時，出現了令我失望的結果：屏幕閃了一下，然后，然后就沒有然后了，what the f...,好，穩定下情緒，開始我的爬坑之旅。 　　首先，我先來到這個開源庫的文檔中尋找下是否有我遺漏的地方，在最后看到了一句話，仿佛看到了曙光:

在安卓機上測試的同學經常會遇到比如調用微信支付時閃一下就沒了的問題，這個問題100%跟簽名有關，請檢查你的簽名。 debug版本和release版本的簽名是不同的，請注意

? ? ? ?從這段話中，從100%這個字眼我讀出了作者堅定的語氣，自信的情感。于是我立馬讓運營小哥查看當時他申請微信支付用的簽名，結果一對證，我c...，好，穩定下情緒，果然真是簽名不對，當時給了一個dubug的簽名，后面我讓他換成release的簽名，沒換過來。好在微信開放平臺是支持修改的，而且即時生效。這下應該沒問題了吧。。。 　　不可能的，不存在的，前方路漫漫。。這時候我的心態還是很好的。 　　依然還是屏幕閃了一下，一只烏鴉帶著省略號飛過。。所以說凡事不要說什么100%，接下來，繼續我們的爬坑之旅。 　　排除了權限問題，包括appid，應用簽名這些都確定無誤，那么問題應該就出在調用微信支付的那些參數上，首先引起我的注意的是sign這個字段，于是來到了微信支付文檔（使用第三方，最主要的還是要回歸到文檔中來），微信支付文檔直通車：微信支付開發文檔 ? ? ? ?簡單描述下調用流程：

• app端先調用自家后臺的支付接口，把金額，支付類型等一些參數傳過去
• 后臺收到這些參數，去調用微信服務端統一下單接口，將金額，商戶訂單號等等這些傳給微信服務端，這時候微信服務端返回成功或失敗，成功會附帶sign，prepay_id等參數給我們后臺。
• 后臺再將微信返回的這些參數返給app端，也就是上文配置中傳的那些參數。app端再把這些參數傳給微信。整個過程是不是一（fei）氣（chang）呵（dan）成（teng）

? ? ? ?那么我們推測問題就出現在這些參數里，讓我們一個一個來分析：

• partnerId 商家ID，這個是申請微信支付的時候，微信分配的ID，直接獲取后臺返回即可，可以與運營小哥那邊再核對下。
• prepayId 預支付訂單，微信服務端返給我們后臺的訂單，app端直接獲取后臺返回即可。
• nonceStr 隨機數，沒什么好說的，直接獲取后臺返回即可。
• timeStamp 時間戳，這是個要小心的地方，之前我們后臺沒給我返回這個字段，我自以為app端自己獲取即時時間戳即可，直接 結果錯了，必須使用后臺給的時間戳。你說這個鍋誰背，55開吧
• package 文檔上說直接寫死即可，package: 'Sign=WXPay'
• sign 這是個大咖，當然計算工作交給后臺來做就行，網上看了幾篇文章說屏幕一閃，有可能就是sign計算錯誤，后臺小哥跟我講這個sign是微信返給他的，然后又直接返給我，emmmm，應該有點問題，再去文檔看看：微信支付APP端開發步驟，里邊第三部有四個字

商戶服務器生成支付訂單，先調用【統一下單API】生成預付單，獲取到prepay_id后將參數再次簽名傳輸給APP發起支付。以下是調起微信支付的

是的，就是這四個字“再次簽名”，需要再次簽名！！所以我又讓后臺小哥處理完sign在發給我。 　　到此，我們把這些參數都給分析了一遍過去，這次要再閃一下我就...我就再找找其他原因，但是事實上，我的app已經成功調起了微信支付，并且成功回調。 　　好了，這波總結進入尾聲了，是不是覺得我寫技術文章很啰嗦，就是啰嗦咋滴。不過說回來，還是總結下主題要義：

• 檢查你的APPID，應用簽名是否正確
• 檢查你的參數傳遞是否正確(包括字段大小寫)，更多地與后臺進行調試
• 以上都確認OK了，重裝你的微信再試一遍

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的React Native微信支付开发爬坑之旅的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。