碼農湊熱鬧!小米搶購手機頁面前端代碼分析


    今天來個比較潮的,分析一下小米前端js排隊代碼;! 走過路過不要錯過了!    
話說小米手機不錯,主要是miui不錯。買個手機天天要搶。其實我是比討厭這種營銷。把手機價格搞的低低的,吸引注意。好長一段時間,你很難搶的到手機。 相比小米,我更喜歡魅族,雖然我用的是小米1s.以后有點閑錢,換手機買一部魅族。

    下面來享受這段代碼。 你想做搶購軟件?搶購機器人?先看懂這代碼吧!
   
10.15號的搶購js代碼,都寫到一個js文件中.里面的代碼是mini版本的,查個工具把他格式化一下就可以了。
   http://p.www.xiaomi.com/open/131009/mi3/buy/process.min.js

    小米為了增加代碼閱讀的復雜性(也可能為了轉義字符),把一些變量定義成一個數組,而且這個數組用16進制表示。
   
做過白帽子的,應該很熟悉。用16進制表示字符找出很多xss漏洞,sql注入漏洞吧。可以自己寫(其實alert或console.info
16進制就可以得到字符串)或找個工具轉成字符串,增加代碼的可讀寫性。
    好了,下面就來分析代碼了。
    以10.15的搶購代碼為例

    為了閱讀性我們兩成兩段,一個是他的數組變量_$,另一段是就是其它代碼
_$ 變量太長了,我貼一點點,不完整!

var _$ = ["\x44\x4f\x4d\x43\x6f\x6e\x74\x65\x6e\x74\x4c\x6f\x61\x64\x65\x64", "\x6f\x6e\x72\x65\x61\x64\x79\x73\x74\x61\x74\x65\x63\x68\x61\x6e\x67\x65", "\x44\x4f\x4d\x43\x6f\x6e\x74\x65\x6e\x74\x4c\x6f\x61\x64\x65\x64", "\x6f\x6e\x72\x65\x61\x64\x79\x73\x74\x61\x74\x65\x63\x68\x61\x6e\x67\x65", '\x6c\x65\x66\x74', "\x73\x74\x72\x69\x6e\x67", "\x5b\x6f\x62\x6a\x65\x63\x74\x20\x4f\x62\x6a\x65\x63\x74\x5d", '\x6e\x75\x6d\x62\x65\x72', '\x3d', '\x3b\x20\x65\x78\x70\x69\x72\x65\x73\x3d', '', '\x3b\x20\x70\x61\x74\x68\x3d'];
View Code
/**
 * 代碼作者    小米公司
 * 代碼分析者 huangzhir@gmail.com
 */



//是否回滾狀態  即時間等待是否結束  這個是用來做重新進入活動的狀態
var isRollStatus = false,
//是否購買手機
isPhone = false,
//是否購買盒子,有時用來做是否購買電視
isBox = false;
/**
 *  (function() {})(); 自調匿名函數用法,可以減少局部變量
 *   注意,這是m可不是局部變量,雖然定義在自調匿名函數里,
 *   ,因為不是用 var m={};而是用直接 用m={};
 *
 */
(function() {
   m = {
        arrelems: [],//元素數組 在js 里用 {} 表示一個對象,用[]表示一個數組  這里這個都沒用到
        ready: null,
        /*
         * doms 這個方法寫了這么一大堆,一眼看你還看不出這個要做什么,
         * 如果你看jquery的源碼,肯定很清楚,這個就是Jquery.read() 方法的源代碼 搬過來
         * 那為什么要寫這么重新寫,而不用jquery呢,我想是因為這是一個搶購頁面,訪問次數非常的大,
         * 不去引用jquery,減少頁面的訪問連接數,你看這個頁面的源代碼就知道,css ,javascript 都沒引用其它鏈接。
         * 這個頁面的js,也是10.15這次,才寫到一個js文件里,在頁面做引用的。以前也都放在一個頁面里,這樣可以減少服務器的負擔
         * 這方面做的比較差或者說很差的就是12306,有用沒用都引用一大堆的 css 和 javascript
         * 除去這段Jquery.read() 方法的源代碼 代碼,你會發現小米的排隊代碼還是很簡單,很容易的理解的
         */
        doms: function() {
            var _this = this;//  this 這是指m
            var isReady = false;//    addDOMLoadEvent 是否已經完成,是否准備好
            var readyList = [];// 這個用來在存放  addDOMLoadEvent 未完成之時,馬上要執行的方法
            var timer;  //利用 doScroll() 方法來模擬 addDOMLoadEvent 事件的方案 的timer 臨時定時器
            _this.ready = function(fn) {    // 設置m.ready 為一個方法
                if (isReady) {
                    fn.call(document);//執行 fn方法 相當於 fn(document);
                } else {
                    readyList.push(function() {   //數組新加一個方法 這個方法為調用 fn(this) 反返回值
                        return fn.call(this);
                    });
                };
                return this;
            };
            var onDOMReady = function() {   // 這樣的寫法相當於  function onDOMReady()  執行  readyListx 方法,然后清空
                //執行 readyList 數組里面的所有方法  方法名.call()和 方法名.apply() 作用差不多, call()傳參數是一個人個傳的,apply()是傳一個參數對象數組
                for (var i = 0x0; i < readyList.length; i++) {  //0x0 是16進制的表示方法 就是0
                    readyList[i].apply(document)
                };
                readyList = null;
            };
            var bindReady = function(evt) {
                if (isReady) {
                    return
                };
                isReady = true;
                onDOMReady.call(window);  //觸發所有要要執行的方法
                if (document.removeEventListener) {   //  非ie 瀏覽器
                    document.removeEventListener(_$[0], bindReady, false)    //_$[0]=DOMContentLoaded ,移除邦定DOMContentLoaded方法 ,DOMContentLoaded 與 onload 有點類似,DOMContentLoaded 僅當DOM加載完成,不包括樣式表,圖片,flash
                } else if (document.attachEvent) {    //  ie 瀏覽器
                    document.detachEvent(_$[1], bindReady);  //_$[1]=onreadystatechange; ie的寫法
                    if (window == window.top) {
                        clearInterval(timer);  //清楚定時器
                        timer = null
                    }
                }
            };

            if (document.addEventListener) {
                document.addEventListener(_$[2], bindReady, false) // _$[2]=DOMContentLoaded  添加 DOMContentLoaded 綁定  bindReady 方法
            } else if (document.attachEvent) {
                //_$[3]=onreadystatechange    功能同上
                //利用 doScroll() 方法來模擬 addDOMLoadEvent 事件的方案,且現在主流的 JavaScript 框架(JQuery、YUI等)基本都采用的這一解決方案。
                document.attachEvent(_$[3], function() {
                    if ((/loaded|complete/).test(document.readyState)) bindReady()
                });
                if (window == window.top) {
                    timer = setInterval(function() {
                        try {
                            isReady || document.documentElement.doScroll(_$[4]) //_$[4]=left
                        } catch (e) {
                            return
                        };
                        bindReady()
                    }, 0x5)
                }
            }
        },
        $: function() {       //_$[5]=String  如果方法參數是字符串返回document.getElementById()對像,如果不是返回第1個參數對象
            return typeof arguments[0x0] === _$[5] ? document.getElementById(arguments[0x0]) : arguments[0x0]
        },
        extend: function(target, options) {  //對象屬性copy
            for (name in options) {
                target[name] = options[name]
            };
            return target
        },
        //這個方法是不是也有點似曾相識的感覺,這個方法跟jquery.cookie.js 插件用法,代碼基本也一樣,后面一段實現方式有點不同
        cookie: function(key, value, options) {
            if (arguments.length > 0x1 && String(value) !== _$[6]) {  //_$[6]='[object Object]' 如果偉入的參數大於1個,value 不是對象類型
                if (value === null || value === undefined) {
                    options.expires = -0x1
                };
                if (typeof options.expires === _$[7]) {  // _$[7]='number'
                    var days = options.expires,
                        t = options.expires = new Date();
                    t.setDate(t.getDate() + days)
                };
                value = String(value);
                //_$[8]='='    _$[9]='; expires='  _$[10]=''  _$[11]='; path='  _$[12]='' _$[13]='; domain='    $[14]=''   $[15]='; secure'  $[16]=''   $[17]=''
                //  key, value, options 拼接成cookie串, cookie='name=value;name2=value2;name3=value3;...' ;
                return (document.cookie = [encodeURIComponent(key), _$[8], options.raw ? value : encodeURIComponent(value),
                    options.expires ? _$[9] + options.expires.toUTCString() : _$[10],
                    options.path ? _$[11] + options.path : _$[12],
                    options.domain ? _$[13] + options.domain : _$[14],
                    options.secure ? _$[15] : _$[16]].join(_$[17]))
            };
            //以下是從現有的document.cookie 中取key的value值
            // 也就是說如果只有一個參數,如調用 cookie(key) 就從 document.cookie 取 key的value值
            // ps:是不是似曾相識,這要買 jquery 里的 val() attr() 方法一樣
            options = value || {};
            var result, decode = options.raw ? function(s) {
                return s
            } : decodeURIComponent;
            //  _$[18]= '(?:^|; )'   _$[19]='=([^;]*)'
            //括號 "( )" 內的子表達式,如果希望匹配結果不進行記錄供以后使用,可以使用 "(?:xxxxx)" 格式
            //用 [^ ] 包含一系列字符,則能夠匹配其中字符之外的任意一個字符
            //    (?:^|;)key=([^;]*)     正則圖形 http://www.regexper.com/#(%3F%3A%5E%7C%3B%20)key%3D(%5B%5E%3B%5D*)
            // 正則表達式用來"key=keyvalue; name1=value1; name2=value2; name3=value3" 中取出  key=keyvalue
            //  _$[18]= '(?:^|; )' ,在;后面多了個空格,因為cookie的存放方式就是就分號后面有個空格,原來誤解了!
            // result[0x1] 取的就是value 匹配的第二組 第1組就是key=keyvalue
            return (result = new RegExp(_$[18] + encodeURIComponent(key) + _$[19]).exec(document.cookie)) ? decode(result[0x1]) : null
        },
        addEvent: (function() {    //為參數里的元素增加綁定方法
            if (document.addEventListener) {
                return function(el, type, fn) {
                    el.addEventListener(type, fn, false)
                }
            } else {
                //_$[20]='on'
                return function(el, type, fn) {
                    el.attachEvent(_$[20] + type, function() {
                        return fn.call(el, window.event)
                    })
                }
            }
        })(),
        randomDiff: function(option) {
            var paras = {
                    randomS: 0x1,
                    randomE: 0x5
                },
                options = m.extend(paras, option || {}),    //把 option copy到 paras
                //隨機從  randomS 到  randomS 取一個數,這里就是隨機取1-5
                randomNum = Math.random() * (options.randomE - options.randomS + 0x1) + options.randomS;
            return parseInt(randomNum)
        },
        //取url中查詢參數name的value
        getQueryString: function(name) {
            //_$[21] ='(^|&)'   _$[22]='=([^&]*)(&|$)'  _$[23]='i'
            //  (^|&)name=([^&]*)(&|$) 正則圖形 http://www.regexper.com/#(%5E%7C%26)name%3D(%5B%5E%26%5D*)(%26%7C%24)
            //RegExp 的第二個參數 i    執行對大小寫不敏感的匹配。 g    執行全局匹配(查找所有匹配而非在找到第一個匹配后停止)。  m    執行多行匹配
            var reg = new RegExp(_$[21] + name + _$[22], _$[23]);
            //window.location.search 表示瀏覽器url中 包括?后面的參數 如:?pat=aa&key=value
            var r = window.location.search.substr(0x1).match(reg);
            //取出第二組的值,即([^&]*)的值
            if (r != null) return unescape(r[0x2]);
            return null
        },
        // 生成一個js <javascript id="elemid" src="src"/>  播放到body中
        // 這個主要是用jsonp 跨域跟服務交互, 小米用這種方式把數據提交到服務器,在服務做排列
        creatJs: function(src, elemid) {
            var Scrip = document.createElement(_$[24]);  //_$[24]='script'
            Scrip.src = src;
            if ( !! elemid) {
                Scrip.id = elemid;
                if (m.$(elemid)) {
                    document.body.removeChild(m.$(elemid))
                }
            };
            document.body.appendChild(Scrip)
        },
        //這個表示 如果瀏覽器是手機,跳轉到參數url,如果 orgin='mapp' 就清空
        phone: function(url) {
            url = url || _$[25]; // _$[25]='http://m.xiaomi.com' 這種很經典的寫法,如果url 沒值 取_$[25] 為默認值
            //如果 cookie 中 orgin 的值為 mapp ,就設置orgin 為空
            if (m.cookie(_$[26]) === _$[27]) { // _$[26]='orgin' _$[27]='mapp'
                m.cookie(_$[28], null, {   //_$[28]='orgin'
                    path: _$[29], //_$[29]='/'
                    domain: _$[30]    //_$[30]='.xiaomi.com'
                });
                return
            };
            var sUserAgent = navigator.userAgent;
            //   $[31]=  'Android', $[32]= 'iPhone', $[33]='iPod', $[34]= 'Symbian'
            // 如果瀏覽器是移動設備,跳轉到url
            if (sUserAgent.indexOf(_$[31]) > -0x1 || sUserAgent.indexOf(_$[32]) > -0x1 || sUserAgent.indexOf(_$[33]) > -0x1 || sUserAgent.indexOf(_$[34]) > -0x1) {
                location.href = url
            }
        },
        //初始化方法
        init: function() {
            var _this = this;
            _this.doms()
        }
    };
    m.init()
})();

//jsonp的回調函數  json為服務端返回的數據
function hdcontrol(json) {
    var phonestart = json.status.miphone.hdstart,  //是否手機搶購開始
        phonestop = json.status.miphone.hdstop,    //是否手機搶購結束
        boxstart = json.status.mibox.hdstart,      //是否盒子搶購開始
        boxstop = json.status.mibox.hdstop;        //是否盒子搶購結束
    servertime = downServertime = json.stime;
    //服務端與客戶端的時差
    var diffTime = parseInt(servertime - miphoneBuy.localTime());
    //_$[35]='xm_difft_hd' _$[36]='/'  _$[37]='.xiaomi.com'  寫入xm_difft_hd=時差 到cookie中
    m.cookie(_$[35], diffTime, {
        path: _$[36],
        domain: _$[37],
        expires: 0x1 //一天后過期
    });
    //如果等待已經結束
    if (isRollStatus) {
        if (json.status.allow) {  //排隊成功,服務端返回排隊成功,這個真的太幸福,你基本搶到了!跳轉到那個購買頁面,選擇一下產品和驗證碼提交就ok了
            if (isPhone === true) { //買手機
                isPhone === false;   //還是一個bug,我認為,這里應該用 isPhone=false; 不過這里也沒什么關系  ps:小米程序員也是人,雖然 6X12 工作,但偶而也會筆誤 ,哈哈
                //_$[38]=''  _$[39]='http://t.hd.xiaomi.com/s/'
                if (json.status.miphone.hdurl == null || json.status.miphone.hdurl == _$[38]) {   //如果 hdurl為空,重新刷新頁面
                    window.location.reload()
                } else {
                    //_$[39]='http://t.hd.xiaomi.com/s/'
                    //瀏覽器url 轉向到購買小米頁面
                    //注意如果真訪問這個url是沒用的,系統會自動跳轉到排序頁面,只有排列成功才能進入這個頁面 ps:小米人家也不是吃素的,
                    location.href = _$[39] + json.status.miphone.hdurl
                }
            } else if (isBox === true) {   //買盒子,或電視,其它第二選項
                isBox === false; //同上
                ////_$[40]=''    _$[41]='http://t.hd.xiaomi.com/s'
                if (json.status.mibox.hdurl == _$[40] || json.status.mibox.hdurl == null) {
                    window.location.reload()
                } else {
                    location.href = _$[41] + json.status.mibox.hdurl
                }
            }
        };
        isRollStatus = false
    };
    //只有手機搶購   寫入cookie
    if (phonestart === true && phonestop === false && boxstart === false && boxstop === true) {
        // 盒子已售完     'xm_xt_obox',//42   '/',//43   '.xiaomi.com',//44
        m.cookie(_$[42], 0x1, {
            path: _$[43],
            domain: _$[44],
            expires: 0x1
        });
        //'xm_xt_ophone',//45    '/',//46     '.xiaomi.com',//47
        m.cookie(_$[45], null, {
            path: _$[46],
            domain: _$[47]
        });
        miphoneBuy.box(false);
        stepHtml.five()
    };
    //只有盒子搶購
    if (phonestart === false && phonestop === true && boxstart === true && boxstop === false) {
        //手機已售完 'xm_xt_ophone',//48     '/',//49    '.xiaomi.com',//50
        m.cookie(_$[48], 0x1, {
            path: _$[49],
            domain: _$[50],
            expires: 0x1
        });
        //'xm_xt_obox',//51     '/',//52    '.xiaomi.com',//53
        m.cookie(_$[51], null, {
            path: _$[52],
            domain: _$[53]
        });
        miphoneBuy.box(false);
        stepHtml.six()
    };
    //手機,盒子 都沒了
    if (phonestart === false && phonestop === true && boxstart === false && boxstop === true) {
        // 'xm_xt_pre',//54  '/',//55  '.xiaomi.com',//56
        m.cookie(_$[54], 0x1, {
            path: _$[55],
            domain: _$[56],
            expires: 0x1
        });
        // 'xm_xt_obox',//57    '/',//58    '.xiaomi.com',//59
        m.cookie(_$[57], null, {
            path: _$[58],
            domain: _$[59]
        });
        // 'xm_xt_ophone',//60    '/',//61    '.xiaomi.com',//62
        m.cookie(_$[60], null, {
            path: _$[61],
            domain: _$[62]
        });
        miphoneBuy.saleOut()
    }
};
var miphoneBuy = {
    localTime: function() {       //本地時間
        return parseInt(new Date().getTime() / 0x3e8) //0x3e8 是16進制 表示10進行的1000
    },
    jsonInter: function() {  //利用jsonp 調用服務端  這個除了排隊處,還用來做時差,還做手機和盒子搶購的狀態
        var timestamp = new Date().getTime();
        //'http://tc.hd.xiaomi.com/hdget?callback=hdcontrol&_=',//63  這個地址就是服務排列的url
        // 'jsonp' //64
        m.creatJs(_$[63] + timestamp, _$[64]);
    },
    checkCookie: function() {
        var _this = this;
        //    'xm_xt_pre',//65  如果有值,說明小米和盒子已經出售完
        if (m.cookie(_$[65])) {
            _this.saleOut()
        } else {
            // 'xm_difft_hd',//66
            if (!m.cookie(_$[66])) {  //如果cookie 中  xm_difft_hd 沒有值,就提交服務端,取時間或者排隊
                _this.jsonInter()
            };
            setTimeout(function() {
                // 'xm_difft_hd',//67  服務器時間=本地時間+時差
                servertime = downServertime = miphoneBuy.localTime() + parseInt(m.cookie(_$[67]));
                _this.jugeStatus()
            }, 0x64) //0x64 就是100
        }
    },
    saleOut: function() {
        if (window.timeInter) {
            clearInterval(timeInter)
        };
        stepHtml.four();
        miphoneBuy.box(false)
    },
    jugeStatus: function() { //狀態判斷 ,定時器每秒查一下狀態
        var _this = this;
        _this.timeNode();
        timeInter = window.setInterval(function() {
            _this.timeNode();
            servertime++
        }, 0x3e8) // 0x3e8 =1000 每秒執行一次
    },
    configs: {
        //    '10/15/2013  12:00:00',//68   開搶的開始時間
        startDate: new Date(_$[68]).getTime(),
        preLogMin: 0x1e    // 0x1e=30
    },
    timeNode: function() {   //時間結點 ,根據本地的服務器時間,判斷現在處於哪一步,然后執行哪一步
        var _this = this;
        var _this = this;
        var nowTime = servertime * 0x3e8, //服務器的當前時間
            startTime = _this.configs.startDate,
            //開始倒計時時間
            preLogTime = startTime - _this.configs.preLogMin * 0xea60;    //  0xea60 =60000
        if (m.cookie(_$[69])) { // 全部都售完   'xm_xt_pre',//69
            _this.saleOut();
            return
        };
        if (m.cookie(_$[70])) {     //如果有時差,'xm_difft_hd',//70      'xm_difft_hd',//71
            //服務器的時間 =本地時間+ 時間差 ,倒計時都是用服務器時間
            downServertime = miphoneBuy.localTime() + parseInt(m.cookie(_$[71]))
        };
        if (nowTime < preLogTime) {      //進入倒計時,還沒即將開始,暫時可以不用登錄
            stepHtml.one();
            _this.timeOut()
        } else if (nowTime >= preLogTime && nowTime < startTime) {  //已經進入倒計時,即將開始,但還沒開始
            stepHtml.two();
            _this.timeOut()
        } else if (nowTime >= startTime) { //已經開始搶購
            if (m.cookie(_$[72])) {       // 盒子已售完 'xm_xt_obox',//72
                stepHtml.five()
            } else if (m.cookie(_$[73])) {  //手機已售完 'xm_xt_ophone',//73
                stepHtml.six()
            } else {            //盒子和手機都還有
                stepHtml.three()
            }
        }
    },
    timeOut: function() {   //如果有倒計時間,重新觸發倒計時
        var _this = this;
        _this.SetRemainTime();
        if (window.InterValObj) {
            clearInterval(InterValObj)
        };
        //  InterValObj 表示離開始搶購的趕時間倒計時定時器
        InterValObj = window.setInterval(function() {
            _this.SetRemainTime()
        }, 0x3e8)
    },
    SetRemainTime: function() {      //倒計時,設置倒計時時間
        var _this = this,
            endtime = _this.configs.startDate,
            setEndtime = endtime / 0x3e8;
        surplusTime = setEndtime - downServertime;
        if (surplusTime >= 0x0) {  //還在倒計
            var second = Math.floor(surplusTime % 0x3c),   //分鍾
                minite = Math.floor((surplusTime / 0x3c) % 0x3c),   //
                hour = Math.floor((surplusTime / 0xe10) % 0x18),    //小時
                day = Math.floor((surplusTime / 0x15180) % 0x1e);   //
            downServertime++;
            var timeArray = [second.toString(), minite.toString(), hour.toString(), day.toString()];
            // '<span><ins>',//74   '</ins>小時<ins>',//75   '</ins>分<ins>',//76   '</ins></span>秒后開始',//77
            var timeText = _$[74] + timeArray[0x2] + _$[75] + timeArray[0x1] + _$[76] + timeArray[0x0] + _$[77];
            if (hour === 0x0) {  //小時等於0 只要展示分鍾和秒鍾
                // '<span><ins>',//78   '</ins>分<ins>',//79  '</ins></span>秒后開始',//80
                timeText = _$[78] + timeArray[0x1] + _$[79] + timeArray[0x0] + _$[80];
                if (minite === 0x0) {  //如果不到一分,只民法秒鍾
                    //'<span><ins>',//81   '</ins></span>秒后開始',//82
                    timeText = _$[81] + timeArray[0x0] + _$[82]
                }
            };
            //'surTime',//83  'surTime',//84
            // !!對象  對象是否存在的用法   時間結點變化成新的倒計時間
            if ( !! m.$(_$[83])) {
                m.$(_$[84]).innerHTML = timeText
            }
        } else {   //停止倒計時
            if (window.InterValObj) {
                clearInterval(InterValObj)
            }
        }
    },
    box: function(bool) {
        if (bool) {   //顯示 正在排序中 div
            //<div id="boxbg"></div><div id="box"><span class="close" onclick="miphoneBuy.box(false);" title="關閉">X</span><div class="buyNext_wrap"><h3>正在排隊中...</h3>您已在隊伍中,倒計時后請重新進入,稍安勿躁:-)<a id="reback" class="reback_btn">重新進入(<span id="initCount"> </span>)</a></div></div>
            //'boxbg',//85    'box',//86
            var mboxbg = m.$(_$[85]); //排隊div bg
            var mbox = m.$(_$[86]); //排隊div
            //    'px',//87
            mboxbg.style.height = Math.max(document.documentElement.clientHeight, document.documentElement.scrollHeight) + _$[87];
            // 'block',//88  'block',//89
            mboxbg.style.display = _$[88];
            mbox.style.display = _$[89]
        } else {    //隱藏 正在排序中 div
            // 'boxbg',//90   'box',//91    'none',//92    'none',//93
            var mboxbg = m.$(_$[90]);
            var mbox = m.$(_$[91]);
            mboxbg.style.display = _$[92];
            mbox.style.display = _$[93];
            if (window.rollInter) {
                clearInterval(rollInter)   //清楚 排除等待
            };
            Util.retime();
            // 'reback',//94  '重新進入(<span id='initCount'>',//95  '</span>)',//96
            m.$(_$[94]).innerHTML = _$[95] + count + _$[96]
        }
    },
    init: function(option) {
        var _this = this;
        _this.checkCookie()
    }
};
var stepHtml = {
    one: function() {     //第一步 倒計時 即將開始,
        var mhtml = stepHtml.htmlString();
        // 'hdBtns',//97  'hdSubTitle',//98 'hdLnks',//99  'miphone',//100  'mitv',//101 'hdMsg',//102
        m.$(_$[97]).innerHTML = mhtml.btn[0x0];
        m.$(_$[98]).innerHTML = mhtml.subTitle[0x0];
        m.$(_$[99]).innerHTML = mhtml.lnks[0x0];
        m.$(_$[100]).innerHTML = mhtml.phonebtn[0x0];
        m.$(_$[101]).innerHTML = mhtml.tvbtn[0x0];
        m.$(_$[102]).innerHTML = mhtml.msg[0x0];
        m.$(_$[103]).innerHTML = mhtml.bottombtn[0x0]
    },
    two: function() {      //第二步,倒計時 ,離只有不到preLogMin(30)分),與第一步步有點不同,就是如果你還沒登錄,讓你提前登錄
        var mhtml = stepHtml.htmlString();
        var miID = (m.cookie(_$[104])); //    'userId',//104
        if (miID) {
            m.$(_$[105]).innerHTML = mhtml.btn[0x0]  //    'hdBtns',//105   倒計時
        } else {
            m.$(_$[106]).innerHTML = mhtml.btn[0x1]     //    'hdBtns',//106    提前登錄
        };
        //'hdLnks',//107   'hdSubTitle',//108   'miphone',//109   'mitv',//110    'hdMsg',//111    'bottombtn',//112
        m.$(_$[107]).innerHTML = mhtml.lnks[0x0];
        m.$(_$[108]).innerHTML = mhtml.subTitle[0x0];
        m.$(_$[109]).innerHTML = mhtml.phonebtn[0x0];
        m.$(_$[110]).innerHTML = mhtml.tvbtn[0x0];
        m.$(_$[111]).innerHTML = mhtml.msg[0x0];
        m.$(_$[112]).innerHTML = mhtml.bottombtn[0x0]
    },
    three: function() {        //第三步,開始搶,兩個都還有
        var mhtml = stepHtml.htmlString();
        // 'hdBtns',//113  'hdSubTitle',//114   'miphone',//115  'mitv',//116    'hdMsg',//117  'hdLnks',//118    'bottombtn',//119
        m.$(_$[113]).innerHTML = mhtml.btn[0x2];
        m.$(_$[114]).innerHTML = mhtml.subTitle[0x0];
        m.$(_$[115]).innerHTML = mhtml.phonebtn[0x1];
        m.$(_$[116]).innerHTML = mhtml.tvbtn[0x1];
        m.$(_$[117]).innerHTML = mhtml.msg[0x4];
        m.$(_$[118]).innerHTML = mhtml.lnks[0x0];
        m.$(_$[119]).innerHTML = mhtml.bottombtn[0x1]
    },
    four: function() {       //第四步 ,支付
        //'hdBtns',//120  'miphone',//121  'mitv',//122   'hdSubTitle',//123  'hdMsg',//124   'hdLnks',//125  'bottombtn',//126
        var mhtml = stepHtml.htmlString();
        m.$(_$[120]).innerHTML = mhtml.btn[0x3];
        m.$(_$[121]).innerHTML = mhtml.phonebtn[0x2];
        m.$(_$[122]).innerHTML = mhtml.tvbtn[0x2];
        m.$(_$[123]).innerHTML = mhtml.subTitle[0x3];
        m.$(_$[124]).innerHTML = mhtml.msg[0x3];
        m.$(_$[125]).innerHTML = mhtml.lnks[0x3];
        m.$(_$[126]).innerHTML = mhtml.bottombtn[0x2]
    },
    five: function() {    //第五步, 小米電視或盒子已售罄,但還有小米手機
       //'hdBtns',//127   'miphone',//128    'hdSubTitle',//129   'mitv',//130   'hdMsg',//131    'hdLnks',//132   'bottombtn',//133
        var mhtml = stepHtml.htmlString();
        m.$(_$[127]).innerHTML = mhtml.btn[0x4];
        m.$(_$[128]).innerHTML = mhtml.phonebtn[0x1];
        m.$(_$[129]).innerHTML = mhtml.subTitle[0x2];
        m.$(_$[130]).innerHTML = mhtml.tvbtn[0x2];
        m.$(_$[131]).innerHTML = mhtml.msg[0x1];
        m.$(_$[132]).innerHTML = mhtml.lnks[0x1];
        m.$(_$[133]).innerHTML = mhtml.bottombtn[0x1]
    },
    six: function() {   //第六部, 小米手機已售罄,但還有小米電視或盒子
        //'hdBtns',//134  'miphone',//135   'hdSubTitle',//136   'mitv',//137  'hdMsg',//138  'hdLnks',//139   'bottombtn',//140
        var mhtml = stepHtml.htmlString();
        m.$(_$[134]).innerHTML = mhtml.btn[0x5];
        m.$(_$[135]).innerHTML = mhtml.phonebtn[0x2];
        m.$(_$[136]).innerHTML = mhtml.subTitle[0x1];
        m.$(_$[137]).innerHTML = mhtml.tvbtn[0x1];
        m.$(_$[138]).innerHTML = mhtml.msg[0x2];
        m.$(_$[139]).innerHTML = mhtml.lnks[0x2];
        m.$(_$[140]).innerHTML = mhtml.bottombtn[0x2]
    },
    htmlString: function() {
        var htmlSum = {
            //'<span class="untime"><label id="surTime" class="unbtn"></label></span>',//141
            //'<a class="unbtn" target="_blank" href="http://p.www.xiaomi.com/zt/xm_account/limitfacade.html?third=http%253A%252F…MmRiNzY0ZWY0MDJlYTVkODBlZA%252C%252C&sign=3C15pt35v9KK5SR8saFsKQ89uRo%253D" title="提前登錄" >提前登錄</a>',//142
            //'<a class="btn1 cu" onclick="showBox(\'phone\');" id="buyNext">購買手機>><span class="value">1999元</span></a><span class="line">|</span><a class="btn2 cu" onclick="showBox('box');"  title="購買盒子">購買電視>><span class="value">2999元</span></a>',//143
            //'<a class="btn1 cu" href="http://t.hd.xiaomi.com/r/?_a=payment_check" target="_blank"><span class="value">1999元</span>支付手機>></a><span class="line">|</span><a class="btn2 cu" href="http://t.hd.xiaomi.com/r/?_a=payment_check_tv" target="_blank">支付電視>><span class="value">2999元</span></a>',//144
            //'<a class="btn1 cu" onclick="showBox(\'phone\');">購買手機>><span class="value">1999元</span></a><span class="line">|</span></a><a class="btn2 cu" href="http://t.hd.xiaomi.com/r/?_a=payment_check_tv" target="_blank">支付電視>><span class="value">2999元</span></a>',//145
            //'<a class="btn1 cu" onclick="showBox(\'box\');">購買電視>><span class="value">2999元</span></a><span class="line">|</span><a class="btn2 cu" href="http://t.hd.xiaomi.com/r/?_a=payment_check" target="_blank">支付手機>><span class="value">1999元</span></a>',//146
            btn: [_$[141], _$[142], _$[143], _$[144], _$[145], _$[146]],
            //'',//147
            //'小米手機3已售罄,您可繼續購買小米電視',//148
            //'小米電視已售罄,您可繼續購買小米手機3',//149
            //'全部小米手機3及小米電視已售罄',//150
            subTitle: [_$[147], _$[148], _$[149], _$[150], ],
            //'',//151
            //'購機成功用戶請在3小時內下單,3小時內支付。[url=http://t.hd.xiaomi.com/r/?_a=payment_check ]支付手機》[/url]',//152
            //'購機成功用戶請在3小時內下單,3小時內支付。[url=http://t.hd.xiaomi.com/r/?_a=payment_check_tv]支付電視》[/url]',//153
            //'購機成功用戶請在3小時內下單,3小時內支付。',//154
            //'購機成功用戶請在3小時內下單,3小時內支付。[url=http://t.hd.xiaomi.com/r/?_a=payment_check ]支付手機》[/url][url=http://t.hd.xiaomi.com/r/?_a=payment_check_tv]支付電視》[/url]',//155
            msg: [_$[151], _$[152], _$[153], _$[154], _$[155]],
            //'[url=http://t.hd.xiaomi.com/r/?_a=20131009&_op=check]手機預約查詢[/url][url=http://t.hd.xiaomi.com/r/?_a=20131009_tv&_op=check]電視預約查詢[/url]',//156
            //'[url=http://t.hd.xiaomi.com/r/?_a=20131009&_op=check]手機預約查詢[/url][url= http://t.hd.xiaomi.com/c/?_a=20131015_mi_tv_3a52v09cc&_op=check]電視購買查詢[/url]',//157
            //'[url=http://t.hd.xiaomi.com/c/?_a=20131015_m3_7e52109fc&_op=check]手機購買查詢[/url][url=http://t.hd.xiaomi.com/r/?_a=20131009_tv&_op=check]電視預約查詢[/url]',//158
            //'[url=http://t.hd.xiaomi.com/c/?_a=20131015_m3_7e52109fc&_op=check]手機購買查詢[/url][url= http://t.hd.xiaomi.com/c/?_a=20131015_mi_tv_3a52v09cc&_op=check]電視購買查詢[/url]',//159
            //' ',//160
            lnks: [_$[156], _$[157], _$[158], _$[159], _$[160], ],
            //'<a class="btn de"><span>1999元(16GB)</span>即將開始</a>',//161
            //'<a id="hdredPhone" onClick="showBox(\'phone\');" class="btn cu"><span>1999元(16GB)</span>立即購買</a>',//162
            //'<a class="btn" href="http://t.hd.xiaomi.com?_a=payment_check " target="_blank"><span>1999元(16GB)</span>立即支付</a>',//163
            phonebtn: [_$[161], _$[162], _$[163]],
            //'<a class="btn de"><span>2999元</span>即將開始</a>',//164
            //'<a onClick="showBox(\'box\');" class="btn cu"><span>2999元</span>立即購買</a>',//165
            //'<a class="btn" href="http://t.hd.xiaomi.com/r/?_a=payment_check_tv" target="_blank"><span>2999元</span>立即支付</a>',//166
            tvbtn: [_$[164], _$[165], _$[166]],
            //'<label class="btn unbtn">即將開始</label>',//167
            //'<a id="hdblackPhone" onClick="showBox(\'phone\');" class="btn cu">購買手機</a>',//168
            //'<a class="btn cu" href="http://t.hd.xiaomi.com/r/?_a=payment_check " target="_blank">支付手機</a>',//169
            bottombtn: [_$[167], _$[168], _$[169]]
        };
        return htmlSum
    }
};
var randomCount = parseInt(Math.random() * (0xa - 0x5 + 0x1) + 0x5),  //隨機取5 到 11 中的整數
    count = randomCount,
    CONFIG = {
        count: randomCount
    },
    Util = {
        time: function() {   // 進入活動(排列)時間倒計
            var b = m.$(_$[170]);  //  'reback',//170
            if (count === 0x0) {  //如果倒計時時間為0
                b.innerHTML = _$[171];  // '進入活動',//171
                b.className = _$[172];  // 'reback_btn_next',//172
                this.start();
                return false
            };
            count = count - 0x1;
            b.innerHTML = _$[173] + count + _$[174]//'重新進入(<span id=\'initCount\'>',//173   '</span>)',//174
        },
        start: function() {    //進入活動(開始排列搶購)
            var me = this,
                reback = m.$(_$[175]);  // 'reback',//175
            reback.onclick = function() {  //點擊進入活動按鈕,
                isRollStatus = true;
                miphoneBuy.jsonInter();   //提交服務端排隊
                me.retime();
                reback.onclick = null;
                return false
            }
        },
        retime: function() {       //重新計時 count時間重新設
            m.$(_$[176]).className = _$[177]; //'reback',//176      'reback_btn',//17
            count = CONFIG.count
        }
    };
var loginInfo = {
    data: {
        userId: 0x0,
        userName: _$[178]     //'',//178
    },
    init: function() {
        this.data.userId = m.cookie(_$[179]); // 'userId',//179 從cookie中取userid
        if (!this.data.userId) return false;   //沒取到,直接返回
        //'XM_',//180  '_UN',//181   '',//182
        this.data.userName = (this.data.userId) ? m.cookie(_$[180] + this.data.userId + _$[181]) : _$[182];
        // '',//183      如果有用戶id,沒用用戶名,通過jsonp 取用戶信息,回調  loginInfo.getAccountInfo 方法
        if (this.data.userName == null || this.data.userName == _$[183]) {
            var script = document.createElement(_$[184]);   // 'script',//184
            //'https://account.xiaomi.com/pass/userInfoJsonP?userId=',//185  '&callback=loginInfo.getAccountInfo',//186
            script.src = _$[185] + this.data.userId + _$[186];
            script.type = _$[187]; //'text/javascript',//187
            script.async = true;   //異步
            document.getElementsByTagName(_$[188])[0x0].appendChild(script) // 'head',//188
        } else {
            this.upUserInfo()
        }
    },
    upUserInfo: function() {
        var nickName = this.data.userName;
        if ( !! m.$(_$[189])) {      // 'LoginArea',//189
            //'LoginArea',//190  '歡迎您 ',//191  '!<a href=\'http://order.xiaomi.com/site/logout\'>退出</a>',//192
            m.$(_$[190]).innerHTML = _$[191] + nickName + _$[192];
            //'LoginArea',//193  '12px',//194
            m.$(_$[193]).style.paddingLeft = _$[194]
        }
    },
    getAccountInfo: function(data) {
        if (data.userId) {
            this.data.userName = (data.uniqName) ? data.uniqName : data.userId;
            var option = {
                path: _$[195],    // '/',//195
                domain: _$[196]    //'.xiaomi.com',//196
            };
            //'XM_',//197  '_UN',//198
            m.cookie(_$[197] + this.data.userId + _$[198], this.data.userName, option);
            this.upUserInfo()
        }
    }
};

function showBox(gtype) {   //彈出人太多了div   gtype 什是手機還是盒子
    if (m.cookie(_$[199])) { // 'userId',//199
        if (gtype === _$[200]) {   //  'phone',//200
            isPhone = true
        } else if (gtype === _$[201]) {  // 'box',//201
            isBox = true
        };
        miphoneBuy.box(true);
        m.$(_$[202]).innerHTML = CONFIG.count;   //    'initCount',//202
        //重新進入活動定時器
        rollInter = window.setInterval(_$[203], 0x3e8)   //    'Util.time()',//203
    } else {
        location.href = _$[204]  //'http://p.www.xiaomi.com/zt/xm_account/limitfacade.html?third=http%253A%252F…0ZWY0MDJlYTVkODBlZA%252C%252C&sign=3C15pt35v9KK5SR8saFsKQ89uRo%253D',//204
    }
};
m.ready(function() {
    m.phone(_$[205]); // 如果是手機瀏覽器,跳轉到參數的url 'http://p.www.xiaomi.com/m/zt/open/index.html'//205
    miphoneBuy.init();
    loginInfo.init()
})
View Code

  這段代碼除了m.doms的方法之外,其它都還比較簡單。讓我還沒開始享受就完了。也讓我成了標題黨。
    總結一下這段代碼的意思。
   
先看一下,10.15,排列的url(其中1382068597029表示當前時間的getTime()值)
    http://tc.hd.xiaomi.com/hdget?callback=hdcontrol&_=1382068597029

    返回值

hdcontrol({"stime":1382068631,"status":{"allow":false,"miphone":{"hdstart":false,"hdstop":false,"hdurl":"","duration":null},"mibox":{"hdstart":false,"hdstop":false,"hdurl":"","duration":null}}})
View Code

  
這段代碼只是搶購js的前端排隊代碼,真正的排除代碼當然是放在后台的服務器上了。也就是說,你完全知道這段代碼,對你搶購也沒太大的幫助。如果排隊沒成功(json.status.allow=false),直接訪問購買的頁面,服務端會讓你跳轉到排隊頁面。

那服務端的排列規則,只小米自己知道。有時可能公平,也可能不公平(也人說他是直接標志的,我覺得這個可能性比較低)。
   
以10.15這次搶購為例子,可以肯定小米給每個帳號的概率肯定是不一樣的。我想這樣做的目的只防止黃牛,減少不滿。但很多時候也會誤傷。如果黃牛的特點跟普通用戶一樣,或者普通用戶也當小黃牛。這時誤傷的概率就比較大了。這個要靠小米的后台分析能力了。他們最好的辦法就是增加供給。

    扯遠了,又跑題了。這段代碼,進入頁面ready
后就執行miphoneBuy.init方法,方法里面里的checkCookie,如果第一次登錄,調用就取一下miphoneBuy.jsonInter()服務器的時間。然后啟動定時器,每秒鍾執行一次,查看現在的狀態,根據服務器的時間與開始搶的時間(如果已經開始搶購了,還要根據cookie中手機和盒子是否已經saleout
,這個cookie是由調用miphoneBuy.jsonInter()后,服務器的返回值
json.status.miphone.hdstart,json.status.miphone.hdstop,
json.status.mibox.hdstart, json.status.mibox.hdstop;決定寫入的,判斷出展示
stepHtml的哪一步的方法。共6步,代表意思見代碼注解。
   
當倒計時完成,開始搶購時,展示第三步(展示購買按鈕),點擊購買手機,或盒子(TV),發現頁面沒用直接調用服務端排列。
而是var randomCount
= parseInt(Math.random() * (0xa - 0x5 + 0x1) + 0x5),  //隨機取5 到 11
中的整數。隨機取5-11秒,讓頁面再次等待5-11秒,才提交服務端排隊。如果沒排上又是等第一次取的randomCount秒。

   
那了解這段代碼,我們能做些什么。可以在控制台上輸入。
        isPhone = true;        
//或者isBox=true;
        isRollStatus = true;        
miphoneBuy.jsonInter();   //提交服務端排隊
    跳過頁面等待,直接提交服務端排隊 
   
或者把等待進入活動的等待時間修改成更小的值如
    count=0;CONFIG.count=0; 
   
或者寫個程序,登錄后,保持sesion,直接訪問排除url,返回成功直接進入購買頁面。

    那這樣我們這樣有沒有作用呢?
   
這取決於服務端的規則。
    1,如果服務端完全公平,都不考慮黃牛,不考慮你調用次數,這個代碼很有作用。這以現在情況我覺得不太可能
   
  2,如果服務端,有做防止黃牛情況,而且根據不同的帳號給不同的概率,而且還做了防頻繁提交。
    
那我們的代碼只能設計成count=5;CONFIG.count=5;但作用有只有一點點點。
     如果我是開發者,這種情況比可能性最大

    3,如果服務端,是直接分配好了,打標志。那我們代碼根據沒作用。我覺得這個不太可能。
    以上純屬理論分析。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM