openId导致的微信中“下单账号和支付账号不一致”原因及解决办法

图1

       出现的问题如图1所示，出现问题的场景是用户A分享某个公益项目的链接到微信朋友圈，用户B打开这个链接准备捐款时就出现上面的问题。

       在网上查找相关的问题，大多语焉不详，给人的感觉好像是微信自身的问题。

       如果只是单独分析这个错误提示，可以推断应该是用户A的相关信息通过分享的方式被带出去了，在B打开时使用的是A的相关信息。首先可以排除缓存的问题，因为缓存是存在本地的，不会在分享时被携带出去。那有重大嫌疑的就是openId了，因为用户支付之前要授权，授权后微信会把当前用户的openId拼接在url后，然后重新加载当前页面，既然如此，会不会是openId被分享出去了呢?

       分享链接的url地址如下所示，发现openId确实在url地址中。

https://love.v2gogo.com/love/html/project.html?id=94146db13ed84f4fb95503ab775c221a&openId=oHyZmt7E-WViyjeEjEFqlgMiS81o&from=singlemessage&isappinstalled=0

       分析程序：

/**
 * 初始化微信用户数据
 */
function initWeiXinUser () {
    if(!window.user.openId) {
        if(!getQueryString("openId")) {
            if (window.location.href.indexOf("from") > -1){         // 如果当前页面是分享页面，将分享标志存储起来，微信授权只会保留一个参数
                sessionStorage.setItem('sharedPage', 1);
            }
            wxOAuth();
        } else {
            $.ajax({
                type : "GET",
                url : window._l.cfg.apiPrefix + "loveUser/getLoveUserByOpenId",
                dataType : "jsonp",
                jsonpCallback : "callBack",
                jsonp : "callBackParam",
                data : {
                    openId : getQueryString("openId")
                },
                success : function (result) {
                    if(result.code == 0) {
                        // 添加cookie,7天过期
                        addCookie("openId", getQueryString("openId"), 168);
                        //window.location.reload();
                        if (sessionStorage.getItem('sharedPage')) {
                            window.location.href = window.location.href + "&from=";
                        }
                        else {
                            window.location.reload();
                        }
                    }
                }
            });
        }
    }
    return;
}

代码片段1

       上面的程序就是图1页面的微信授权代码，从程序中分析可以知道，用户A第一次打开图1中的页面，按照初始化流程，先判断window.user.opneId，如果未定义，就从url取openId,如果没有，就调用微信授权，微信授权完后，把openId以参数的形式拼接在url地址后面，然后重新加载页面一次，把openId存入cookie，在代码片段1中是“addCookie("openId", getQueryString("openId"), 168);”。如果这个带有用户A的openId页面被分享出去，用户B打开这个页面当然就会提示“下单账号与支付账号不一致”了。

问题已经定位，下面继续分析带来这个问题的原因。

   在页面js代码中，初始化分享按钮的代码如下：

/**
 * 初始化APP右上角的分享按钮数据
 */
function initNativeShareBtn(project) {
  var shareInfo = {
    title : "我支持【" + project.projectTitle + "】微兔公益筹款，捐款或转发都是献爱心！",
    desc : project.description,
    imgUrl : window._l.cfg.imgPrefix + project.topImg,
    url : window.location.href
  };
  initAppShareBtn(shareInfo);
}

代码片段2

       从上面代码可以知道，问题的根源就是“url: window.location.href”。

要解决这个问题，很简单，只要window.location.href中有openId，就应该把这个参数滤除，修改后代码如下：

/**
 * 过滤掉分享出去地址中不需要带的参数
 * @param s
 * @returns {XML|string|void}
 */
function shareUrlParamsFilter(s) {
    // 过滤掉pay，openId参数
    return s.replace(/&pay=\w+/, "").replace(/[(\?)|(&)]openId=.*/, "");
}

/**
 * 初始化APP右上角分享按钮
 * @param shareInfo
 */
function initAppShareBtn(shareInfo) {
    var shareInfoTmp = shareInfo;
    var urlTmp = shareUrlParamsFilter(shareInfo.url);                // 分享前过滤掉当前用户的openId,防止微信中出现“下单账号和支付账号不一致的问题”。
    shareInfoTmp.url = urlTmp;
    if(isV2gogoApp()) {
        var v2gogoapp = getV2gogoAppFromSession();
        if(v2gogoapp.os == "Android") {
            AndroidJSListener.onShareInfo(JSON.stringify(shareInfoTmp));
        } else if(v2gogoapp.os == "iOS") {
            connectWebViewJavascriptBridge(function(bridge) {
                bridge.init(function(message, responseCallback) {});
                bridge.callHandler("onShareInfo", JSON.stringify(shareInfoTmp), function(response) {});
            });
        }
    } else if (isWeiXin()) {
        wxConfig(shareInfoTmp);
    }
}

        这样就解决这个问题了。需要注意的是ECMAScript中所有函数的参数都是按值传递的，在函数initAppShareBtn()中“shareInfo.url”是以形参的形式传入函数“shareUrlParamFilter()”的。如果函数“shareUrlParamFilter()”没有返回值,对象shareInfo的url属性在函数“shareUrlParamFilter()”不会被改变，因为ECMAScript中所有函数的参数都是按值传递的，这是和C语言不同的地方。