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里帶有“?”的，都算是帶了參數）

當然，如果你是第一次做，肯定會遇到各種問題，如果你是新手，遇到的問題都不知道為什么，即使你做過了再做我相信還是可能由於細節上的疏忽會出現問題的，不過不要煩躁，耐心的去發現問題，耐心的去調試，最后一定可以解決的。