重慶分公司,新征程啟航
為企業提供網站建設、域名注冊、服務器等服務
為企業提供網站建設、域名注冊、服務器等服務
小編給大家分享一下微信開發中如何實現微信支付接入,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
今早收到微信通知,昨天申請的微信支付的接入申請已經通過,顧早上的時候就順便把微信支付給接入了。由于之前我就使用 Ping++ 接入了支付寶的即時到賬服務,所以在這個基礎上增加一個微信支付的接入,想想就是分分鐘的事情。
配置 Ping++ 后臺
待你申請的微信支付通過之后,你會拿到四個非常關鍵的信息。
配置正確之后,需要簡單地修改后端發起支付的代碼,因為支付寶和微信支付在 Ping++ 的系統中是有細微的差別的,具體是 extra 這個參數的區別:使用支付寶即時到賬的時候,在 extra 部分需要傳入 success_url 作為同步跳轉需要,而微信支付則需要在 extra 字段傳入對于的 product_id ,這部分的代碼可以這樣:
switch ( $channel ) { case 'alipay_pc_direct' : $extra['success_url'] = url('/payment/done'); break; case 'wx_pub_qr': $extra['product_id'] = $this->wechatOrder(); break; default: //more extra comes here}
這部分我認為是一分鐘就可以搞定!
修改前端代碼
到這里,其實只留了兩分鐘給前端了,不過這個足矣。因為我之前使用 Vuejs 重構了支付的組件,所以在增加微信之后的時候就是加一些條件判斷就OK,不過需要特別注意一點就是,微信支付是只支持掃碼的,并沒有什么跳轉鏈接的概念,所以我們需要一個處理二維碼的庫,這里就可以直接使用我之前推薦的 vue-qrcode 的了。
then((response) => { if(this.channel === 'wx_pub_qr') { this.status = 'paying'; this.qrcodeUrl = response.data.credential.wx_pub_qr; this.timeId = setInterval(() => { if (this.status == 'success') { clearInterval(this.timeId); } this.checkPaymentDone(response.data.id); }, 5000) } } checkPaymentDone(chargeId) { axios.post('/payment/check', { chargeId: chargeId }).catch(error => { this.status = 'exception'; }).then(response => { if (response.data.finished) { this.status = 'success'; } }) },
這樣在展示二維碼的時候就可以這樣:
請使用微信掃碼支付
這樣用戶就可以在選擇微信支付的時候,正確看到微信收款的二維碼了!兩分鐘!
以上是“微信開發中如何實現微信支付接入”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注創新互聯行業資訊頻道!