MUI 支付插件配置

发布于 2020-11-11  74 次阅读


HBuilder应用配置
分享插件添加方法具体步骤如下:

  1. 点击manifest.json文件的“代码视图”,在permissions节点下添加Payment节点:
    1.在plus -> distribute -> plugins 节点下添加payment节点:
    alipay节点下配置支付宝相关信息
    scheme值为iOS平台调用支付宝的“快捷支付”应用返回时用到的标识,推荐使用小写字符串。
    weixin节点下配置微信支付相关信息
    appid值为在微信开放平台申请应用的AppID值。
    appleiap节点下配置苹果应用内支付相关信息
    在HBuilder基座中无法使用此支付通道,需要提交云端打包才可使用。
    支付宝功能申请
    登录支付宝账号,创建应用接入支付宝App支付能力,包括以下步骤:
  2. 创建应用(获取appid)
  3. 开通App支付功能
  4. 配置密钥(获取公钥、私钥)
    参考支付宝官方文档App支付快速接入

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

微信支付功能申请

使用微信支付功能需到微信开放平台申请移动应用并开通支付功能
微信APP支付接入商户服务中心
申请应用后可以获取AppID和AppSecret值。
开通支付功能后可获取支付业务服务器配置数据
PARTNER:财付通商户号
PARTNER_KEY:财付通密钥
PAYSIGNKEY:支付签名密钥
服务器生成订单示例(PHP)
参考示例代码微信支付V3

应用内支付(IAP)使用说明
IOS 应用内支付接口使用说明

前端示例代码

var wxChannel = null; // 微信支付  
var aliChannel = null; // 支付宝支付  
var channel = null;   //支付通道 
var ALIPAYSERVER=H_SRC+'/index.php/index/Alipay/zfb'; //后台提供支付宝
var WXPAYSERVER=H_SRC+'/index.php/index/wxpay/wechat'; //后台提供微信
var PAYSERVER='';
mui.plusReady(function(){ 
     // 获取支付通道
    plus.payment.getChannels(function(channels){
        for(var i in channels){
            if(channels[i].id == "wxpay"){
                wxChannel = channels[i];
            }else{
                aliChannel = channels[i];
            }
        }
    },function(e) {
        alert("获取支付通道失败:" + e.message);
    });
});
mui('body').on('tap','#play',function(){
    var pay_type=$('.mui-input-group input:checked').val();
    if(pay_type==1){
        payshow();//余额支付
    }
    if(pay_type==2){
        pay('wxpay');
    }
    if(pay_type==3){
        pay('alipay'); 
    }
})
// 2. 发起支付请求
function pay(id){ 
   // 从服务器请求支付订单
   if(id=='alipay'){
       PAYSERVER=ALIPAYSERVER;
       channel = aliChannel;
   }else if(id=='wxpay'){
       PAYSERVER=WXPAYSERVER;
       channel = wxChannel;
   }else{
       plus.nativeUI.alert("不支持此支付通道!",null,"捐赠");
       return;
   } 
   mui.ajax(PAYSERVER,{
        data:{
        },
        dataType:'json',//服务器返回json格式数据
        type:'post',//HTTP请求类型
        timeout:10000,//超时时间设置为10秒;
        headers:{'Authorization':token},  
        success:function(data){
            plus.payment.request(channel,data,function(result){
                plus.nativeUI.alert("支付成功!",function(){
                    mui.toast('支付成功!');
                });
            },function(error){
                //plus.nativeUI.alert("支付失败:" + error.code);
                mui.toast("支付失败");
            });
        },
        error:function(xhr,type,errorThrown){
          //异常处理;
          console.log(type);
          }
    });
}

一沙一世界,一花一天堂。君掌盛无边,刹那成永恒。