關於微信支付遇到的哪些坑

背景

最近公司在作一個微信公衆號的項目,其中涉及到了微信支付.項目基於Angularjs開發的.背景交代到這裏.
結構以下:

問題

以前在其它的項目中作過微信支付,因此公衆配置這些都沒問題的.支付受權地址等等東西都是配置好了的.
但是支付的時候不正確.

解決問題的步驟

1. 檢查公衆帳號支付受權路徑是否正確,發現和配置的和預期的是一致的都是pageB的地址(其實就是這裏坑了)

2. 查閱微信支付API 檢查官方是否更新了調用方式,調用方式以下並無更新

function onBridgeReady() {
    WeixinJSBridge.invoke(
        'getBrandWCPayRequest', {
        "appId"：
        "wx2421b1c4370ec43b",
            "timeStamp"：
        " 1395712654",
            "nonceStr"：
        "e61463f8efa94090b1f366cccfbbb444",
            "package"：
        "prepay_id=u802345jgfjsdfgsdg888",
            "signType"：
        "MD5",
            "paySign"：
        "70EA570631E4BB79628FBCA90534C63FF7FADD89"
    }, function (res) {
        if (res.err_msg == "get_brand_wcpay_request：ok") {}
    });
}
if (typeof WeixinJSBridge == "undefined") {
    if (document.addEventListener) {
        document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
    } else if (document.attachEvent) {
        document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
        document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
    }
} else {
    onBridgeReady();
}

---

在調試過程當中開始時只關注到res.err_msg 值,忘記查看整個res對象了,查看res對象提示 當前地址沒有受權.

WeixinJSBridge.invoke('getBrandWCPayRequest', prepay, function (res) {
    if ('get_brand_wcpay_request:ok' == res.err_msg) {
        alert("支付成功!");
        $state.go('account.orders')
    } else if ('get_brand_wcpay_request:cancel' == res.err_msg) {
        alert("支付過程當中用戶取消?");
    } else if ('get_brand_wcpay_request:fail' == res.err_msg) {
        alert("支付失敗");
    } else {
        alert(res.err_msg);
    }
});

在這個時候回去檢查了第1步,配置也是第一步的地址.根據以往的經驗沒有錯誤的.

在這個時候找不到緣由了

困惑了兩天

查看了pageB在微信裏面的地址發現原來顯示的地址根本不是咱們預期的地址
xxx.com/#/order/detail
在IOS版本里面地址是 xxx.com/#/shop/index/888
這是pageA的地址
在Android手機查看地址是 xxx.com/#/order/detail

根據微信支付配置的受權地址爲 xxx.com/#/shop/index/ xxx.com/#/order/

總結

使用微信支付出現問題,檢查配置,特別是受權地址,對於spa來講在不一樣的平臺檢查確認支付地址是否是和預期的一致,由於平臺的不一樣地址有可能不一樣.