我们搞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了。我会在下一篇写下我的后台代码实例。

HTML5 开发APP( 支付宝支付)的更多相关文章

  1. ThinkPHP5.0 实现 app支付宝支付功能

    前几天做项目,要求要用到支付宝接口,第一次做,弄了好几天 各种坑啊,简单写一下我做支付宝支付的过程,希望对也是第一次做支付宝支付的童鞋有帮助, 不懂的可以先去支付平台看一下支付宝支付的文档,我是下的d ...

  2. APP支付宝支付接入

    1.app支付简介 买家可以在手机,掌上电脑等无线设备的应用程序内,通过支付宝(支付宝app或网页版支付宝)付款购买商品,且资金实行实时到账. 2.申请条件 1.申请前必须拥有经过实名认证的支付宝账户 ...

  3. iOS开发系列-支付宝支付

    概述 开发中支付通常都会集成支付宝支付,下面讲解支付宝的整体流程. 集成支付宝支付的流程 签约 与支付签约,得到获取商户的ID(partner).账户ID(seller).私钥privateKey. ...

  4. HTML5 开发APP(打开相册以及图片上传)

    我们开发app,常常会遇到让用户上传文件的功能.比如让用户上传头像.我公司的业务要求是让用户上传支付宝收款二维码,来实现用户提现的功能.想要调用相册要靠HTML Plus来实现.先上效果图 基本功能是 ...

  5. app支付宝支付java服务端代码

    app支付java服务端生成支付单文档 public String aliPay(String amount,Map<String,Object> body){ //实例化客户端 Alip ...

  6. App支付宝支付--PHP处理代码

    /* *生成APP支付订单信息 * @param number uid 用户id * @param string token 用户token * @param number oid 订单id * @p ...

  7. TinkPHP框架开发的CRMEB小程序商城v4.0二次开发集成支付宝支付

    前言 大家都知道支付宝支付和微信支付宝都只能局限在自己的平台,微信内支付宝支付是根本就不能使用,即使是公众号支付也需要跳转到外部浏览器才可以唤起支付宝支付,并且QQ浏览器唤起支付宝支付还是问题很多,所 ...

  8. HTML5 开发APP(头部和底部选项卡)

    我们开发app有一定固定的样式,比如头部和底部选项卡部分就是公共部分就比如我在做的app进来的主页面就像图片显示的那样 我们该怎么实现呢,实现我们应该建一个主页面index.html,然后建五个子页面 ...

  9. HTML5 开发APP( 环境配置)

    上一篇我写了关于新建项目,这一篇说一下配置环境我们新建一个移动app后,会发现一个mainifest.json文件,开发app所要配置的环境就在这个文件里 点击打开文件后会有配置界面,在配置界面的下方 ...

随机推荐

  1. JavaScript函数之递归

    递归 递归的本质就是使用函数自身来解决问题的思路. 递归的定义(摘): 程序调用自身的编程技巧称为递归( recursion).递归做为一种算法在程序设计语言中广泛应用. 一个过程或函数在其定义或说明 ...

  2. H5个性三级联动日期插件(一)

    1. 先看效果:如图 2.如果跟你的需求一样的话,那就抓紧down(当)起来吧! 首先你的页面可能需要很多的开发需求文件: jquery,mobiscroll 等js框架插件等 自己参照官方的demo ...

  3. 【CC2530入门教程-05】CC2530的串行接口原理与应用

    第5课  CC2530的串行接口原理与应用 广东职业技术学院  欧浩源 一.并行通信与串行通信 微控制器与外设之间的数据通信,根据连线结构和传送方式的不同,可以分为两种:并行通信和串行通信. 并行通信 ...

  4. 【LeetCode】309. Best Time to Buy and Sell Stock with Cooldown

    题目: Say you have an array for which the ith element is the price of a given stock on day i. Design a ...

  5. 跨进程通信之Messenger

    1.简介 Messenger,顾名思义即为信使,通过它可以在不同进程中传递Message对象,通过在Message中放入我们需要的入局,就可以轻松实现数据的跨进程传递了.Messenger是一种轻量级 ...

  6. linq中日期格式转换或者比较,程序报错说不支持方法的解决办法

    public void TestMethod1(){using (var _context = new hotelEntities()){var rq = DateTime.Now.Date;var ...

  7. 异常:java.lang.NoSuchMethodError: org.apache.poi.ss.usermodel.Workbook.getCellStyleAt

    背景 最近公司所有新项目要使用最新高效快速开发框架nature-framework,框架本身结合NatureMap已经集成excel的高效导入功能,我们要实现高性能的导出功能,因为最新的jxls-2. ...

  8. 怎样把echarts图表做成响应式的

    如果想要把echarts图表给做成响应式的那么就应该用rem 单位,给图表的外围容器设置rem 单位,然后调用jquery 的resize方法,$(window).resize(function(){ ...

  9. java中方法的定义

    所谓的方法(将方法称为函数)指的就是一段可以被重复调用的代码块. 对于方法的返回值类型有两种使用形式: · 有数据返回:返回值类型就使用 Java 中定义的数据类型: · 无数据返回:使用 void ...

  10. 妙用Outlook2003群发商业邮件

    妙用Outlook2003群发商业邮件   我们知道,如果需要在Outlook 2003中向多个对象发送邮件,那么只需要在指定收件人时用分号输入多个邮件地址或者使用抄送方式即可:假如对象较多,可以使用 ...