【融職培訓(xùn)】Web前端學(xué)習(xí) 第11章 微信開發(fā)5 微信支付

一、概述

如果需要實現(xiàn)微信支付功能,需要有一個已認(rèn)證的微信服務(wù)號,并且開通微信支付,開通后微信會提供一個商戶ID。有了這個ID才能成功調(diào)用微信支付接口。

開通微信支付后,需要在微信支付后臺【產(chǎn)品中心】=>【開發(fā)配置】中配置【JSAPI支付授權(quán)目錄】和【Native支付回調(diào)鏈接】,如下圖所示:


微信支付可以分為兩種情況,微信瀏覽器之外的掃碼支付(需要配置Native支付回調(diào)鏈接,支付完成后,微信服務(wù)器會調(diào)用這個鏈接,并傳入?yún)?shù)。)和微信瀏覽器之內(nèi)直接支付(需要配置JSAPI支付授權(quán)目錄,只有這個域名下的鏈接才能調(diào)用支付接口)。兩種支付都需要調(diào)用【統(tǒng)一下單接口】。所以本節(jié)針對統(tǒng)一下單接口來分別講解如何實現(xiàn)這兩種支付方法。

一、統(tǒng)一下單接口

通過調(diào)用下面的統(tǒng)一下單接口,就可以實現(xiàn)微信支付功能。

https://api.mch.weixin.qq.com/pay/unifiedorder

統(tǒng)一下單接口需要傳入的參數(shù)包括如下內(nèi)容(以下為必填項),并且參數(shù)要為xml格式:

appid:公眾號id

body:商品描述

mch_id:商戶號id

nonce_str:隨機(jī)字符串

notify_url:異步接收微信支付結(jié)果通知的回調(diào)地址,通知url必須為外網(wǎng)可訪問的url,不能攜帶參數(shù)。

openid:用戶標(biāo)識

out_trade_no:商戶訂單號

spbill_create_ip:終端IP

total_fee:訂單總金額,單位為分

trade_type:交易類型JSAPI 、NATIVE、APP

sign:簽名

獲取簽名的規(guī)則與之前JS-SDK的簽名規(guī)則相同,字段除了上述1-10十個字段外,還需要添加一個微信商戶后臺獲取的key(【賬戶中心】=》【API安全】獲?。?/p>

二、統(tǒng)一下單接口的返回值

交易類型為【JSAPI】

返回的xml格式會包含一個prepay_id。然后將這個值傳遞給前端,再由前端調(diào)用jsapi完成支付,示例代碼如下所示:

1document.querySelector(".pay").onclick =function(){ 2function onBridgeReady() { 3? ? ? ? WeixinJSBridge.invoke( 4'getBrandWCPayRequest', { 5"appId": `{{appId}}`,//公眾號名稱,由商戶傳入 6"timeStamp": `{{timeStamp}}`,//時間戳,自1970年以來的秒數(shù) 7"nonceStr": `{{nonceStr}}`,//隨機(jī)串 8"package": `{{package}}`, 9"signType": `{{signType}}`,//微信簽名方式:10"paySign": `{{paySign}}`//微信簽名11? ? ? ? ? ? },12function (res) {13if(res.err_msg == "get_brand_wcpay_request:ok") {14// 使用以上方式判斷前端返回,微信團(tuán)隊鄭重提示:15//res.err_msg將在用戶支付成功后返回ok,但并不保證它絕對可靠。16location.href="/success"17? ? ? ? ? ? ? ? }18? ? ? ? ? ? });19? ? }20if(typeofWeixinJSBridge == "undefined") {21if (document.addEventListener) {22document.addEventListener('WeixinJSBridgeReady', onBridgeReady,false);23}elseif (document.attachEvent) {24document.attachEvent('WeixinJSBridgeReady', onBridgeReady);25document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);26? ? ? ? }27}else {28? ? ? ? onBridgeReady();29? ? }30}

交易類型為【NATIVE】

返回的結(jié)果包括一個code_url字段,將這個字段的值傳遞給前端,然后轉(zhuǎn)換成二維碼,用戶掃碼即刻完成支付。

三、完成支付

完成支付后,微信服務(wù)器會向notify_url的參數(shù)地址發(fā)送一個支付結(jié)果的消息。網(wǎng)站或公眾號程序可以根據(jù)返回結(jié)果,自行處理支付完成后的業(yè)務(wù)邏輯。


【融職教育】在工作中學(xué)習(xí),在學(xué)習(xí)中工作

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容