こんにちは、エンジニアの@gorou_178 です。このエントリーはイノベーター・ジャパン Advent Calendar 2021 9日目の記事です。 近年、情報漏えいやセキュリティに関するニュースが多い中、ブラウザも色々な状況を踏まえとても進化しています。 その中で、Cross-Origin-Resource-Policy(CORP)、Content-Security-Policy(CSP)について紹介します。
ブラウザのセキュリティ対応
Specterという脆弱性が2018年に見つかりました。CPUの高速化手法である「投機的実行」をうまく利用して、本来見ることができない他プロセスの情報を読めてしまう脆弱性です。回避するためにはプロセスを分離して他プロセスの情報にアクセスできないようにするしかありません。
webブラウザは、画像や動画・webフォントなどいろいろなリソースを外部から取り込むことで柔軟な表現が可能です。しかしSpecterの登場で、情報が漏洩する恐れがすべてのリソースに対して発生しました。
HTTPおよびブラウザ開発者が、既存の仕組みの良いところを活かしつつセキュアにするべく、セキュリティ機能が実装されました。個別のセキュリティ機能について知ってはいましたが、Specter脆弱性をきっかけに対応が進んでいたことは知らなかったです。 以下サイトで細かな経緯や詳細がまとめられているので参照ください。
前提
上に記載したサイトにも書かれていますが、same-siteとsame-originについて以下をざっくり認識していると設定の意味が理解しやすいと思います。
- same-site: サブドメインが違っても example.com が同じサイト
- www.example.com と news.example.com など
- same-origin: スキーマ・ホスト名・ポート番号すべてが一致するもの
- https://www.example.com/test と https://www.example.com/news/123 はsame-origin
詳しく知りたい方は以下サイトを参照ください。細かい違いが理解できると思います
具体的なセキュリティ対策機能
Cross-Origin-Resource-Policy(CORP)
CORPと書いて「コープ」と読むようです。リソースの読み込みを、same-siteやsame-originに制限できるHTTPヘッダーです。
例えばHTMLで <img src="coffee.jpg" alt="">
と書けば画像を読み込めますが、画像URLを直接指定して自身サイトの画像を外部のサイトに表示することができます。また、本来ログインしたあとでしか閲覧できないコンテンツを外部から読み込めてしまう恐れもあります。*1
基本的にサイト内のリソースを外部で利用させる理由はほとんどないため、制限するべきでしょう(SNSや共有を目的とするサービスは別です)。
Cross-Origin-Resource-Policy
ヘッダーをリソースに対して付与することで、same-siteやsame-originに対してのみ利用を許可できます。
nginxでの設定例
add_header Cross-Origin-Resource-Policy "same-site"; add_header Cross-Origin-Resource-Policy "same-origin";
Content-Security-Policy(CSP)
自身のサイト内のリソース読み込みを制限できるHTTPヘッダーです。CORPは外部からの読み込みを制限する仕組みですが、CSPは内部の読み込みを制限する仕組みです。自サイトで意図しないリソースの読み込みを制限します。
Content-Security-Policy
ヘッダーを付与すると、そのリソースから読み込めるリソースがsame-siteに制限されます。例えばCDNからjsファイルを読み込んでいたとしても読み込みがブロックされます。
Content-Security-Policy-Report-Only
ヘッダーを利用すると、実際にはブロックせずにコンソールに警告として表示させることができるので、事前に影響範囲を確認したい場合はこちらを利用しましょう。
nginxでの設定サンプル
add_header Content-Security-Policy-Report-Only "default-src 'self';"; add_header Content-Security-Policy "default-src 'self';";
まとめ
ブラウザのセキュリティ設定のCORPとCSPを重点的に紹介しました。 2021年のGoogle I/O 「From security as opt-in to security by default | Session」の動画でも言及されていましたが、今まで許可していたあらゆる権限(オプトイン)を、真逆の制限(オプトアウト)していく必要があります。アドベントカレンダーのテーマ『表と裏』に少しは引っかかったでしょうか。しばらくブラウザのセキュリティについてオプトアウトの意識を持ちつつ、ブラウザの動向を見守りたいです。
*1:適切にセッションやアクセス権限が設定されていれば問題になりにくいですが