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. [转]MySQL InnoDB引擎索引长度受限怎么办

    mysql> CREATE TABLE `tb` (-> `a` varchar(255) DEFAULT NULL,-> `b` varchar(255) DEFAULT NULL ...

  2. 计数dp+概率+大数——（抽屉问题解的个数）zoj3380

    难的地方在于计数dp..给定范围[1,n]的数去填m个位置,要求不能出现超过I个相同的数, 那就用dp[i][j]表示在阶段i,已经填了j个位置的可能解法,那么只要枚举i填的位置数k∈[0,min(j ...

  3. bfs理解——hdu6386好题

    用队列维护,对于每块颜色相同的相连的边进行dfs并记录即可 注意这题要用vis来标记边,不可以标记点 因为点的深度是可以随时更新的(这样的做法不满足贪心条件) #include<bits/std ...

  4. [JZOJ 5782] 城市猎人

    思路: 并查集按秩合并维护出现时间. 最早连接时间就是树上连接最大值. \(qwq\)我居然把路径压缩和按秩合并打到一个程序里了...OvO #include <bits/stdc++.h> ...

  5. ps快速将白底图片变为透明图片

    方法一: 如果图层有锁图标,则要点击它,然它消失.然后选中魔棒工具,然后点击图片上要透明的区域,按下backspace键即可. 方法二: 转载自:https://blog.csdn.net/sunyi ...

  6. Django杂篇(1)

    目录 Django杂篇(1) bulk_create Pagination 创建多对多表关系的常用方法 form校验组件的应用 渲染页面 展示错误信息 校验数据 常用字段 Django杂篇(1) 这里 ...

  7. 面试系列13 redis都有哪些数据类型

    (1)string 这是最基本的类型了,没啥可说的,就是普通的set和get,做简单的kv缓存 (2)hash 这个是类似map的一种结构,这个一般就是可以将结构化的数据,比如一个对象(前提是这个对象 ...

  8. HTML5印章绘制电子签章图片，中文英文椭圆章、中文英文椭圆印章

    原文:HTML5印章绘制电子签章图片,中文英文椭圆章.中文英文椭圆印章 电子签章图片采集 印章图片的采集两种互补方式: 方式1:在线生成印章图片方式,但是这种方式有个弊端,对印章中公司名称字数有限制, ...

  9. Python+Selenium基础入门及实践

    Python+Selenium基础入门及实践 32018.08.29 11:21:52字数 3220阅读 23422 一.Selenium+Python环境搭建及配置 1.1 selenium 介绍 ...

  10. 【转】IOS获取屏窗高度踩坑之window.outerHeight

    近日本人在直接使用window.outerHeight获取屏窗高度时 在iphone 6中出现等于0的情况,从而导致页面发生错误 后找遍代码,测试无数,终于让我逮住了这个该死兼容 window.out ...