WEBアプリをNode.jsで書いてHeroku上にあげた話 1の続きです。

FireCommits

githubの草を撃ってシェアするゲーム。コミット数多い凄腕エンジニアの草ほど強い。
https://fire-commits.herokuapp.com/

Facebookで公開したよーって投稿する前にGoogle Analyticsにだけ登録しておきました。設定方法はたしかへいっ！Googleアナリティクス導入時の初期設定を一緒にやってみないかい？を参考にしました。これの真似をしてけばの前にトラッキングコードを貼り付けるだけなのですが、Google Analyticsのサイトに飛ぶとリアルタイムのサマリーは変化するのに、ユーザのサマリーは0でえっ...なんで反映されてないの？ってなったけど、ユーザのサマリーの方は1,2日後に反映されるそうなので、あまり気にせず設置を完了しました。んで、公開しました。

訪問者はめちゃくちゃ！ってほど多くはありませんでしたが、

北は北海道、南は沖縄の人がアクセスしてくれて嬉しかったです

公開してから気づいたバグ？的な何か

データストアのデータを変数に格納して使ってた

今回実装したmilkcocoaを用いたランキングの疑似実装は、データストアに保存してある30人のスコアデータを一旦内部変数として保存して、ゲーム終了時に今回のスコアと内部変数に保存しておいたスコアデータとを見比べて、ランキング圏内ならデータを更新する　という流れで実装してました。
これってローカルで自分一人で開発してる時は、何も問題がなかったんです。だけど、公開してみんなが同時にアクセスすると、誰かのスコアがランキング圏内に入ってデータを更新しても、他の人の内部変数は更新はされないので、競合みたいにみんなで一番低いスコアの人のデータを更新しまくっちゃう！みたいな感じになっちゃいました。
なので、ランキングのスコアデータは更新する一歩手前で取得して確認！更新！というふうに変更したら、内部でスコアを持つ時間が短くなったので、競合的なのは起きにくくなりました。

データストアにpushする前にバリデーションしてなかったんご

公開した日の夜、サイトにアクセスしてみると...

ってアラートが表示されました。えっこんなjs書いたっけ。。。

milkcocoaのデータストアを開いて見てみると、

{"name":"<script>alert('hoge');";</script>","image":"https://avatars0.githubusercontent.com/u/11733664…","count":140,"score":9999999999999}

と入ってました笑。まさに致命的なミス！当初ランキングを表示する時、データストアから取得したデータをそのままhtmlにブッ込んでいたので、nameに入ったスクリプト文が実行→ほげ　
浅はか過ぎました。これが怖いスクリプト文でなくてよかったとしか言いようがない。milkcocoaの設定で簡単にバリデーションと、許可するOriginを設定できるので、設定しました。最初は設定していなかったので、どこかしらのエンジニアさんに優しいスクリプト文を入れて警告してくれてありがとうございました。以後気をつけます。

動いてるjsの変数を書き換えれるって知っただけでも今回の公開はかなりの収穫でした。
ブレイクポイントの編集を使ったちょっと変わったデバッグテク
 Firebugを使って実行中のJavascriptの変数を書き換える
セキュリティももっと気にしてコード書ける人間になりたいなぁ。以上、あげた感想でした。