angularjs 微信授权登录 微信支付

最近做一个项目，用angular 一个单页应用，打算打包成 跨平台移动App 以及在微信里面使用。给大家一个案例

首先，熟悉一下微信授权部分的源代码，如下所示:

javascript 前端代码；

 var app = angular.module("myApp", []);
		app.controller('myCtrl', ['$scope', '$location', '$http', function($scope, $location, $http) {
			//调取获取ping++支付凭证接口
			$scope.userid = userid;
			$scope.orderNum = $location.search().orderNum;
			$scope.orderId = $location.search().orderId;
			$scope.openid = $location.search().openid;
			//订单详情
			$scope.url = url + '';
			$http({
				method: 'GET',
				url: $scope.url,
				params: {
					'userid': userid,
					'orderId': $scope.orderId,
					'orderNum': $scope.orderNum
				}
			}).success(function(result) {
				if(result.status == 200) {
					$scope.orderInfo = result.data.orderInfo;
				}
			});

			$scope.slectPayType = function(paymentType, orderId, orderNum, userid) {
				$scope.url = url + '';
				window.location.href = $scope.url + "?orderId=" + orderId + "&orderNum=" + orderNum + "&userid=" + userid;

			}
			console.log($scope.userid)
			console.log($scope.orderNum)
			console.log($scope.orderId)
			console.log($scope.openid)
			if($scope.openid != undefined || $scope.openid) {
				$scope.paytype = 'wx_pub';
				$scope.url = url + '';
				$http({
					method: 'GET',
					url: $scope.url,
					params: {
						'userid': userid,
						'orderNum': $scope.orderNum,
						'orderid': $scope.orderId,
						'openid': $scope.openid,
						'channel': $scope.paytype
					}
				}).success(function(result) {
					if(result.status == 200) {
						$scope.charge = result.data;
						pingpp.createPayment($scope.charge, function(result, error) {
							if(result == "success") {
								showMsg("支付成功");
								// 只有微信公众账号 wx_pub 支付成功的结果会在这里返回，其他的支付结果都会跳转到 extra 中对应的 URL。
							} else if(result == "fail") {
								showMsg("支付失败");
								// charge 不正确或者微信公众账号支付失败时会在此处返回
							} else if(result == "cancel") {
								// 微信公众账号支付取消支付
								showMsg("已取消支付");
							}
						});
					}
				});

			}
		}]);

页面部分；

<li ng-click="slectPayType('wx_pub',orderInfo.id, orderInfo.orderid,userid)"><i class="weixin"></i><span>微信</span></li>
<li ng-click="slectPayType('alipay_wap', orderInfo.id, orderInfo.orderid,userid)"><i class="alipay"></i><span>支付宝</span></li>

我在做微信支付的过程中出现了一个比较麻烦的问题，耗费了我半天的时间才解决的，就是在支付过程中回调通知地址的URL不规则，导致虽然支付成功了，但获取不到订单信息以及对订单信息的处理。微信支付要求回调通知URL必须不能带参数，如：“https://你的域名/index.php/home/WxJsAPI/notify/”。因为我用的是Thinkphp的路由模式3，此路由带了参数，如：“https://你的域名/index.php?s=/home”。（凡是URL里带有“?”的，都算是带了参数）

当然，如果你是第一次做，肯定会遇到各种问题，如果你是新手，遇到的问题都不知道为什么，即使你做过了再做我相信还是可能由于细节上的疏忽会出现问题的，不过不要烦躁，耐心的去发现问题，耐心的去调试，最后一定可以解决的。