微信開發(fā)中如何實現(xiàn)微信支付接入-創(chuàng)新互聯(lián)

小編給大家分享一下微信開發(fā)中如何實現(xiàn)微信支付接入，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都創(chuàng)新互聯(lián)公司長期為1000+客戶提供的網(wǎng)站建設(shè)服務(wù)，團隊從業(yè)經(jīng)驗10年，關(guān)注不同地域、不同群體，并針對不同對象提供差異化的產(chǎn)品和服務(wù)；打造開放共贏平臺，與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為內(nèi)江企業(yè)提供專業(yè)的成都做網(wǎng)站、網(wǎng)站制作，內(nèi)江網(wǎng)站改版等技術(shù)服務(wù)。擁有10多年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。

今早收到微信通知，昨天申請的微信支付的接入申請已經(jīng)通過，顧早上的時候就順便把微信支付給接入了。由于之前我就使用 Ping++ 接入了支付寶的即時到賬服務(wù)，所以在這個基礎(chǔ)上增加一個微信支付的接入，想想就是分分鐘的事情。

配置 Ping++ 后臺

待你申請的微信支付通過之后，你會拿到四個非常關(guān)鍵的信息。

配置正確之后，需要簡單地修改后端發(fā)起支付的代碼，因為支付寶和微信支付在 Ping++ 的系統(tǒng)中是有細微的差別的，具體是 extra 這個參數(shù)的區(qū)別：使用支付寶即時到賬的時候，在 extra 部分需要傳入 success_url 作為同步跳轉(zhuǎn)需要，而微信支付則需要在 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 重構(gòu)了支付的組件，所以在增加微信之后的時候就是加一些條件判斷就OK，不過需要特別注意一點就是，微信支付是只支持掃碼的，并沒有什么跳轉(zhuǎn)鏈接的概念，所以我們需要一個處理二維碼的庫，這里就可以直接使用我之前推薦的 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';
        }
    })
},

這樣在展示二維碼的時候就可以這樣：

<div v-show="status == 'paying'">
    <p v-show="channel == 'wx_pub_qr'">
        <qrcode 
         :value="qrcodeUrl"
         v-if="qrcodeUrl"
        :options="{ size: 170 }">
        </qrcode>
    </p>
    <p>請使用微信掃碼支付</p>
</div>

這樣用戶就可以在選擇微信支付的時候，正確看到微信收款的二維碼了！兩分鐘！

以上是“微信開發(fā)中如何實現(xiàn)微信支付接入”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學習更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享名稱：微信開發(fā)中如何實現(xiàn)微信支付接入-創(chuàng)新互聯(lián)
文章源于：http://bm7419.com/article44/cecghe.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站導航、網(wǎng)站設(shè)計公司、用戶體驗、企業(yè)建站、定制網(wǎng)站、域名注冊

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容