web-dev-qa-db-ja.com

Iframeに 'X-Frame-Options'を設定するにはどうすればいいですか？

このようにiframeを作成すると、

var dialog = $('<div id="' + dialogId + '" align="center"><iframe id="' + frameId + '" src="' + url + '" width="100%" frameborder="0" height="'+frameHeightForIe8+'" data-ssotoken="' + token + '"></iframe></div>').dialog({

どうすればエラーを修正できますか。

'X-Frame-Options'を 'SAMEORIGIN'に設定しているため、フレーム内に'https://www.google.com.ua/?gws_rd=ssl'を表示することを拒否しました。

javaScriptで？

javascriptjqueryx-frame-options
116
Darien Fawkes

iframename__にX-Frame-Optionsを設定することはできません。これは、リソースを要求しているドメインによって設定された応答ヘッダーです（この例ではgoogle.com.ua）。この場合、彼らはヘッダをSAMEORIGINname__に設定しています。つまり、ドメイン外のiframename__にリソースをロードすることはできません。詳細については、 X-Frame-Optionsレスポンスヘッダー MDNを参照してください。

ヘッダーを確認すると（ここではChromeデベロッパーツールに表示されています）、ホストから返されたX-Frame-Options値がわかります。

enter image description here

166
Drew Gaynor

あなたはその問題を誤解しているようです。 X-Frame-Optionsは、要求されたドメインが自分自身をフレーム内に表示することを許可するかどうかを示す要求に対する response に含まれるヘッダーです。 JavaScriptやHTMLとは無関係であり、リクエストの発信元によって変更することはできません。

このWebサイトでは、このヘッダーをiframeに表示できないように設定しています。この動作を止めるためにできることは何もありません。

X-Frame-Optionsをさらに読む

56
Rory McCrossan

Iframeのコンテンツを送信するサーバーを管理している場合は、WebサーバーでX-Frame-Optionsの設定を設定できます。

Apacheの設定

すべてのページにX-Frame-Optionsヘッダを送信するには、これをあなたのサイトの設定に追加してください：

Header always append X-Frame-Options SAMEORIGIN

Nginxの設定

X-Frame-Optionsヘッダを送信するようにnginxを設定するには、これをhttp、server、またはlocationのいずれかの設定に追加します。

add_header X-Frame-Options SAMEORIGIN;

設定なし

このヘッダーオプションはオプションなので、オプションがまったく設定されていない場合は、これを次のインスタンスに設定するオプションを指定します（例：訪問者のブラウザやプロキシ）。

ソース： https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

23
rubo77

そうじゃない…使った

 <system.webServer>
     <httpProtocol allowKeepAlive="true" >
       <customHeaders>
         <add name="X-Frame-Options" value="*" />
       </customHeaders>
     </httpProtocol>
 </system.webServer>
5
LongChalk

解決策は、サーバー側では実際には言及されていなかったので、

このようなものを設定する必要があります（Apacheの例）。これがすべてを可能にするので、これは最善の選択肢ではありませんが、サーバーが正しく機能していることを確認したら、設定を簡単に変更できます。

           Header set Access-Control-Allow-Origin "*"
           Header set X-Frame-Options "allow-from *"
4
Mike Q

何も役に立たず、まだそのウェブサイトをiframeで表示したい場合は、プロキシを利用する X Frame Bypass Component の使用を検討してください。

2
Tomer Ben David

私のサブディレクトリでwordpressの私のvirtualminサーバー（Apache）で同じ問題を抱えていました、そして私のケースでは上記の答えのどれも問題を解決することができませんでした。 .htaccess（wordpress root）ディレクトリに置かれたpublic_html\subdirectory\ファイルの下の行

header always set x-frame-options "SAMEORIGIN"

これが私の場合の唯一の解決策でした。 （appendやalways setではなくalways appendを含む部分があることに注意してください）

2
Mojtaba Rezaeian

X-Frame-Options HTTPレスポンスヘッダは、ブラウザが<frame>、<iframe>または<object>でページをレンダリングすることを許可されるべきかどうかを示すために使用することができます。サイトは、自分のコンテンツが他のサイトに埋め込まれていないことを確認することで、クリックジャック攻撃を回避するためにこれを使用することができます。

詳細情報： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

私はこの問題に対して別の解決策を持っています。これをPHPを使って説明します。

iframe.php：

<iframe src="target_url.php" width="925" height="2400" frameborder="0" ></iframe>

target_url.php：

<?php 
  echo file_get_contents("http://www.example.com");
?>
2
Shailesh Dwivedi

解決策はブラウザプラグインをインストールすることです。

X-Frame-Optionsヘッダーを無視するブラウザプラグインをインストールしてこの動作を変更しない限り（例： ）、DENYの値を持つHTTPヘッダーX-Frame-Options（または異なるサーバーOriginのSAMEORIGIN）を発行するWebサイトは統合できません。 ChromeのXフレームヘッダーを無視する ）。

セキュリティ上の理由から、これはまったく推奨できません。

1
Julien Kronegg

X-iframeはサイトの所有者から提供される必要があり、サーバーのルール内にあるため、実際にはHTML本体に追加できません。

おそらくあなたができることはターゲットURLとiframeそのphp URLの内容をロードするPHPファイルを作成することです、これは円滑に動作するはずです。

1
Sushant Chaudhari

この目的のために、あなたはあなたのApacheまたはあなたが使用している他のサービスの中の場所を合わせる必要があります。

Apacheを使っているならhttpd.confファイルに。

  <LocationMatch "/your_relative_path">
      ProxyPass absolute_path_of_your_application/your_relative_path
      ProxyPassReverse absolute_path_of_your_application/your_relative_path
   </LocationMatch>
0
Ibtesam Latif

tomcatインスタンスレベルの構成ファイル（web.xml）でそれを行うことができます。web.xml構成ファイルに「フィルター」と「フィルターマッピング」を追加する必要があります。これはグローバル設定であるため、すべてのページに[X-frame-options = DENY]を追加します。

<filter>
        <filter-name>httpHeaderSecurity</filter-name>
        <filter-class>org.Apache.catalina.filters.HttpHeaderSecurityFilter</filter-class>
        <async-supported>true</async-supported>
        <init-param>
          <param-name>antiClickJackingEnabled</param-name>
          <param-value>true</param-value>
        </init-param>
        <init-param>
          <param-name>antiClickJackingOption</param-name>
          <param-value>DENY</param-value>
        </init-param>
    </filter>

  <filter-mapping> 
    <filter-name>httpHeaderSecurity</filter-name> 
    <url-pattern>/*</url-pattern>
</filter-mapping>
0
Rejji

これを試して 

response['X-Frame-Options'] = 'ALLOWALL'

または

response['X-Frame-Options'] = 'ALLOW-FROM http://yourdomain.com'

例

class ExampleView(generic.View):

    @method_decorator(csrf_exempt)
    def dispatch(self, request, *args, **kwargs):
        return super(ExampleView, self).dispatch(request, *args, **kwargs)

    def get(self, request, *args, **kwargs):
        res = api_request('get', 'example/xyx')
        response = HttpResponse(res)
        return self.set_response_header(request, response)

    def options(self, request, *args, **kwargs):
        response = HttpResponse()
        return self.set_response_header(request, response)

    def set_response_header(self, request, response):
        response['Access-Control-Allow-Origin'] = request.META.get('HTTP_Origin') if request.META.get('HTTP_Origin') else '*'
        response['Access-Control-Allow-Headers'] = 'x-requested-with, content-type, accept, Origin, authorization, x-csrftoken, user-agent, accept-encoding, cache-control'
        response['Access-Control-Allow-Methods'] = 'GET, POST, PUT, PATCH, DELETE, OPTIONS'
        response['Access-Control-Max-Age'] = '86400'
        response['Access-Control-Allow-Credentials'] = 'true'
        response['X-Frame-Options'] = 'ALLOWALL'
        return response
0
HoangYell

このようにiframeにロードしたいサイトのWeb設定でx-frame-optionを設定できます。

<httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="*" />
    </customHeaders>
  </httpProtocol>
0
Nikki