Open1
React開発で最低限押さえておきたいセキュリティ周り
msy.Reactを使ったフロントエンド開発で押さえておきたいセキュリティの話
- データバインディングでデフォルトのXSSプロテクションを使用する
- 危険なURLとURLベースのスクリプトインジェクションに気をつけよう
- HTMLのサニタイズとレンダリング
- DOMへの直接アクセスを避ける
- セキュアなReactのサーバーサイドレンダリング
- 依存関係にある既知の脆弱性をチェックする
- JSONインジェクション攻撃を回避する
- 脆弱性のないバージョンのReactを使用する
- リンターコンフィギュレーションを使用する
- 危険なライブラリコードを避ける
基本的なもの（ほぼ常識レベル）
クロスサイトスクリプティング
Reactでは、デフォルトでなるべき脆弱性を持たないように構築されているため基本的には気にしなくていいものではありますが、場合によってはクロスサイトスクリプティングを発生させかねません。
Reactでは基本的に{}で囲ったものはクロスサイトスクリプティングの攻撃から守ってくれます。
これは、JSXがデフォルトで埋め込まれた値をレンダー前にエスケープしてくれるので、悪質なスクリプトが入っていても全てレンダー前に文字列になってしまいます。
このようにReactを使う際に基本的にはXSS攻撃を心配する必要はありませんが、dangerouslySetInnerHTML を使用した際には注意が必要です。
これはReactのレンダー前のエスケープを無効化するため、XSS攻撃を受ける危険性が高まります。
参考情報