iframe嵌套其他网站提示连接被拒绝
报错信息:Refused to display 'http://xxxxxxx.xyz/' in a frame because it set 'X-Frame-Options' to 'deny'.
最近开发项目中遇到了客户iframe嵌套我们项目,遇到了域名提示...拒绝了您的访问。然后百度了一下
X-Frame-Options: HTTP 响应头是用来给浏览器 指示允许一个页面 可否在<frame>
, <iframe>
, <embed>
或者 <object>
中展现的标记。站点可以通过确保网站没有被嵌入到别人的站点里面,从而避免 点击劫持 攻击。
X-Frame-Options 有三个属性值:
- deny
表示该页面不允许在frame中展示,即便是在相同域名的页面中嵌套也不允许。 - sameorigin
表示该页面可以在相同域名页面的frame中展示。 - allow-from uri
表示该页面可以在指定来源的frame中展示。
nginx配置
需要添加到 ‘http’, ‘server’ 或者 ‘location’ 的配置项中,个人来讲喜欢配置在‘server’ 中
正常情况下都是使用SAMEORIGIN参数,允许同域嵌套
add_header X-Frame-Options SAMEORIGIN;
允许单个域名iframe嵌套
add_header X-Frame-Options ALLOW-FROM http://whsir.com/;
允许多个域名iframe嵌套,注意这里是用逗号分隔
add_header X-Frame-Options "ALLOW-FROM http://whsir.com/,https://cacti.org.cn/";
nginx示例
server {
listen 80;
server_name *.xxxxxxx.xyz;
location /public/ {
autoindex on;
alias /usr/local/nginx/html/web/myblog/node/public/;
}
location /webgate/ {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://127.0.0.1:1314/api/;
}
location / {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# add_header X-Frame-Options deny;
# 此处设置X-Frame-Options配置
add_header X-Frame-Options "ALLOW-FROM https://xxx2.xxxxxxx.com";
if ($host ~ ^(xxxx)\.xxxxxxx\.xyz$) {
proxy_pass http://0.0.0.0:8083;
}
if ($host ~ ^(xxxx)\.xxxxxxx\.xyz$) {
proxy_pass http://0.0.0.0:8081;
}
if ($host ~ ^(xxxx)\.xxxxxxx\.xyz$) {
proxy_pass http://0.0.0.0:8082;
}
proxy_pass http://127.0.0.1:1314/;
}
}
如何确定已经修改生效:
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通