X-Frame-Options参数详解

服务器端

HTTP的Header中有一项参数:X-Frame-Options, 如果设置了这个参数的话,服务器会禁止客户端使用iframe跨源请求。

客户端

例如请求Google Maps:

<iframe id="google-maps" src="https://www.google.com/maps"></iframe>

如果服务器端(nginx)设置:

add_header X-Frame-Options SAMEORIGIN;

浏览器就会阻止该请求,错误提示如下:

Refused to display 'https://www.google.com/maps' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
index.html:121 GET https://www.google.com/maps net::ERR_BLOCKED_BY_RESPONSE

总结

这个参数属于安全相关的参数,服务器端设置这个参数的话,可以在一定程度增强安全性。

参考资料

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options