• HTML5 开发APP( 支付宝支付)


         我们搞app有一个重要的功能那就是支付功能。无论是微信支付,支付宝,还是银联支付总要有一样支付手段来支持我们网上付款。实现完整的功能。我们公司app的支付方式经过大家开会讨论选择了支付宝支付(其实是当时的条件只能实现支付宝支付(手动哈士奇))。我近期整理了一下我的支付dome决定写出来给有需要的小伙伴。

           准备工作就是要去申请  。你得去蚂蚁金服开放平台申请一个应用,地址:https://openhome.alipay.com注册一个应用。申请根据步骤一步一步来很简单。留下官方教程和传送门http://ask.dcloud.net.cn/article/71

    申请完成以后开始我们的前端代码。(我本身是有混合支付的,这个dome是删除了混合支付的)。++++++++++++

    var aliChannel = null; // 支付宝支付
    var channel = null; //支付通道
    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);
    });
    })
    var ALIPAYSERVER = 'http://*****************/alipay/alipay.php?total=';//自己的后台的配置文件(我下一篇会放一个PHP实例),需要写订单信息等等在我的alipay.php中有讲解
    // 2. 发起支付请求
    function pay(id) {
    var ZongJia = document.getElementById("ZongJia").textContent;//我自己的存放应付的金额的元素
    // 从服务器请求支付订单
    var PAYSERVER = '';
    PAYSERVER = ALIPAYSERVER;
    channel = aliChannel;
    var xhr = new XMLHttpRequest();
    var amount = ZongJia;//amount变量表示要支付的金额;
    xhr.onreadystatechange = function() {
    switch(xhr.readyState) {
    case 4:
    if(xhr.status == 200) {
    plus.payment.request(channel, xhr.responseText, function(result) {
    plus.nativeUI.alert("支付成功!", function() {
    //这里根据自己的需求写支付成功的函数

    });
    }, function(error) {
    plus.nativeUI.alert("支付失败:" + error.code);
    });
    } else {
    alert("获取订单信息失败!");
    }
    break;
    default:
    break;
    }
    }
    xhr.open('GET', PAYSERVER + amount);
    xhr.send();
    }

     最后在需要的地方调用  pay('alipay'); 就ok了。我会在下一篇写下我的后台代码实例。

  • 相关阅读:
    51. (转) Android学习路线
    Java字符串操作汇总
    49.Android中线程同步异步方式小结
    (转) Java多线程同步与异步
    (转) 40个Java多线程问题总结
    48.Android中android studio导入ApiDemos 问题小结
    47.Android View的加载过程 (转)
    46.Android View绘制过程 (转)
    45.Android 第三方开源库收集整理(转)
    三级联动
  • 原文地址:https://www.cnblogs.com/wangercha/p/7253551.html
Copyright © 2020-2023  润新知