1.安装插件

ionic plugin add https://github.com/mrwutong/cordova-qdc-wxpay.git

2.代码

controller.js

 angular.module('starter.controllers', []).controller('MyCtrl', function($scope,PayService) {
$scope.wxpaytest= function () {
//参数说明:格式为JSON格式
//cb_success:调用成功回调方法
//cb_failure:调用失败回调方法
try {
PayService.getJson().then(function(data){
if(data){
if(data.status=="SUCCESS"){
var json = {
appid: data.appid,
noncestr: data.noncestr,
package: data.package,
partnerid: data.partnerid,
prepayid: data.prepayid,
timestamp: data.timestamp,
sign: data.sign
}
wxpay.payment(json, function(msg){
var json =JSON.parse(msg);
if(json.code==0){
alert("支付成功返回页面");
}
}, function(error){
var json =JSON.parse(error);
if(json.code ==-2){
alert("用户不支付了,点击取消,返回APP");
}
})
}
else{
alert("失败了");
}
}
});
}catch(ex){
alert(ex);
}
} });

services.js

 angular.module("starter.services",[])
.factory("PayService",function($q,$http){
return {
getJson: function()
{
var r = $q.defer(); $http.get("http://服务发布IP地址/ailpay.ashx?method=Unified").success(function (data) {
r.resolve(data);
}).error(function (er) {
r.resolve(!1);
});
return r.promise;
}
}
});

index.html

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title> <link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet"> <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
--> <!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script> <!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script> <!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter"> <ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">支付测试</h1>
</ion-header-bar>
<ion-content>
<div ng-controller="MyCtrl"> <button class="button button-block button-positive" ng-click="alipaytest()">支付宝支付</button> <button class="button button-block button-positive" ng-click="wxpaytest()">微信支付</button> </div>
</ion-content>
</ion-pane>
</body>
</html>

服务端代码:

  public void GetUnifiedOrder(HttpContext context)
{
string callback = context.Request["callback"] == null ? "JSON_CALLBACK" : context.Request["callback"].ToString();
string body = context.Request["body"] == null ? "body" : context.Request["body"].ToString();
string attach = context.Request["attach"] == null ? "测试系统-支付平台" : context.Request["attach"].ToString();
string totalFee = context.Request["totalFee"] == null ? "" : context.Request["totalFee"].ToString();
string goods_tag = context.Request["goodstag"] == null ? "" : context.Request["goodstag"].ToString();
string productId = context.Request["productId"] == null ? "" : context.Request["productId"].ToString();
WxPayData data = new WxPayData();
data.SetValue("body", body);//商品描述
data.SetValue("attach", attach);//附加数据
data.SetValue("out_trade_no", WxPayApi.GenerateOutTradeNo());
data.SetValue("total_fee", totalFee);//总金额
data.SetValue("time_start", DateTime.Now.ToString("yyyyMMddHHmmss"));//交易起始时间
data.SetValue("time_expire", DateTime.Now.AddMinutes().ToString("yyyyMMddHHmmss"));//交易结束时间
data.SetValue("trade_type", "APP");//交易类型 WxPayData result = WxPayApi.UnifiedOrderApp(data);//调用统一下单接口
string json = "NO";
if (result.GetValue("return_code").ToString() == "SUCCESS")
{
string prepay_id = result.GetValue("prepay_id").ToString();//获得统一下单接口返回prepay_id string noce_str = Guid.NewGuid().ToString().Replace("-", "");
var timestamp = WxPayApi.GenerateTimeStamp();
WxPayData dataReq = new WxPayData(); dataReq.SetValue("appid", "APP申请的Key");//
dataReq.SetValue("partnerid", "APP申请的商户号");//商户号
dataReq.SetValue("noncestr", noce_str);//随机字符串
dataReq.SetValue("package", "Sign=WXPay");
dataReq.SetValue("prepayid", prepay_id);
dataReq.SetValue("timestamp", timestamp);
var sign = dataReq.MakeSignApp();
context.Response.Write("{\"status\":\"SUCCESS\",\"appid\":\"" + "APP申请的Key" + "\",\"partnerid\":\""
+ "APP申请的商户号" + "\",\"noncestr\":\"" + noce_str + "\",\"package\":\"" + "Sign=WXPay"
+ "\",\"prepayid\":\"" + prepay_id + "\",\"timestamp\":\"" + timestamp + "\",\"sign\":\"" + sign + "\"}");
}
else {
WxLog.Info("Faile", result.GetValue("return_msg").ToString());
context.Response.Write(callback + "({\"status\":\"Faile\"})");
}
}

效果图:

Ionic 微信支付的更多相关文章

  1. 转《基于Ionic3实现微信支付和支付宝支付》

    在Ionic应用里实现支付并不难,但是有的坑真是不爬不知道. 一:支付宝支付 网上关于支付宝支付cordova插件真是非常多,但是大多会报一些让你很无语的错误.比如sdk早已过时不是最新的,或者没有出 ...

  2. 【原创分享·微信支付】C# MVC 微信支付教程系列之现金红包

            微信支付教程系列之现金红包           最近最弄这个微信支付的功能,然后扫码.公众号支付,这些都做了,闲着无聊,就看了看微信支付的其他功能,发现还有一个叫“现金红包”的玩意,想 ...

  3. 【原创分享·微信支付】 C# MVC 微信支付教程系列之扫码支付

    微信支付教程系列之扫码支付                  今天,我们来一起探讨一下这个微信扫码支付.何为扫码支付呢?这里面,扫的码就是二维码了,就是我们经常扫一扫的那种二维码图片,例如,我们自己添 ...

  4. 【原创分享·微信支付】 C# MVC 微信支付教程系列之公众号支付

    微信支付教程系列之公众号支付         今天,我们接着讲微信支付的系列教程,前面,我们讲了这个微信红包和扫码支付.现在,我们讲讲这个公众号支付.公众号支付的应用环境常见的用户通过公众号,然后再通 ...

  5. 【原创分享·微信支付】C# MVC 微信支付之微信模板消息推送

    微信支付之微信模板消息推送                    今天我要跟大家分享的是“模板消息”的推送,这玩意呢,你说用途嘛,那还是真真的牛逼呐.原因在哪?就是因为它是依赖微信生存的呀,所以他能不 ...

  6. Android—基于微信开放平台v3SDK,开发微信支付填坑。

    接触微信支付之前听说过这是一个坑,,,心里已经有了准备...我以为我没准跳坑出不来了,没有想到我填上了,调用成功之后我感觉公司所有的同事都是漂亮的,隔着北京的大雾霾我仿佛看见了太阳~~~好了,装逼结束 ...

  7. 解决新版Android studio导入微信支付和支付宝官方Demo的问题

    最近项目要用到支付宝支付和微信支付,本想使用第三方支付框架ping++或者BeeCloud的,但是由于他们的收费问题,让我望而却步,而且公司给了相应的公钥.私钥和APPID等,所以就用下开放平台的呗. ...

  8. C#开发微信门户及应用(35)--微信支付之企业付款封装操作

    在前面几篇随笔,都是介绍微信支付及红包相关的内容,其实支付部分的内容还有很多,例如企业付款.公众号支付或刷卡支付.摇一摇红包.代金券等方面的内容,这些都是微信接口支持的内容,本篇继续微信支付这一主题, ...

  9. C#开发微信门户及应用(32)--微信支付接入和API封装使用

    在微信的应用上,微信支付是一个比较有用的部分,但也是比较复杂的技术要点,在微商大行其道的年代,自己的商店没有增加微信支付好像也说不过去,微信支付旨在为广大微信用户及商户提供更优质的支付服务,微信的支付 ...

随机推荐

  1. Idea jsp页面乱码

    jsp页面中添加 <%@ page language="java" contentType="text/html; charset=utf-8" page ...

  2. Photoshop基本操作

    PS 工具是我们使用频率比较高的软件之一, 我们学习PS目的不是为了设计海报做电商和UI的,而是要求: 会简单的抠图 会简单的修改PSD效果图 熟练的切图 能和网站美工美眉有共同话题..... Pho ...

  3. thinkphp import标签

    传统方式的导入外部JS和CSS文件的方法是直接在模板文件使用: 直线电机哪家好 <script type='text/javascript' src='/Public/Js/Util/Array ...

  4. 0924CSP-S模拟测试赛后总结

    50分-rank28 我是第二机房垫底大垃圾. 赛时T1和T2其实想到了正解??安慰自己罢了. 真正的CSP-S的赛后你还能和主办方争论说自己其实想到了正解要求人家硬给你个省一不成?? 出题人不知道到 ...

  5. dart 异步

    使用异步有两种方法 then 或者 async/await. async/await 方法更易于理解,

  6. 最全的机器学习&深度学习入门视频课程集

    资源介绍 链接:http://pan.baidu.com/s/1kV6nWJP 密码:ryfd     链接:http://pan.baidu.com/s/1dEZWlP3 密码:y82m 更多资源 ...

  7. 2_2.springboot2.x配置之自动配置原理

    前言 SpringBoot 自动配置原理: 本文主要分为三大部分: SpringBoot 源码常用注解 SpringBoot 启动过程 SpringBoot 自动配置原理 1. SpringBoot ...

  8. 16-1-es5

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 1 环境搭建_及参考资料介绍_ASM驱动开发疑难解决

    1 环境搭建 > 这里和  周壑老师不同:大家觉得哪中适合当前的物理机,就配置那种. 如下: win7 32 位: vs 2010; visualDDk 驱动项目插件: V A --- 代码高亮 ...

  10. 【daydayup】weTalk

    先看一下项目效果 这个是我运行的作者的项目的wetalk-server项目,他还有wetalk-client 项目 先放下作者的github项目地址:https://github.com/mangyu ...