主要分3步：
第一步：詳見產品id發給后端，生成預訂單；后端會把請求微信接口來生成簽名，訂單id等；
第二步：根據后端返回信息，將微信需要的appid，簽名，訂單id，隨機字符串，簽名方式，訂單詳情發給支付接口；
第三步：手機端支付完后，后端會收到微信提供的是否支付成功的信息，前端來請求后端，查詢訂單是否完成，然后進行后續操作；

第一步代碼：
//微信購買某年級單詞，調用微信支付接口
$scope.buyWords = function () {
$http({
method: 'post',
url: pathProject.postProductId, //接口參數
params: {
productId: $rootScope.wordsGradeId //要購買的產品id
}
}).then(function successCallback(res) {
if (res.data.code == 0) {
var respanse = res.data.data; //后端請求微信的參數返回給前端
$scope.pay(respanse); //調用微信支付接口函數
}
}, function errorCallback(res) {
$scope.wordsActivationcode = true; //點擊維信支付的鏈接是個單獨的form表單，請求失敗的話要保留該表單，使用戶能繼續操作
alert('請求超時，請稍后重新提交信息。')
});
};
第二步代碼：注意微信支付接口不支持在微信開發者工具里面調試，必須部署線上環境然后用手機微信測試，appId,timeStamp這些參數名稱都要用“”包含，
不然有可能丟失參數，后端注意返回簽名不是微信給的簽名，是需要后端根據appId等參數自己來拼接并加密生成的；
//微信支付，微信開發者API，固定格式
$scope.pay = function(respanse){
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
"appId": respanse.appid, //必填，公眾號名稱
"timeStamp": respanse.timestamp, // 必填，時間戳,秒數
"nonceStr": respanse.nonce_str, // 必填，隨機字符串,
"package": "prepay_id=" + respanse.prepay_id, //必填，訂單詳情擴展字符串
"signType": "MD5", // 必填，微信簽名方式：
"paySign": respanse.sign //必填，微信簽名
},
function(res){
if(res.err_msg == "get_brand_wcpay_request:ok" ) {
$scope.wordsActivationcode = false; //支付成功后將表單隱藏
$scope.searchPay(respanse.purchaseId) //查詢訂單是否完成函數
} else {
alert("支付失敗")
}
}
);
};
第三步代碼：
//訂單查詢，判斷客戶是否購買成功，訂單處理都是后端操作的，直接根據后端返回數據來判斷即可
$scope.searchPay = function (id) {
wxServices.getPay(id).then(function (response) {
if (response.data.code == 0) {
alert('購買成功');
$scope.reloadRoute()
} else {
alert(response.data.message)
}
})
};