DCloud_App_Array
DCloud_App_Array
  • 发布:2014-10-17 18:40
  • 更新:2020-01-10 16:51
  • 阅读:207935

支付插件配置

分类:HTML5+

plus的支付API,支持支付宝App支付(移动快捷支付)、微信支付和苹果的IAP应用内支付。
配置参数需要提交云端打包后才能生效,如果需要真机运行生效请使用自定义基座

开发指导

支付流程如下:
支付流程图

plus API使用步骤:

  1. 调用plus.payment.getChannels()获取系统支持的支付通道;
  2. 调用plus.payment.request()发起支付请求。

示例代码

var channel=null;  
// 1. 获取支付通道  
function plusReady(){ //uni-app中将此function里的代码放入vue页面的onLoad生命周期中  
    // 获取支付通道  
    plus.payment.getChannels(function(channels){  
        channel=channels[0];  
    },function(e){  
        alert("获取支付通道失败:"+e.message);  
    });  
}  
document.addEventListener('plusready',plusReady,false);//uni-app不需要此代码  

var ALIPAYSERVER='http://demo.dcloud.net.cn/helloh5/payment/alipay.php?total=';  
var WXPAYSERVER='http://demo.dcloud.net.cn/helloh5/payment/wxpay.php?total=';  
// 2. 发起支付请求  
function pay(id){  
    // 从服务器请求支付订单  
    var PAYSERVER='';  
    if(id=='alipay'){  
        PAYSERVER=ALIPAYSERVER;  
    }else if(id=='wxpay'){  
        PAYSERVER=WXPAYSERVER;  
    }else{  
        plus.nativeUI.alert("不支持此支付通道!",null,"捐赠");  
        return;  
    }  
    var xhr=new XMLHttpRequest(); //uni-app中请使用uni的request api联网  
    xhr.onreadystatechange=function(){  
        switch(xhr.readyState){  
            case 4:  
            if(xhr.status==200){  
                plus.payment.request(channel,xhr.responseText,function(result){  
                    plus.nativeUI.alert("支付成功!",function(){  
                        back();  
                    });  
                },function(error){  
                    plus.nativeUI.alert("支付失败:" + error.code);  
                });  
            }else{  
                alert("获取订单信息失败!");  
            }  
            break;  
            default:  
            break;  
        }  
    }  
    xhr.open('GET',PAYSERVER);  
    xhr.send();  
}

注:第二步中获取到的订单数据需要在服务器通过支付宝平台获取PID和密钥生成。

HBuilder应用配置

支付插件添加方法具体步骤如下:

  1. 点击manifest.json文件,可以在可视化界面的模块配置中勾选支付模块。也可以在“代码视图”的permissions节点下添加Payment节点:

    • 5+App、wap2app配置图:
      manifest.json添加支付权限
    • uni-app配置图
    • 离线打包需要注意选择好支付模块
  2. 在manifest.json可视化界面的sdk配置中配置支付参数:

    • 5+App、wap2app配置图:
      manifest.json添加支付权限
    • uni-app配置图
    • 离线打包需要自行在原生工程中配置好参数

alipay节点下配置支付宝相关信息
scheme值是本App的scheme,用于iOS平台调用支付宝的“快捷支付”返回时用到的标识,推荐使用小写字符串。新版HBuilderX已经不需要配置此scheme,云打包自动分配处理了。关于如何为本App设置scheme,参考
weixin节点下配置微信支付相关信息
appid:微信开放平台申请应用的AppID值;
UniversalLinks:iOS平台通用链接,必须与微信开放平台配置的一致,参考iOS平台微信SDK配置通用链接(Universal Links)
appleiap节点下配置苹果应用内支付相关信息
在HBuilder基座中无法使用此支付通道,需要提交云端打包才可使用。

支付宝功能申请

登录支付宝账号,创建应用接入支付宝App支付能力,包括以下步骤:

  1. 创建应用(获取appid)
  2. 开通App支付功能
  3. 配置密钥(获取公钥、私钥)
    参考支付宝官方文档App支付快速接入

服务器生成订单示例(PHP)
参考示例代码支付宝App支付生成支付订单
老版本“移动快捷支付”参考示例代码支付宝移动快捷支付
C#生成支付宝订单示例

微信支付功能申请

  1. 使用微信支付功能需到微信开放平台申请移动应用并开通支付功能
    微信APP支付接入商户服务中心
    申请应用后可以获取AppID和AppSecret值。

  2. 开通支付功能后可获取支付业务服务器配置数据
    PARTNER:财付通商户号
    PARTNER_KEY:财付通密钥
    PAYSIGNKEY:支付签名密钥

服务器生成订单示例(PHP)
参考示例代码微信支付V3

苹果应用内支付(IAP)使用详细说明

IOS 应用内支付接口使用说明

12 关注 分享
Curtis Elijah 木记 你就浅浅一笑 扯淡1992 Trust 583181142@qq.com connor 赤鹰 skysowe 莫迁若 chinakungkung

要回复文章请先登录注册

lihuimi_vip@163.com

lihuimi_vip@163.com

回复 chinakungkung:
您好,请教一下您【支付通道怎么获取不到】
2020-01-10 16:51
lihuimi_vip@163.com

lihuimi_vip@163.com

回复 875848407@qq.com:
我也遇到这个问题,请问您解决了吗
2020-01-10 16:49
Loco_T

Loco_T

支付宝支付 后台需要哪些参数
2020-01-03 20:01
Loco_T

Loco_T

回复 lsl_0627@163.com:
老哥 java后台怎么写 我现在一脸懵
2020-01-03 18:47
1034692453@qq.com

1034692453@qq.com

在什么地方写提交给后端的代码呢
2019-12-26 15:30
81603985@qq.com

81603985@qq.com

回复 2929588484@qq.com:
我们也收到同样的问题,楼主解决了码?
2019-12-17 11:32
2929588484@qq.com

2929588484@qq.com

HX 的 基座版本 2.4.2,支付宝的SDK版本是多少,现在我们收到邮件说支付宝SDK版本过低
2019-12-12 11:29
270726401@qq.com

270726401@qq.com

调支付宝2.0支付接口,前端h5谁会
2019-12-10 15:15
875848407@qq.com

875848407@qq.com

plus.payment.getChannels(function(channels) {
console.log(channels, '123')
}, function(e){
alert("获取支付通道列表失败:"+e.message);
})支付通道怎么获取不到 有人知道吗
2019-12-09 16:54
梦亦

梦亦

plus.payment.request 走不进来啊
2019-11-25 17:32