Ionic 微信支付
1.安装插件
ionic plugin add https://github.com/mrwutong/cordova-qdc-wxpay.git
2.代码
controller.js
1 angular.module('starter.controllers', []).controller('MyCtrl', function($scope,PayService) { 2 $scope.wxpaytest= function () { 3 //参数说明：格式为JSON格式 4 //cb_success:调用成功回调方法 5 //cb_failure:调用失败回调方法 6 try { 7 PayService.getJson().then(function(data){ 8 if(data){ 9 if(data.status=="SUCCESS"){ 10 var json = { 11 appid: data.appid, 12 noncestr: data.noncestr, 13 package: data.package, 14 partnerid: data.partnerid, 15 prepayid: data.prepayid, 16 timestamp: data.timestamp, 17 sign: data.sign 18 } 19 wxpay.payment(json, function(msg){ 20 var json =JSON.parse(msg); 21 if(json.code==0){ 22 alert("支付成功返回页面"); 23 } 24 }, function(error){ 25 var json =JSON.parse(error); 26 if(json.code ==-2){ 27 alert("用户不支付了，点击取消，返回APP"); 28 } 29 }) 30 } 31 else{ 32 alert("失败了"); 33 } 34 } 35 }); 36 }catch(ex){ 37 alert(ex); 38 } 39 } 40 41 42 });
services.js
1 angular.module("starter.services",[]) 2 .factory("PayService",function($q,$http){ 3 return { 4 getJson: function() 5 { 6 var r = $q.defer(); 7 8 $http.get("http://服务发布IP地址/ailpay.ashx?method=Unified").success(function (data) { 9 r.resolve(data); 10 }).error(function (er) { 11 r.resolve(!1); 12 }); 13 return r.promise; 14 } 15 } 16 });
index.html
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 6 <title></title> 7 8 <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 9 <link href="css/style.css" rel="stylesheet"> 10 11 <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 12 <link href="css/ionic.app.css" rel="stylesheet"> 13 --> 14 15 <!-- ionic/angularjs js --> 16 <script src="lib/ionic/js/ionic.bundle.js"></script> 17 18 <!-- cordova script (this will be a 404 during development) --> 19 <script src="cordova.js"></script> 20 21 <!-- your app's js --> 22 <script src="js/app.js"></script> 23 <script src="js/controllers.js"></script> 24 <script src="js/services.js"></script> 25 </head> 26 <body ng-app="starter"> 27 28 <ion-pane> 29 <ion-header-bar class="bar-stable"> 30 <h1 class="title">支付测试</h1> 31 </ion-header-bar> 32 <ion-content> 33 <div ng-controller="MyCtrl"> 34 35 <button class="button button-block button-positive" ng-click="alipaytest()">支付宝支付</button> 36 37 <button class="button button-block button-positive" ng-click="wxpaytest()">微信支付</button> 38 39 </div> 40 </ion-content> 41 </ion-pane> 42 </body> 43 </html>
服务端代码：
1 public void GetUnifiedOrder(HttpContext context) 2 { 5 string callback = context.Request["callback"] == null ? "JSON_CALLBACK" : context.Request["callback"].ToString(); 6 string body = context.Request["body"] == null ? "body" : context.Request["body"].ToString(); 7 string attach = context.Request["attach"] == null ? "测试系统-支付平台" : context.Request["attach"].ToString(); 8 string totalFee = context.Request["totalFee"] == null ? "1" : context.Request["totalFee"].ToString(); 9 string goods_tag = context.Request["goodstag"] == null ? "" : context.Request["goodstag"].ToString(); 10 string productId = context.Request["productId"] == null ? "" : context.Request["productId"].ToString(); 11 WxPayData data = new WxPayData(); 12 data.SetValue("body", body);//商品描述 13 data.SetValue("attach", attach);//附加数据 14 data.SetValue("out_trade_no", WxPayApi.GenerateOutTradeNo()); 15 data.SetValue("total_fee", totalFee);//总金额 16 data.SetValue("time_start", DateTime.Now.ToString("yyyyMMddHHmmss"));//交易起始时间 17 data.SetValue("time_expire", DateTime.Now.AddMinutes(10).ToString("yyyyMMddHHmmss"));//交易结束时间 19 data.SetValue("trade_type", "APP");//交易类型 26 27 WxPayData result = WxPayApi.UnifiedOrderApp(data);//调用统一下单接口 28 string json = "NO"; 29 if (result.GetValue("return_code").ToString() == "SUCCESS") 30 { 31 string prepay_id = result.GetValue("prepay_id").ToString();//获得统一下单接口返回prepay_id 32 33 string noce_str = Guid.NewGuid().ToString().Replace("-", ""); 34 var timestamp = WxPayApi.GenerateTimeStamp(); 35 WxPayData dataReq = new WxPayData(); 36 37 dataReq.SetValue("appid", "APP申请的Key");// 38 dataReq.SetValue("partnerid", "APP申请的商户号");//商户号 39 dataReq.SetValue("noncestr", noce_str);//随机字符串 40 dataReq.SetValue("package", "Sign=WXPay"); 41 dataReq.SetValue("prepayid", prepay_id); 42 dataReq.SetValue("timestamp", timestamp); 50 var sign = dataReq.MakeSignApp(); 62 context.Response.Write("{"status":"SUCCESS","appid":"" + "APP申请的Key" + "","partnerid":"" 63 + "APP申请的商户号" + "","noncestr":"" + noce_str + "","package":"" + "Sign=WXPay" 64 + "","prepayid":"" + prepay_id + "","timestamp":"" + timestamp + "","sign":"" + sign + ""}"); 65 } 66 else { 67 WxLog.Info("Faile", result.GetValue("return_msg").ToString()); 68 context.Response.Write(callback + "({"status":"Faile"})"); 69 } 73 }
效果图：