Nginxで「Refused to display ” in a frame because it set ‘X-Frame-Options’ to ‘deny’.」

2020年7月3日

今回はNginxで「Refused to display " in a frame because it set 'X-Frame-Options’ to 'deny’.」が起きたときの対処法についてご紹介いたします。

Nginxで「Refused to display " in a frame because it set 'X-Frame-Options’ to 'deny’.」

Webアプリケーションでiframeを呼び出しているときに、呼び出し先で「Refused to display " in a frame because it set 'X-Frame-Options’ to 'deny’.」が発生して画面がうまく表示されないときがありました。

呼び出し先のドメインは私の管理下で、設定を変えれる状況です。
しかし、どこをどう変えればうまく表示されるのか分からない状況でした。

試行錯誤の末、次の二つでうまくいきました。
・default.confの「add_header X-Frame-Options DENY」を取り除く
・静的コンテンツの中のソースコードに何らかの変更を加えて更新する

default.confの「add_header X-Frame-Options DENY」を取り除く

私はdocker-composeを使って環境を構築しておりましたが、nginxもdocker-composeの中で作成しておりました。

docker-composeの定義ファイルにdefault.confがありましたが、
「add_header X-Frame-Options DENY」がiframeで呼び出したときにブロックするための設定でした。

ネットに落ちていたものを拾ってそのまま貼り付けたので、このようなことが起こりました。
やはり中身を把握していないとダメですね。

静的コンテンツの中のソースコードに何らかの変更を加えて更新する

上の「default.confの「add_header X-Frame-Options DENY」を取り除く」をすれば良いというのは早めの段階で分かったのですが、それでもうまくいかずしばらくの間途方に暮れていました。

そんな中、出会ったのが下記の記事です。
https://stackoverflow.com/questions/34212203/nginx-x-frame-options-still-with-the-same-value

何やら「add_header X-Frame-Options DENYを取り除いてサーバーを再起動してもうまくいかなかったけど、HTMLファイルにスペースや適当な行を入れて保存したらうまくいった」と書かれています。

私はこの記事を読んですぐに適当にhtmlファイルなどを変えて試してみましたが、確かにうまくいきました。
とんでもない罠ですね。

私の数時間の苦労が報われました。
これが分かった瞬間、今年一番を争うくらい気持ち良かったです。

終わりに

今回はNginxで「Refused to display " in a frame because it set 'X-Frame-Options’ to 'deny’.」が起きたときの対処法についてご紹介いたしました。