微(wei)信(xin)JSApi支付(fu)~集成到(dao)MVC環(huan)境后的最后一個(ge)坑(網(wang)上沒有這種解決(jue)方案)
大叔第一人
之前寫了關于微信的坑《微信JSApi支付~坑和如何填坑》,今天將微信的jsapi支付封裝到了MVC環境里,當然也出現了一些新的坑,如支付參數應該是Json對象而不是Json字符串,這樣也會應付引起“get_brand_wcpay_request:fail_invalid appid”這個大家都知道的異常,呵呵,解決方案網上說是“授權目錄“,事實上,還有一種原因,那就是你的WeixinJSBridge.invoke方法里的參數應該是Json對象而不是字符串,這才是最重要的。
代碼我們(men)需要寫成(cheng)下面的(de)格式(shi)
//調用(yong)微信JS api 支(zhi)付(fu) function jsApiCall() { var price = 1.0; var no = '@Request.QueryString["orderNumber"]'; var action = '@Url.Action("Get")'; var openID = '@openID'; $.get(action, { price: price, orderNumber: no, openID: openID }, function (data) { WeixinJSBridge.invoke('getBrandWCPayRequest', JSON.parse(data), function (res) { WeixinJSBridge.log(res.err_msg); alert(res.err_code + res.err_desc + res.err_msg); }); }); }
對于我們封裝成MVC后,由于MVC的路由將擴展名去除了,所以我們的授權目錄也發生了變化,如Order/Pay這個頁面,在收取時應該是//域名/Order/Pay/,而之前的//域名/Order/這個級(ji)別就不被認可了,這點也要注意一下。
還有一點要(yao)注冊,如果你(ni)添加了測試(shi)授(shou)權目(mu)錄,那必須要(yao)添加測試(shi)用的白名(ming)單,否(fou)則(ze)你(ni)的微信也測試(shi)不(bu)了。
大叔封裝的MVC版的微信JSAPI支付
/// <summary> /// 構建(jian)支付處(chu)理類 /// </summary> public class JsApiImplement { public static string wxJsApiParam { get; set; } //H5調(diao)起JS API參(can)數 /// <summary> /// 返回當(dang)前微信客戶端(duan)的OpenId,每個客戶端(duan)在每個公(gong)眾號里(li)的OpenId是唯一的 /// </summary> /// <returns></returns> public static string GetOpenId() { JsApiPay jsApiPay = new JsApiPay(System.Web.HttpContext.Current); jsApiPay.GetOpenidAndAccessToken(); Log.Debug("GetOpenId", "openid : " + jsApiPay.openid); return jsApiPay.openid; } /// <summary> /// JsApi返回微信支付(fu)的連接(jie)參數(shu),這(zhe)個方法(fa)需要(yao)前臺UI頁面調用,通(tong)常可以使用AJAX進行(xing)調用它 /// </summary> /// <param name="total_fee">訂單(dan)金(jin)額(e)</param> /// <param name="orderId">業務的訂單編號</param> /// <returns></returns> public static string Send(int total_fee, string orderId, string openId) { try { //調用【網(wang)頁(ye)授權獲(huo)取用戶信息】接口獲(huo)取用戶的(de)openid和access_token //jsApiPay.GetOpenidAndAccessToken(); JsApiPay jsApiPay = new JsApiPay(System.Web.HttpContext.Current); jsApiPay.openid = openId; Log.Debug("Send", "openid : " + jsApiPay.openid); //若傳遞了相關參數,則調(diao)統一下單接口(kou)(kou),獲(huo)得后續相關接口(kou)(kou)的(de)入口(kou)(kou)參數,微(wei)信的(de)價(jia)格是分 jsApiPay.total_fee = total_fee; WxPayData unifiedOrderResult = jsApiPay.GetUnifiedOrderResult(orderId); wxJsApiParam = jsApiPay.GetJsApiParameters();//獲取H5調起JS API參數 Log.Debug("Send", "wxJsApiParam : " + wxJsApiParam); } catch (Exception ex) { Log.Error("Error", ex.Message); } return wxJsApiParam; } /// <summary> /// JsApi微信回調 /// </summary> public static void Notify(Action<NotifyModel> action) { var context = System.Web.HttpContext.Current; ResultNotify resultNotify = new ResultNotify(context); resultNotify.ProcessNotify(action); } }
對(dui)于使(shi)用者(zhe)來說,也很(hen)簡單,在(zai)頁(ye)面上拿OpenId,之后(hou)把(ba)OpenId傳到后(hou)臺(tai)方法,拿到微信支付的參(can)數對(dui)象(JSON對(dui)象),之后(hou)完成支付
<script type="text/javascript">
//調用微(wei)信JS api 支付
function jsApiCall() {
$.get("/weixin/get", new { money: 1, order: '001', openId: 'test' }, function (data) {
WeixinJSBridge.invoke('getBrandWCPayRequest', JSON.parse(data), function (res) {
WeixinJSBridge.log(res.err_msg);
alert(res.err_code + res.err_desc + res.err_msg);
});
});
}
function callpay() {
if (typeof (WeixinJSBridge) == "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
}
else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', jsApiCall);
document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
}
}
else {
jsApiCall();
}
}
</script>
<body>
<a href="javascript:void(0)" onclick="callpay();return false;">立即支付</a>
</body>
希望大家一起來找各種坑,然后把(ba)坑填上,分享給大家!