上次有講到最近開發(fā)支付功能，開發(fā)中碰到的一些問(wèn)題，因?yàn)橹昂苌俳佑|支付功能的開發(fā)，所以項(xiàng)目要求在H5中要迅速打通微信支付功能以及支付寶支付功能，我在前一篇文章中選擇了支付寶當(dāng)面付支付以及微信Native掃碼付支付。

? ? ? ? 但是在H5中使用支付寶當(dāng)面付支付以及微信Native掃碼付支付真的合適么，如果我們拋開用戶體驗(yàn)來(lái)講，確實(shí)支付寶當(dāng)面付支付可以滿足我們的需求了，用戶在H5中保存二維碼，然后進(jìn)入支付寶進(jìn)行掃碼付款操作，整個(gè)流程是沒問(wèn)題的。但是微信Native掃碼付支付呢，這里面其實(shí)就有個(gè)坑，微信Native掃碼付只能進(jìn)行掃碼支付，而且不能支持從相冊(cè)中選擇二維碼，也就是說(shuō)微信Native掃碼付支付只支持當(dāng)面掃碼支付，而用戶使用不可能總是攜帶兩個(gè)手機(jī)，一只顯示二維碼，一個(gè)用戶掃碼支付，這有點(diǎn)不切實(shí)際。而我寫上篇文章的時(shí)候測(cè)試因?yàn)橛秒娔X顯示二維碼，手機(jī)直接掃碼支付所以當(dāng)時(shí)沒發(fā)現(xiàn)這個(gè)問(wèn)題。所以說(shuō)在不考慮用戶體驗(yàn)的角度來(lái)說(shuō)，支付寶當(dāng)面付支付可以滿足我的需求了，但是微信Native需求滿足不了我的基本需求了，所以微信Native掃碼付支付方式被我pass掉了，然后我去查閱文檔發(fā)現(xiàn)，其實(shí)微信是有提供H5端直接跳轉(zhuǎn)微信進(jìn)行支付操作的，而這剛好是我需要的，而且直接跳轉(zhuǎn)微信進(jìn)行支付大大提高了用戶的體驗(yàn)性，所以我最后改寫支付功能的時(shí)候我選擇了微信H5支付。接下來(lái)說(shuō)說(shuō)微信H5支付遇到的一些坑。

微信支付踩過(guò)的坑

1.網(wǎng)絡(luò)環(huán)境未能通過(guò)安全驗(yàn)證，請(qǐng)稍后再試

微信H5支付需要傳遞用戶支付的真實(shí)ip給微信進(jìn)行校驗(yàn)。這個(gè)bug其實(shí)是因?yàn)橛脩魧?shí)際調(diào)起支付時(shí)微信側(cè)檢測(cè)到的終端IP和商戶端我們傳給微信的用戶的終端ip不一致導(dǎo)致的。其實(shí)在公司內(nèi)網(wǎng)進(jìn)行測(cè)試的時(shí)候是沒問(wèn)題的，可以獲取到用戶當(dāng)前操作的真實(shí)ip，測(cè)試支付功能完全沒問(wèn)題。但是我上傳外網(wǎng)的時(shí)候就出問(wèn)題了，外網(wǎng)測(cè)試獲取到的ip不是用戶的真實(shí)ip，導(dǎo)致微信端獲取到的ip與我們獲取到的ip不一致，導(dǎo)致網(wǎng)絡(luò)環(huán)境無(wú)法通過(guò)校驗(yàn)。

上圖就是我在外網(wǎng)測(cè)試得到的用戶ip，因?yàn)橥饩W(wǎng)有nginx反向代理。所以我們獲取到的ip其實(shí)是nginx的代理地址，而真實(shí)ip我們是無(wú)法得到的。后來(lái)經(jīng)過(guò)查閱文檔發(fā)現(xiàn)配置nginx可以將用戶真實(shí)ip進(jìn)行傳遞。

我在外網(wǎng)nginx添加以上配置，果然就可以獲取到當(dāng)前用戶進(jìn)行支付時(shí)的真實(shí)ip。

2.商家參數(shù)格式有誤，請(qǐng)聯(lián)系商家解決

這是微信官方文檔對(duì)這個(gè)問(wèn)題的解釋，這是什么意思呢？其實(shí)進(jìn)行微信支付時(shí)微信會(huì)返回一個(gè)mweb_url給你進(jìn)行支付，我們?cè)谏暾?qǐng)H5支付時(shí)會(huì)設(shè)置授權(quán)域名，網(wǎng)頁(yè)調(diào)取支付H5支付返回的mweb_url ，必須要獲取H5支付頁(yè)面自帶的referer才行（問(wèn)題是當(dāng)前調(diào)起H5支付的referer為空導(dǎo)致），導(dǎo)致referer為空的原因其實(shí)是因?yàn)槲⑿欧祷氐?b>mweb_url我們直接進(jìn)行訪問(wèn)導(dǎo)致的，而直接訪問(wèn)mweb_url就會(huì)導(dǎo)致無(wú)法獲取到H5支付頁(yè)面自帶的referer，所以我們?cè)?b>H5中進(jìn)行點(diǎn)擊跳轉(zhuǎn)到mweb_url中就解決了這個(gè)問(wèn)題了。

3.商家存在未配置的參數(shù)，請(qǐng)聯(lián)系商家解決

這個(gè)問(wèn)題比較簡(jiǎn)單，當(dāng)前調(diào)起H5支付的域名(微信側(cè)從referer中獲取)與申請(qǐng)H5支付時(shí)提交的授權(quán)域名不一致，我們登錄商戶平臺(tái)--"產(chǎn)品中心"--"開發(fā)配置"配置當(dāng)前調(diào)起支付的授權(quán)域名即可。

微信H5支付因?yàn)槭菑?b>Native支付方式進(jìn)行改寫的，所以難度相比重新開發(fā)小了很多。在開發(fā)過(guò)程中主要時(shí)碰到了上述三個(gè)問(wèn)題，在這里記錄一下。

歡迎關(guān)注我的個(gè)人公眾號(hào)：周先生自留地

把微信H5支付完善了之后，你看到兩個(gè)支付功能一個(gè)截圖再去掃碼，一個(gè)直接跳轉(zhuǎn)微信支付，其實(shí)你會(huì)不知不覺的開始考慮用戶體驗(yàn)，所以我就去看了支付寶官方文檔，支付寶可不可以實(shí)現(xiàn)我們直接從H5端直接跳轉(zhuǎn)支付寶進(jìn)行支付呢，答案是可以的，支付寶有手機(jī)網(wǎng)站支付方式，用戶手機(jī)安裝支付寶會(huì)直接跳轉(zhuǎn)支付寶進(jìn)行支付，用戶沒有安裝支付寶可以在H5端登錄支付寶進(jìn)行支付。于是我又開始了把支付寶當(dāng)面付功能改寫成支付寶H5支付方式。下面講講支付寶H5支付碰到的一些問(wèn)題。

1.簽名問(wèn)題

這個(gè)問(wèn)題其實(shí)是由于公司賬號(hào)申請(qǐng)支付寶H5支付的時(shí)候使用了RSA2加密算法，但是之前用的當(dāng)面付還是使用的RSA算法，因?yàn)楣ぷ鹘唤硬粡氐椎木壒饰也磺宄?，所以?dǎo)致簽名驗(yàn)證一直失敗。后面我將app_id更換成H5支付的app_id,加密算法改成了RSA2算法，就解決簽名問(wèn)題了。

2.無(wú)效的app_id參數(shù)

這個(gè)問(wèn)題真的是不應(yīng)該犯的錯(cuò)誤，因?yàn)槲矣昧苏江h(huán)境的app_id，但是我地址卻使用了沙箱環(huán)境的地址，兩者不匹配導(dǎo)致的無(wú)效的app_id，我改成正式地址之后就解決這個(gè)問(wèn)題了。

可能是因?yàn)橹Ц秾毤傻谋容^好，我從當(dāng)面付支付改寫成H5支付沒有遇到什么比較困難的問(wèn)題，而且文檔寫的也比較清楚，支付寶H5支付相比于當(dāng)面付其實(shí)就是支付方式從alipay.trade.precreate改成了apipay.trade.wap.pay,以及biz_content添加一個(gè)product_code的固定參數(shù)，所以思路比較清晰，改寫起來(lái)沒有花費(fèi)特別多的時(shí)間就完成了。

到這里，支付寶H5端支付與微信H5端支付都完成了內(nèi)外網(wǎng)測(cè)試，解決了需求了。這篇文章就寫到這里了，謝謝觀看。