添加debug测试功能：vConsole

一、vConsole简介
vConsole是一个网页前端调试面板，专为手机 web 页面量身设计，帮助开发者更为便捷地进行开发调试工作。

二、我的开发思路：
1、引入vconsole.min.js;
2、当用户在地址栏的网址后面输入”?debug=true",将开启debug调试模式；输入“?debug=false"时，将关闭debug调试模式。
3、页面加载后，先读取cookie中的isDebug值，再根据isDebug值配置当前状态下的debug，再保存新的（即最首次时自动赋值isDebug=false，或用户再地址栏的url中手动设置的）debug值到cookie中。所以每次手动更改isDebug的值后，都需刷新页面两次才会生效（但cookie中的isDebug值在第一次刷新时已更新值）。

4、注意：当debug=true时，才会存cookie的isDebug为true；当debug=false时，才会存cookie的isDebug为false，其他任何值都无法更改cookie中的isDebug值！

isStartDebug = location.search == "?debug=true" || GetQueryDebugValue == 'true',

// url中是否手动关闭了debug模式
isCloseDebug = location.search == "?debug=false" || GetQueryDebugValue == 'false';

 // 存cookie
if (isStartDebug) {
    $cookies.put('isDebug', true)
} else if (isCloseDebug) {
    $cookies.put('isDebug', false)
}

5、
（1）vConsole.js的参考文档：https://www.qianduan.net/vconsole-open-source/
（2）"如何获取带#的url中的search参数（有hash和无hash的不同取法）"参考文档：http://www.cnblogs.com/codebook/p/5918079.html

location.hash、location.search取值小结：
（1）url地址为：https://www.baidu.com/?name=caicai
location.hash 取值为""，
location.search 取值为"?name=caicai"，
（2）url地址为：https://sp.zhuzi.me/#!/customer/list/detail/18011?name=caicai
location.hash 取值为"#!/customer/list/detail/18011?name=caicai"，
location.search 取值为""，（因为查询字符串search只能取到“？”后面和“#”之前的内容）
（3）url地址为：https://sp.zhuzi.me/?name=caicai#!/customer/list/detail/18011
location.hash 取值为"#!/customer/list/detail/18011"，
location.search 取值为"?name=caicai"

6、我的源码：

     /**
     * 加载debug配置
     */
    function loadingDebug() {
        let obj = (document.getElementsByTagName('head')[0] || body),
            js = null;
        js = document.createElement('script');
        js.type = 'text/javascript';
        js.onload = function () {
            new VConsole();
        };
        js.onerror = function (e) {
            alert("vonsole.js load error,err:" + e);
        };
        js.src = "/js/vconsole.min.js";
        obj.appendChild(js);
    }

    /**
     * 存debug值到cookie
     * @param getCookieIsDebug
     */
    function setCookieDebug(getCookieIsDebug) {
        /**
         * 获取带#的url中的search参数
         * 参考http://www.cnblogs.com/codebook/p/5918079.html
         * @param name
         * @return {*}
         */
        function GetQueryString(name) {
            let after = window.location.hash.split("?")[1];
            if (after) {
                let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                let r = after.match(reg);
                if (r != null) {
                    return decodeURIComponent(r[2]);
                }
                else {
                    return null;
                }
            }
        }

        // 初始化debug的cookie值
        if (getCookieIsDebug == undefined) {
            $cookies.put('isDebug', false);
            return;
        }

        // 获取带#的url中的search参数
        let GetQueryDebugValue = GetQueryString('debug'),
            // url中是否手动开启了debug模式
            isStartDebug = location.search == "?debug=true" || GetQueryDebugValue == 'true',
            // url中是否手动关闭了debug模式
            isCloseDebug = location.search == "?debug=false" || GetQueryDebugValue == 'false';

        // 存cookie
        if (isStartDebug) {
            $cookies.put('isDebug', true)
        } else if (isCloseDebug) {
            $cookies.put('isDebug', false)
        }
    }

    /**
     *  debug调试模式的开启和关闭
     */
    function DebugModel() {
        // 读取cookie
        let getCookieIsDebug = $cookies.get('isDebug');
        if (getCookieIsDebug == 'true') {
            // cookie值为开启debug模式,则加载vconsole.js
            loadingDebug();
        }
        // 保存新的（手动设置的）debug值到cookie中
        setCookieDebug(getCookieIsDebug);
    }

    // debug调试模式的开启和关闭
    DebugModel();

此文章主要是针对服务商中的，换汤不换药哈。