13WebSocketでチャットを作ったらN高生たちにめちゃくちゃに壊された件JavaScriptセキュリティフロントエンドN高等学校はじめにN高等学校2年のKakudoです、初めてアドベントカレンダーを書かせていただきます。WebSocketを使ってみようと簡単なWebアプリを作って公開したところ先輩方にありがたい「ご指導」をたくさんいただいたので、身をもって学んだことを書こうと思います。今回の話は同意の上でやってることなので、「勉強」等と称して他の人のサイトを攻撃するのはやめてください!プレイグラウンドと化したアプリについて本題から離れるので詳しくは書きませんが、WebSocketでリアルタイムで投稿内容が共有される掲示板のようなサイトです(チャットアプリに近いと思います)。Siteという名称は歴史的なものらしい・・分かりにくい)。最初、サーバーからクライアント全員にメッセージを共有する際、クライアントJSではテンプレート文字列を使ってHTMLを生成していました。投稿の内容が入って送られてくるとします。`<div>${msg.message}</div>`;お分かりの通り、このコードではサーバーから送られてきた新規メッセージをそのままHTMLに突っ込んでしまっています。このため、HTMLやJavaScriptとして意味を持つ文字列が送られてきてしまうと、ブラウザで任意のコードが実行できてしまいます。(ダブルクオーテーション)等が入るとサーバーでJSONがパースできなくなって落ちたりします。入れることでブラウザがHTMLやJSなどの特別な文字列として処理しなくなるので、防ぐことができます。等がエスケープできる。メッセージの長さ制限ご指導3000万を超える文字数が送られてきたら流石に重くなりますね・・・(実際にブラウザがカックカクになりました)。long';}これで完了かというとそうではない。ご指導を受けたブラウザからこういう感じで送られると先述のでは弾けないです。string';}なので、こんな感じで配列などの文字列以外のデータを弾くようにしないといけません。ご指導が続くそもそもチェックするまでに落とされると困ります。ここまでの方法はメモリを逼迫させるほどのリクエストが投げつけられることを想定していません(512MBしかメモリ積んでないサーバーに256MBのリクエストが飛んできて、そのままメモリに載ってしまうと一瞬で使い切ってプロセスが落とされてしまう、というか落とされた。制限することで、それを超えるリクエストが許可されなくなります。運よく被害はなかったけど気を付けるべき「ご指導」UTF-8(emojiなど)今回、データベースへのメッセージの保存をしていないため(再起動すると履歴は消える)影響はなかったですが、emoji等(そもそも非ASCII文字だけでも)データベースが対応してない場合エラーとなってしまいます。文字コードは前もって確認しておくべきです(今回ではないですが、以前それでエラーが出ました)。高等学校IT×グローバル社会を生き抜く“創造力”を身につけ、世界で活躍する人材を育成する。upLoginユーザーは見つかりませんでした。