搶票季：吐槽12306 & 分享搶票經驗

時間 2019-11-13

標籤吐槽分享經驗简体版

原文原文鏈接

又是一年一度的春運搶票季，無論你是北上、南下或者東進，在外漂泊了一年，有錢沒錢老是要回家過年的。css

【圖片來源於網絡】html

吐槽：12306搶票的悲傷

聽說12306改版了，新版本里面除了UI這些面兒上的改動，還加入了自動刷票、自動提交訂單等實用的功能，而且推出了手機購票軟件，當真是下了一番真功夫！這裏對12306訂票系統的工程師們表示感謝！jquery

可是，等你真的去訂票的時候，你遇到的錯誤多是這樣的：程序員

也多是這樣的：ajax

或者是這樣的：chrome

運氣好點的能見到購票失敗的提示：瀏覽器

這裏真心的恭喜那些搶票成功的同窗們！恭喜發財！紅包拿來！服務器

吐槽：奇葩的驗證碼校驗

先聽我講一下今天搶票的親身經歷：打開12306購票頁面，滿心歡喜的登錄（我對本身的網速仍是有信心的，迅雷下載2MB以上，日常看視頻都只看高清），結果今天在登錄的時候就出了岔子，先是驗證碼沒有顯示，等到驗證碼顯示出來之後我趕忙去輸入，輸完四個字符之後就卡死了，真的是卡死了……網絡

直覺告訴我，12306的驗證碼校驗確定是同步請求，因而打開開發者工具，想來一窺究竟。異步

真正的調用在這裏：

首先看一下common.js，點看之後發現是壓縮過的，從註釋上面能夠看到裏面包含了jquery 1.九、Sizzle CSS Selector Engine（這個沒有用過）、jqPagination、jQuery Form Plugin、jQuery Validation Plugin 1.11.1以及一些ajax的封裝，而真正執行請求的地方是在login.js裏面。

我把login.js下載了下來，而後格式化了輸出，找到了checkRandCode的定義：

checkRandCode: function() {
    var d;
    var c = $("#randCode").val();
    $.ajax({
        url: ctx + "passcodeNew/checkRandCodeAnsyn",
        type: "post",
        data: {
            randCode: c,
            rand: "sjrand"
        },
        async: false,
        success: function(e) {
            if (e.data == "N") {
                d = false;
                $("#i-ok").css("display", "none")
            } else {
                d = true;
                $("#i-ok").css("display", "block")
            }
        }
    });
    return d
}

看到了吧，async:false，果真是走的同步請求，在12306超負載的時候，這個請求會一直掛起，因而就出現了瀏覽器卡死、瀏覽器崩潰等問題，這個跟瀏覽器真不要緊。

怎麼破？一行代碼搞定：

jQuery.extend({ checkRandCode: function () { return true; } });

把這句代碼放在console裏面執行：

直接覆蓋12306的checkRandCode方法，不去服務器走一遭，立刻返回true。

若是你以爲同步請求還可以忍受，那麼看看下面的經歷：我一個不當心我輸錯了字母，驗證碼校驗告訴我錯誤了，我也知道看到了錯誤的地方，而後我去挪動光標，奇葩的事情再次發生，它竟然又執行了上面那個同步的驗證！！！感情12306監聽的是鍵盤事件啊（後來看代碼發現是keyup）：

$("#randCode").on("keyup", function (c) {
    c = c || window.event;
    $("#error_msg").hide();
    if ($("#randCode").val() != "" && $("#randCode").val().length == 4) {
        if (!$.checkRandCode()) {
            $("#error_msg").html(login_messages.randCodeError).attr("class", "error").css("margin-left", "70px");
            $("#error_msg").show();
            return false
        } else {
            $("#i-ok").css("display", "block");
            if (c.keyCode == 13) {
                $("#loginSub").click()
            }
        }
    } else {
        $("#i-ok").css("display", "none")
    }
    b = $("#randCode").val()
})