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–