MUI 框架微信支付
在MUI 框架中实现了支付宝支付后，以为MUI微信支付，也没什么大问题，结果这个问题困扰了我几天，后面再同事的提醒下终于弄出来了，
问题出在，开始使用Dcloud 公有证书 怎么也付不了。。。。，后面改成自己就OK了。。。。希望后来者看到此博，能节约一点时间。
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
mui.init();
mui.plusReady(function()
{
//定义支付通道
var channel = null;
//获取支付通道
getChannels();
//获取支付通道的方法
function getChannels()
{
plus.payment.getChannels(function(channels) {
for (var i = 0; i < channels.length; i++) {
if (channels[i].id == "wxpay") {
channel = channels[i];
}
}
plus.ui.toast("使用支付方式:" + channel.id);
}, function(e) {
plus.ui.toast("获取支付通道失败!");
console.log("获取支付通道失败!");
})
} //发起微信支付请求的方法
function pay(){
//获取微信支付参数的url
//var basic_url="http://microtivo.chinacloudapp.cn:9202/";
var basic_url='http://www.m.rfvip.cn:20677/WX/index?';
mui.ajax(basic_url,{
data:"",
dataType:"json",
type:"get",
success:ajax_success_callback,
error:ajax_error_callback
})
} //获取微信支付参数成功的回调函数
function ajax_success_callback(resObj)
{
console.log("请求微信支付参数成功,返回的json:");
var res_str=JSON.stringify(resObj);
console.log(res_str);
//用返回参数 发起微信支付请求
plus.payment.request(channel,res_str,wxpay_success,wxpay_error);
}
//获取微信支付参数失败的回调函数
function ajax_error_callback(e){
console.log("ajax获取参数失败");
}
//微信支付成功回调
function wxpay_success(result){
plus.ui.alert("支付成功!",function()
{
back();
})
}
//微信支付失败回调
function wxpay_error(error){
plus.ui.alert("支付失败!");
// plus.ui.alert(JSON.stringify(error));
// console.log(JSON.stringify(error));
}
//微信支付按钮 发起微信支付
document.getElementById("btn_pay").addEventListener("tap",function()
{
pay();
})
});
</script>
</head> <body>
<button id="btn_pay" class="mui-btn mui-btn-blue" style="margin-top: 400px;margin-left: 30%;">微信支付</button>
</body> </html>
之前测试预留
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet"/>
<script type="text/javascript" charset="utf-8">
mui.init();
var channel = null;
var channels = null;
// 1. 获取支付通道
function plusReady() {
// 获取支付通道
plus.payment.getChannels(function(cs) {
channels = cs; },
function(e) {
alert("获取支付通道失败：" + e.message);
});
}
document.addEventListener('plusready', plusReady, false);
// var ALIPAYSERVER = 'http://demo.dcloud.net.cn/helloh5/payment/alipay.php?total=';
//var WXPAYSERVER = 'http://www.m.rfvip.cn:20677/WX/index?payid=wxpay&appid=wx84f0ceea370f1748&total=1';
// var WXPAYSERVER = 'http://www.m.rfvip.cn:20677';
var WXPAYSERVER = 'http://demo.dcloud.net.cn/payment/?payid=wxpay&appid=HBuilder&total=1';
// 2. 发起支付请求
function pay(id) {
// 从服务器请求支付订单
var PAYSERVER = '';
if (id == 'wxpay') { PAYSERVER = WXPAYSERVER; }
console.log("id==>"+id);
console.log("payserver==>"+WXPAYSERVER);
for (var i in channels)
{
if (channels[i].id == id)
{
channel = channels[i];
}
}
mui.get(PAYSERVER, function(data) {
var varpay = {
appid: "wx0411fa6a39d61297",
noncestr: "oUn3BJl37NhyEPgf",
package: "Sign=WXPay",
partnerid: "1230636401",
prepayid: "wx20151203182611a03572a62d0054237692",
timestamp: "1449138371",
sign: "313966BE242897F2A82090190630A2D0"
} console.log("appid==>"+varpay.appid);
console.log("noncestr==>"+varpay.noncestr);
console.log("package==>"+varpay.package);
console.log("partnerid==>"+varpay.partnerid);
console.log("prepayid==>"+varpay.prepayid);
console.log("timestamp==>"+varpay.timestamp);
console.log("sign==>"+varpay.sign); plus.payment.request(channel, varpay, function(result) {
plus.nativeUI.alert("支付成功！", function() {
back();
});
}, function(e) {
plus.nativeUI.alert("支付失败：" + e.code + "支付失败：" + e.message);
console.log(e.code);
console.log(e.message);
});
}, "json"); /* xhr.open('GET',PAYSERVER);
xhr.send();*/
}
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">支付测试</h1>
</header>
<div class="mui-content">
<input type="button" class="btn btn-lg" id="pay" value="微信支付" onclick="pay('wxpay')" />
</div> </body>
</html>
MUI 框架微信支付的更多相关文章
- 【微信支付】公众号 JSAPI支付 HTML5(使用MUI前端框架)+WebApi 实现流程
必要参数: 1) AppID,AppSecret : 在微信公众号后台管理—>(菜单栏)开发 —> 基本设置 2)商户号 :在微信公众号后台管理—>(菜单栏)微信支 ...
- ***PHP基于H5的微信支付开发详解（CI框架）
这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,也就是在微信内的H5页面通过jsApi接口实现支付功能.当然了,微信官网上的微信支付开发文档也讲解的很详细,并且有实现代码可 ...
- Mui 微信支付、支付宝支付
利用mui 发起手机微信和支付宝支付 payStatement :调起微信支付接口的参数 参考文档: https://pay.weixin.qq.com/wiki/doc/api/app/app.ph ...
- Koa系框架（egg/cabloy）如何获取微信支付回调请求中的xml参数
背景 在Koa系框架(如EggJS)中进行微信支付开发时,遇到一个问题:微信支付平台会发送一个回调请求,通知支付订单的处理结果.该请求传入的参数是xml格式,而Koa中间件koa-bodyparser ...
- 微信支付——基于laravel框架的php实现
现在经手的几乎每个项目都支持微信支付,简单记录下接入的大致流程. 1.首先商户等申请各种账号,微信支付商户号,APPID,API密钥,Appsecret 2.app端上传支付需要的各个字段 3.后台收 ...
- 【原创分享·微信支付】C# MVC 微信支付教程系列之现金红包
微信支付教程系列之现金红包 最近最弄这个微信支付的功能,然后扫码.公众号支付,这些都做了,闲着无聊,就看了看微信支付的其他功能,发现还有一个叫“现金红包”的玩意,想 ...
- 【原创分享·微信支付】 C# MVC 微信支付教程系列之扫码支付
微信支付教程系列之扫码支付 今天,我们来一起探讨一下这个微信扫码支付.何为扫码支付呢?这里面,扫的码就是二维码了,就是我们经常扫一扫的那种二维码图片,例如,我们自己添 ...
- 【原创分享·微信支付】 C# MVC 微信支付教程系列之公众号支付
微信支付教程系列之公众号支付 今天,我们接着讲微信支付的系列教程,前面,我们讲了这个微信红包和扫码支付.现在,我们讲讲这个公众号支付.公众号支付的应用环境常见的用户通过公众号,然后再通 ...
- 【原创分享·微信支付】C# MVC 微信支付之微信模板消息推送
微信支付之微信模板消息推送 今天我要跟大家分享的是“模板消息”的推送,这玩意呢,你说用途嘛,那还是真真的牛逼呐.原因在哪?就是因为它是依赖微信生存的呀,所以他能不 ...
随机推荐
- C#: 数据绑定
数据绑定是分离UI和后端主逻辑程序的一种好的办法.这里总结下TextBox, Label, ComboBox, ListBox, DataGridView的数据绑定 数据绑定都是通过DB来和UI控件的 ...
- WOW: 宏
1.常用的宏命令 1.1常用的宏命令 1.释放技能命令 /cast 释放一个或多个技能,可以加入一些条件判断,是最常用的命令 /castsequence 依次释放释放数个技能,同样可以加入一些条件判断 ...
- HttpContext.Current 的缺陷
了解ASP.NET的开发人员都知道它有个非常强大的对象 HttpContext,而且为了方便,ASP.NET还为它提供了一个静态属性HttpContext.Current来访问它,今天的博客打算就从H ...
- ligerui_实际项目_001：利用ligerLayout、ligerAccordion实现可折叠的菜单效果
效果:利用ligerLayout.ligerAccordion实现可折叠的菜单效果 可能用到的js.css.images等,可到官网下载: 第01步:引入相应的文件 <head><l ...
- Struts2部署在Websphere上的问题
配置Mapped Filter:可以解决Struts2的项目部署在WebSphere6.1下面,发生Action找不到的情况. 应用程序服务器>[选择所使用的服务器]>Web 容器设置&g ...
- 【cruch bang】中切换成左手鼠标
在“右键”菜单->settings->Edit autostart启动的geany编辑器中,最后加内容: xmodmap -e 'pointer = 3 2 1'
- 三、Java基础---------关于继承、构造函数、静态代码块执行顺序示例讲解
在上节博客中曾提到过类的继承,这篇文章主要是介绍类的继承.构造函数以及静态代码块的执行顺序. 首先接着分析在黑马基础测试中的一个关于继承的题目,题目描述如下: 声明类Person,包含2个成员变量:n ...
- 赤手空拳编写C#代码
有时候服务器上并没有安装任何IDE或典型的代码编辑器,只能完全手写C#代码. 不妨假设一台全新的PC,较新版本的Windows自带了.net框架,无需开发工具即可编程了. 除了以往的Bat批处理.VB ...
- #import vs. @class
You #import or #include when there is a physical dependency. Otherwise, you use forward declarations ...
- iOS 判断相机权限是否被限制，判断相机是否可以使用
判断相机权限是否被限制 需要导入 AVFoundation 类 [objc] view plain copy #import <AVFoundation/AVFoundation.h> ...