SQLインジェクションとXSS
なぜ学ぶか： Webセキュリティの二大古典がSQLインジェクションとXSS。名前は怖いですが、仕組みは「ユーザー入力が『データ』ではなく『命令』として実行されてしまう」という一点。現代のツール（React・Supabase）は多くを自動で防いでくれますが、その「守りを自分から外す書き方」を知っておくことが大事です。
共通の原理：入力が『命令』になる
本来ただのデータであるべき入力が、SQLやHTMLの命令として解釈されると乗っ取られます。両者に共通する根っこです。
SQLインジェクション
入力をSQL文に直接つなげると、'; DROP TABLE ...のような文字列が命令として実行される攻撃。Supabaseの.eq()など正規の方法を使えば自動で防がれます。
XSS
入力に含まれた<script>が、他ユーザーの画面で実行される攻撃。Reactは{}の中身を自動でエスケープする（ただの文字として表示する）ので、通常は安全です。
自分で守りを外す危険な書き方
ReactのdangerouslySetInnerHTMLは名前の通り危険な窓。生SQLを文字列連結で組むのも同じ。AIがこれらを使っていたら要注意です。
コード例
// XSS: React は通常、自動でエスケープしてくれるfunction Comment({ text }: { text: string }) { // text が "<script>..." でも、ただの文字として表示される（安全） return <p>{text}</p>;} // ❌ 危険: 自分で「守り」を外す書き方function DangerousComment({ html }: { html: string }) { // 名前の通り危険。ユーザー入力を渡すと XSS の穴になる return <div dangerouslySetInnerHTML={{ __html: html }} />;}
ReactもSupabaseも「普通に使えば安全」に設計されています。危険なのはdangerouslySetInnerHTMLや生SQL連結のように、自分から守りを外す書き方。AIコードでこれらを見たら理由を確認しましょう。
ステップ 1 / 2
※ カリキュラムの内容はAIが生成しており、誤りが含まれる場合があります。正確な情報は公式ドキュメント等でご確認ください。