puls.payment支付
先是介紹下什么是HBuilder
為什么要介紹呢,因為可能以前用過了,然后忘記了,甚至哪里安裝包下載也不知道。
使用HBuilder安裝App,可以看下文檔,我這邊是用5+,也就是打包的時候添加一個plus對象而已,什么都不用做,只是這個注冊需要時間,監聽下就可以,然后就可以使用了。
我看了蠻多文檔,寫的亂七八糟,本來就很簡單的東西。
而5+的安裝,可以目錄工程獲取(其實就是新增一個manifest.json文件)。
介紹完成,開始安裝
從上面的信息可以得出,我們先需要這個安裝包。
因為manifest.json文件我們可以生成也可以填寫,但是打包就麻煩了。里面打包分云打包和本地打包。(本地打包相對安全點)
下載http://www.dcloud.io/進入官網,然后
點擊HBuilderX,然后就可以了。
安裝完成之后,就可以開啟項目了。
這樣新建一個空工程。
(里面會有一個manifest.json可以指定html文件。如果是SPA應用請取打包后文件,修改開始位置就好了)
然后會有manifest.json文件,點擊這個文件,會有可視化填寫區域,鉤上支付就可以了。
支付有微信等,其中支付寶不需要appid,而微信需要appid。(對此我不是很懂,為什么需要appid???,后期寫入不就可以了么,非要一開始就寫。)
安裝需要什么呢,先獲取支付通道。
什么是支付通道? 文檔沒講,說的是支付通道。
我們主觀上可以猜出,這個是支付安裝狀態列表
,用來判斷支不支持xx支付。
好吧,猜對了。
獲取支付通道
void plus.payment.getChannels(successCB, errorCB);
看下cb是啥。
就是列表,對了,列表長什么? 文檔沒講,估計是讓你去試。好吧,這是我打印的結果:
[
{"id":"alipay","description":"支付寶","serviceReady":true},
{"id":"wxpay","description":"微信","serviceReady":true}
]
看到這里就明白了,哦,??原來是這么一回事啊,就這么簡單。
serviceReady
核心,看是否支持支付方式。
然后發起支付就OJBK了。
在吊起之前,我們需要判斷是否找到對應的支付。
比如我這樣寫
let c = channels.find(e => e.id === 'alipay') || {serviceReady: false}
然后判斷 c.serviceReady不成立就是不支持了
支付吊起方式
void plus.payment.request(channel, statement, successCB, errorCB);
第一個呢,就是支付通道,第二個就是對應的內容(里面是any類型,具體看業務和方式了,也就是后臺配合的數據了。【可以string,也可以obj】)
看到這里也知道為什么第一個參數需要支付通道了,因為它要去里面取id字段,判斷是哪個支付。
--OK--
執行支付
這時候放棄支付,或者支付成功都可以監聽到的。在回調里面哦。
最后放上不包含業務邏輯的代碼
window.plus.payment.getChannels((channels) => {
try {
let c = channels.find(e => e.id === 'alipay') || {serviceReady: false}
if(!c.serviceReady){
console.log('未安裝支付寶')
return
}
window.plus.payment.request(c, payData, () => {
alert("支付操作成功!")
}, function(e){
alert("支付失敗:"+e.message)
} )
} catch (error) {
console.log('異常')
console.log(error)
}
}, function(e){
alert("獲取支付通道列表失敗:"+e.message)
})
好了,祝你生活愉快,再見??。
Tip:
如果出現無反應,很有可能是哪個報錯了, 寫個try監聽下
附上原文路徑,遇到問題直接看官方文檔。
http://www.html5plus.org/doc/zh_cn/payment.html#plus.payment.ChannelsSuccessCallback
--END--