別サイトでiframe使いたいけどセキュリティ設定に苦しめられた話
「test1.hoge」のとあるページを「test2.hoge」で表示したい。
普通にiframe使うと思いますが「test1.hoge」のセキュリティが効いてブロックされる。。。
ググるけど英語サイトばかりで苦労しました。。。
X-Frame-Options
クリックジャッキングの対策でNGINXのconfに下記が設定されておりました。
add_header X-Frame-Options "SAMEORIGIN";
調べたらX-Frame-Optionsで有効な項目が下記になる。
・SAMEORIGIN
表示できるのは同じドメイン内のみ(いらなくない?)
・DENY
みんな禁止!
・ALLOW-FROM uri
指定したURIは表示できる
ALLOW-FROM使えば解決じゃん!って思って下記に修正。
add_header X-Frame-Options "ALLOW-FROM test2.hoge";
しかし表示できず。。。
どうやらALLOW-FROMは多数のブラウザで効かないようでして。。。
X-Frame-Optionsを使わないと誰でも表示できちゃうのはセキュリティ的によくないし。。。
そしてたどり着いたのが下記ページ。
PTC Windchill ヘルプセンター
frame-ancestors
Content-Security-Policy、CSPというもので代替えができそうな感じ。
ググり続けると下記ページに詳細がありました。

Content-Security-Policyの概要メモ - Qiita
Content Security Policy(CSP)
概要
GoogleTagManagerのカスタムHTMLタグ、カスタムJavaScript変数を制限するために調べた時のメモ。
基本仕様
ホワイトリストを...
frame-ancestorsにURIを指定してあげればよさげ。
X-Frame-Optionsを消して下記を記述。
add_header content-security-policy: "frame-ancestors test2.hoge;";
「test2.hoge」で表示できた!
試しに「test3.hoge」で確認したら表示されない!
これでクリックジャッキング対策のホワイトリスト的なことができました。
コメント