Javascript 如何在 iframe 上设置“X-Frame-Options”？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27358966/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to set 'X-Frame-Options' on iframe?
提问by Darien Fawkes
If I create an iframelike this:
如果我创建一个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({
How can I fix the error:
我该如何修复错误：
Refused to display
'https://www.google.com.ua/?gws_rd=ssl'in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
拒绝
'https://www.google.com.ua/?gws_rd=ssl'在框架中显示，因为它将“X-Frame-Options”设置为“SAMEORIGIN”。
with JavaScript?
用 JavaScript？
回答by Drew Gaynor
You can't set X-Frame-Optionson the iframe. That is a response header set by the domain from which you are requesting the resource (google.com.uain your example). They have set the header to SAMEORIGINin this case, which means that they have disallowed loading of the resource in an iframeoutside of their domain. For more information see The X-Frame-Options response headeron MDN.
你不能X-Frame-Options在iframe. 这是由您请求资源的域设置的响应标头（google.com.ua在您的示例中）。SAMEORIGIN在这种情况下，他们已将标头设置为，这意味着他们已禁止在其iframe域外部加载资源。有关更多信息，请参阅MDN 上的 X-Frame-Options 响应标头。
A quick inspection of the headers (shown here in Chrome developer tools) reveals the X-Frame-Optionsvalue returned from the host.
快速检查标头（此处显示在 Chrome 开发人员工具中）会显示X-Frame-Options从主机返回的值。
回答by Rory McCrossan
You seem to be misunderstanding the problem. X-Frame-Optionsis a header included in the responseto the request to state if the domain requested will allow itself to be displayed within a frame. It has nothing to do with javascript or HTML, and cannot be changed by the originator of the request.
你似乎误解了这个问题。X-Frame-Options是包含在对请求的响应中的标头，用于说明所请求的域是否允许自己在框架内显示。它与 javascript 或 HTML 无关，并且不能被请求的发起者更改。
This website has set this header to disallow it to be displayed in an iframe. There is nothing you can do to stop this behaviour.
本网站已设置此标题以禁止其显示在iframe. 您无法阻止这种行为。
回答by rubo77
In case you are in control of the Server that sends the content of the iframe you can set the setting for X-Frame-Optionsin your webserver.
如果您控制发送 iframe 内容的服务器，您可以X-Frame-Options在您的网络服务器中设置设置。
Configuring Apache
配置 Apache
To send the X-Frame-Options header for all pages, add this to your site's configuration:
要发送所有页面的 X-Frame-Options 标头，请将其添加到您站点的配置中：
Header always append X-Frame-Options SAMEORIGIN
Configuring nginx
配置nginx
To configure nginx to send the X-Frame-Options header, add this either to your http, server or location configuration:
要配置 nginx 以发送 X-Frame-Options 标头，请将其添加到您的 http、服务器或位置配置中：
add_header X-Frame-Options SAMEORIGIN;
No configuration
无配置
This header option is optional, so if the option is not set at all, you will give the option to configure this to the next instance (e.g. the visitors browser or a proxy)
此标题选项是可选的，因此如果根本未设置该选项，您将提供将其配置到下一个实例的选项（例如访问者浏览器或代理）
source: https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options
来源：https: //developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options
回答by Mike Q
Since the solution wasn't really mentioned for the server side:
由于服务器端并未真正提及解决方案：
One has to set things like this (example from apache), this isn't the best option as it allows in everything, but after you see your server working correctly you can easily change the settings.
必须设置这样的设置（来自 apache 的示例），这不是最好的选择，因为它在所有情况下都允许，但是在您看到服务器正常工作后，您可以轻松更改设置。
Header set Access-Control-Allow-Origin "*"
Header set X-Frame-Options "allow-from *"
回答by LongChalk
not really... I used
不是真的......我用过
<system.webServer>
<httpProtocol allowKeepAlive="true" >
<customHeaders>
<add name="X-Frame-Options" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>
回答by Tomer Ben David
and if nothing helps and you still want to present that website in an iframe consider using X Frame Bypass Componentwhich will utilize a proxy.
如果没有任何帮助，并且您仍然想在 iframe 中显示该网站，请考虑使用X Frame Bypass 组件，它将利用代理。
回答by Shailesh Dwivedi
The X-Frame-Options HTTP response header can be used to indicate whether or not a browser should be allowed to render a page in a <frame>, <iframe>or <object>. Sites can use this to avoid clickHymaning attacks, by ensuring that their content is not embedded into other sites.
X-Frame-Options HTTP 响应标头可用于指示是否应允许浏览器以<frame>、<iframe>或格式呈现页面<object>。网站可以使用它来避免点击劫持攻击，确保他们的内容没有嵌入到其他网站中。
For More Information: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
更多信息：https: //developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
I have an alternate solution for this problem, which I am going to demonstrate by using PHP:
对于这个问题，我有一个替代解决方案，我将通过使用 PHP 来演示：
iframe.php:
iframe.php:
<iframe src="target_url.php" width="925" height="2400" frameborder="0" ></iframe>
target_url.php:
target_url.php:
<?php
echo file_get_contents("http://www.example.com");
?>
回答by Julien Kronegg
The solution is to install a browser plugin.
解决方法是安装浏览器插件。
A web site which issues HTTP Header X-Frame-Optionswith a value of DENY(or SAMEORIGINwith a different server origin) cannot be integrated into an IFRAME... unless you change this behavior by installing a Browser plugin which ignores the X-Frame-OptionsHeader (e.g. Chrome's Ignore X-Frame Headers).
发出X-Frame-Options值为DENY（或SAMEORIGIN具有不同服务器源）的HTTP 标头的网站无法集成到 IFRAME... 除非您通过安装忽略X-Frame-Options标头的浏览器插件（例如Chrome 的忽略 X-Frame标头）来更改此行为）。
Note that this not recommended at all for security reasons.
请注意，出于安全原因，根本不建议这样做。
回答by Nikki
you can set the x-frame-option in web config of the site you want to load in iframe like this
您可以像这样在要在 iframe 中加载的站点的 Web 配置中设置 x-frame-option
<httpProtocol>
<customHeaders>
<add name="X-Frame-Options" value="*" />
</customHeaders>
</httpProtocol>
回答by Ibtesam Latif
For this purpose you need to match the location in your apache or any other service you are using
为此，您需要匹配 apache 或您正在使用的任何其他服务中的位置
If you are using apache then in httpd.conf file.
如果您使用 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>
