在nginx中设置X-Frame-Options Header

The X-Frame-Options HTTP 响应头是用来给浏览器 指示允许一个页面可否在 <frame>, <iframe>, <embed> 或者 <object> 中展现的标记。站点可以通过确保网站没有被嵌入到别人的站点里面，从而避免 clickjacking 攻击。

X-Frame-Options 语法

X-Frame-Options: deny

该页面不允许在frame中展示，同域名页面中嵌套也不被允许

X-Frame-Options: sameorigin

该页面可以在相同域名的页面的frame中展示

X-Frame-Options: allow-from https://example.com/

该页面可以在指定来源的frame中展示

nginx中配置

server {
    listen       80;
    server_name  xxx.com;
    charset utf-8;
    #add_header X-Frame-Options SAMEORIGIN;
    # 允许单个域名iframe嵌套
    #add_header X-Frame-Options ALLOW-FROM http://127.0.0.1:8081/;
    # 允许多个域名iframe嵌套，注意这里是用逗号分隔
    #add_header X-Frame-Options "ALLOW-FROM http://127.0.0.1:8081/,http://127.0.0.1:8082/";
    add_header X-Frame-Options "ALLOW-FROM http://127.0.0.1:8081/";
}

兼容性问题（数据来源参考）

浏览器	支持情况
Edge	支持
IE11 on winphone	支持
IE9,10,11	支持
Firefox 18+	支持
Firefox 17	不支持allow-from
Dolphin 11.4.3	不支持allow-from
Chrome 57	不支持allow-from
Safari 10.0.1	不支持allow-from
Opera 26	不支持allow-from
Safari 10.0.1	不支持allow-from
IE8	不支持allow-from
IE6,7	完全不支持

对于不兼容的情况，可以使用 Content-Security-Policy HTTP 头中的 frame-ancestors 指令，该指令会替代X-Frame-Options Header。CSP 的 frame-ancestors 会在 Gecko 4.0 中支持，但是并不会被所有浏览器支持。然而 X-Frame-Options 是个已广泛支持的非官方标准，可以和 CSP 结合使用。

二者结合使用的nginx配置

server {
    listen       80;
    server_name  xxx.com;
    charset utf-8;
    #add_header X-Frame-Options SAMEORIGIN;
    # 允许单个域名iframe嵌套
    #add_header X-Frame-Options ALLOW-FROM http://127.0.0.1:8081/;
    # 允许多个域名iframe嵌套，注意这里是用逗号分隔
    # 使用frame-ancestors，多个域名使用空格分隔
    #add_header X-Frame-Options "ALLOW-FROM http://127.0.0.1:8081/,http://127.0.0.1:8082/";
    add_header X-Frame-Options "ALLOW-FROM http://127.0.0.1:8081/";
    add_header Content-Security-Policy "frame-ancestors http://127.0.0.1:8081/";
}