一下是我调用支付插件 的完整页面代码,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<title>账号信息</title>
<link rel="stylesheet" href="../css/mui.min.css">
<link rel="stylesheet" type="text/css" href="../css/style.css"/>
<link rel="stylesheet" type="text/css" href="../css/page.css"/>
<link rel="stylesheet" type="text/css" href="../css/feedback-page.css" />
</head>
<body>
<!--页面主结构开始-->
<div id="memberinfo" class="mui-views">
<div class="mui-view">
<div class="mui-navbar">
</div>
<div class="mui-pages">
</div>
</div>
</div>
<div id="countinfo" class="mui-page">
<!--页面标题栏开始-->
<div class="mui-navbar-inner mui-bar mui-bar-nav">
<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
<span class="mui-icon mui-icon-left-nav"></span>
</button>
<h1 class="mui-center mui-title">余额充值</h1>
</div>
<!--页面标题栏结束-->
<!--页面主内容区开始-->
<div class="mui-page-content">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view">
<li class="mui-table-view-divider">管理钱包</li>
<li class="mui-table-view-cell">
我的钱包余额:<span class="mui-pull-right">
<b id="info_money">{{userfen}}</b> 元</span>
</li>
</ul>
<div class="mui-content-padded">
<ul class="mui-table-view">
<li class="mui-table-view-divider">选择充值套餐:</li>
<li class="mui-table-view-cell mui-radio">
<span>一年VIP套餐 1800元</span>
<input type="radio" name="money" value="1800" />
</li>
<li class="mui-table-view-cell mui-radio">
<span>十次信息发布 200元</span>
<input type="radio" name="money" value="200" />
</li>
<li class="mui-table-view-divider">
不需要套餐,充值其他金额<br/>请输入充值金额:单位(元)</li>
<li class="mui-table-view-cell">
<input type="number" name="inputmoney" value="" placeholder="请输入数字,比如:10"/>
</li>
</ul>
</div>
<div class="mui-content-padded" id="button_div">
</div>
</div>
</div>
</div>
</div>
<script src="../js/mui.min.js "></script>
<script src="../js/mui.view.js"></script>
<script src="../js/zepto.min.js"></script>
<script src="../js/config.js"></script>
<script src="../js/vue.min.js"></script>
<script>
//初始化单页view
var viewApi = mui('#memberinfo').view({
defaultPage: '#countinfo'
});
//初始化单页的区域滚动
mui('.mui-scroll-wrapper').scroll();
var view = viewApi.view;
(function($) {
//处理view的后退与webview后退
var oldBack = $.back;
$.back = function() {
if (viewApi.canBack()) { //如果view可以后退,则执行view的后退
viewApi.back();
} else { //执行webview后退
oldBack();
}
};
})(mui);
//数据模型
var vmd = new Vue({
el : '#countinfo',
data : {
userfen : '',
}
})
//支付列表
var pay_channel = null;
mui.plusReady(function() {
//获取数据
var users = get_userinfo(true,'../');
var form_data = users[0];
//获取支付通道
plus.payment.getChannels(function(channels){
var str = '';
mui.each(channels, function(index, channel){
if(channel.id =='alipay'){
pay_channel = channel;
str += '<a onclick="orderpay(\''+ channel.id +'\')" class="mui-btn mui-btn-warning mui-btn-block"> '+channel.description+'在线付款 </a>';
}
})
document.getElementById('button_div').innerHTML = str;
},function(e){
plus.nativeUI.alert("获取支付通道失败:"+e.message);
});
//=======
mui.ajax(_config.url + 'e/kbtool/member.php',{
data : form_data,
dataType : "json",
type : 'POST',
success : function(json){
//console.log(JSON.stringify(json))
if(json.code ==1){
setinfo(json);
}else{
plus.nativeUI.alert('数据获取失败');
}
},
error : function(xhr, error){ plus.nativeUI.alert('数据获取失败') }
});
})
//支付宝获取订单信息
function orderpay(paytype)
{
var inputmoney = Zepto("input[name='inputmoney']").val();
var selectmoney = Zepto('input[name="money"]:checked').val();
var paymoney = 0;
if(parseInt(inputmoney * 100) > 0){
paymoney = inputmoney;
}else{
if(parseInt(selectmoney) > 0){
paymoney = selectmoney;
}
}
if(parseInt(paymoney * 100) > 0){
//调用接口支付
serverpayapi(paytype, paymoney);
}else{
plus.nativeUI.alert("请选择充值套餐,或者输入充值金额");
}
}
function serverpayapi(paytype, paymoney)
{
var users = get_userinfo();
var form_data = users[0];
form_data.money = paymoney;
//console.log(JSON.stringify(form_data))
mui.ajax(_config.url + 'e/kbtool/api.php?enews=alipay',{type:'POST',dataType : 'html',
data : {username : form_data.username, password : form_data.password, money : paymoney},
success: function(data){
app_pay_plus(data)
}
})
}
function app_pay_plus(sign)
{
plus.payment.request(pay_channel, sign, function(result){
plus.nativeUI.alert("支付成功!",function(){
back();
});
},function(error){
plus.nativeUI.alert("支付失败:" + error.code);
});
}
//=========
function setinfo(json){
//填充表单
vmd.$data.userfen = json.data['userfen'] ;
}
//保存修改的资料
function saveinfo()
{//获取数据
var users = JSON.parse( _localdata.getItem('$member') || '[]');
var form_data = $("#form_info").serialize_json();
form_data = $.extend(form_data, users[0]);
console.log(JSON.stringify(form_data))
mui.ajax(_config.url + 'e/kbtool/eidtinfo.php',{
data : form_data,
dataType : "json",
type : 'POST',
success : function(json){
if(json.code ==1){
setinfo(json);
plus.nativeUI.toast('保存成功');
viewApi.back();
}else{
plus.nativeUI.toast('保存失败');
viewApi.back();
}
},
error : function(xhr, error){ plus.nativeUI.toast('数据获取失败') }
});
}
</script>
</body>
</html>
3 个回复
四月技术伍成才 (作者)
rsa_public_key.pem 公钥文件用法:
登陆支付宝商户中心,选择查看KEY ,
会在这个页面里,支付宝有 上传你的公钥 和查看支付宝公钥的地方。
点击上传公钥链接,在弹出的对话框里,把 这个文件里的内容 (字符串部分) 填入 ,然后即可生成支付宝公钥。这个支付宝公钥 是用来 验证 从支付宝通知回来的消息是否正确的一个 公钥。
在php 语言里 ,是这样写这个公钥的用法的:
四月技术伍成才 (作者)
pkcs8.pem 文件的用法:
这个 是当你做原生android开发的时候,发送给支付宝接口的订单数据 在客户端app里生成的时候,需要对订单数据 用pkcs8.pem里面的密钥进行加密;
在Builder 开发支付插件时,不需要用这个文件,里的内容。
因为 我们的订单数据是在服务器端,和接受支付宝回调通知消息的服务器端 放在一起。
四月技术伍成才 (作者)
一下是我调用支付插件 的完整页面代码,