BMSG ストアをBug fixしながら注文した話

うちの奥さんがBE:FIRSTのファンで、今日は15時から限定商品の再販があるとかで連打してるけどつながらない。

ふ〜ん　と思いながら僕も参戦してデバッグしながら1つ買えたのでエンジニアリング的にメモ

ヘッダのレスポンスは早いけど

アクセスが多くて503とかが頻発するのはわかるけど、意外とローディング待ちも多い。タイトルが返ってくるのでヘッダーレスポンスは意外と早いらしいが中身が返ってこないところからレンダリングの問題っぽい(disk IOかも)

そして503に堂々と”nginx”とでてくるので、セキュリティも不安に。。。

10分ぐらい粘るとカートに商品は入ったので会員登録からクレカ決済入力、3Dセキュア認証まで行って戻ってくるところでエラー。

「一番イヤなところでエラーだな・・・」と思いながらURL直やReloadを試したけどだめ。

$が見つからない

諦めて最初に戻ると今度は次へボタンが見えない。ただのCSSの問題ではなさそう。

欄の下に２つボタンっぽいのがあるので、「左下かな。。こわいから文字を読むか」と思ってInspectすると左が「戻る」右が「次へ」だったので勘に頼らなくてよかった〜　と思いながら押すと押せない。

コンソールを見ると$が見つからないとのこと。

「私知ってるあなたjQueryね！」と頭の中でトトロのメイちゃんっぽいのが叫んだけど、リソースを開くと

そのようですね〜。

重くなる事がわかってるサイトでリソースを同じところから配信するのはいかがなものかと思いますが、気持ちはわからなくもない(CDN落ちたら嫌だもんね。わかるよ。でもこの品質だとそういう事を考えてというよりは多分public directoryに入れるものだと思って運用してるんですかね)

しかし今回落ちてるのはこのサイトなので、、
何度リロードしてもだめなので、ページレンダリングするやつとファイル返すやつが別なのかな？とりあえずjQueryをconsoleよりinject。

(function (){
    function l(u, i) {
        var d = document;
        if (!d.getElementById(i)) {
            var s = d.createElement('script');
            s.src = u;
            s.id = i;
            d.body.appendChild(s);
        }
    } l('//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js', 'jquery')
})();

これで1ページ目はうまく行った。

次ページはただ突っ込んでもNG。そいつはロード時にイベントリスナーの設定をしていた。そのコードをコピペして（幸い短いし読めるレベル）再実施して次へ。

そして今度はクレカが怖いのでステップ減らすためにも請求書払に(GMOペイメントだろうけど、多分後処理だろうから外部に飛んだりしないだろうと)

無事買えた

買えて購入のメールも届いた。

BMSG Store開発担当者へ

楽しかったですが、直せた自分が買えたという若干の背徳感が。。以下提案です。

マシンリソースが増やせないのであれば、せめて必要なcss, jsらを1 packageにして外部配信に
それが難しければせめてjs loadに失敗してもボタンを押して進められるような設計を
cssがなくても読めるページ構成だったためそこは助かりました

Yuki Sato

About