Django iframe 页面被拒绝

问题

使用Django开发页面时，前端layui 弹出层类型为iframe会提示以下错误

chrome-error://chromewebdata/:1 Refused to display 'http://127.0.0.1:8000/' in a frame because it set 'X-Frame-Options' to 'deny'.

通过curl 请求查看到X-Frame-Options: DENY ，应该就是这个问题导致的

curl "127.0.0.1:8000/workload/pod/log/?namespace=default&name=nginx14-5995f58c5f-zfjr2"  -v                                  ✔  2490  20:42:20
*   Trying 127.0.0.1...
* TCP_NODELAY set
* Connected to 127.0.0.1 (127.0.0.1) port 8000 (#0)
> GET /workload/pod/log/?namespace=default&name=nginx14-5995f58c5f-zfjr2 HTTP/1.1
> Host: 127.0.0.1:8000
> User-Agent: curl/7.64.1
> Accept: */*
> 
< HTTP/1.1 302 Found
< Date: Wed, 22 Feb 2023 12:42:23 GMT
< Server: WSGIServer/0.2 CPython/3.7.3
< Content-Type: text/html; charset=utf-8
< Location: /login
< X-Frame-Options: DENY
< Content-Length: 0
< Vary: Cookie
< X-Content-Type-Options: nosniff
< Referrer-Policy: same-origin
< 
* Connection #0 to host 127.0.0.1 left intact
* Closing connection 0

解决方案

有以下几种解决办法

1. 修改django setting.py 配置

修改django setting.py 配置中的 MIDDLEWARE，将django.middleware.clickjacking.XFrameOptionsMiddleware删除

不推荐使用此方法，处于安全考虑，默认情况下，中间件将为每个outgoing 将X-Frame-Options标头设置为DENY

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

2. 允许同域名网站使用Frame展示

在settings.py中添加配置，表示将默认值设置为 SAMEORIGIN，添加此配置后所有路由都可以在同域名下通过frame 方式展示

X_FRAME_OPTIONS = 'SAMEORIGIN'

3. 指定某一个视图函数的X-Frame-Options 相关配置

推荐此方法
可以有三种配置参数

• xframe_options_exempt 在对应的路由中去除X-Frame-Options限制
• xframe_options_sameorigin 在对应的路由中只允许同域名下使用frame方式展示
• xframe_options_deny 拒绝frame方式展示

from django.views.decorators.clickjacking import xframe_options_sameorigin, xframe_options_exempt, xframe_options_deny

# Create your views here.

@xframe_options_sameorigin
def sameorigin_example(request):
    pass

@xframe_options_deny
def deny_example(request):
    pass
    
@xframe_options_exempt
def exempt_example(request):
    pass

X-Frame-Options 介绍

The X-Frame-Options HTTP 响应头是用来给浏览器 指示允许一个页面 可否在 ,

语法

X-Frame-Options 有三个值：

DENY ：表示该页面不允许在 frame 中展示，即便是在相同域名的页面中嵌套也不允许

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

ALLOW-FROM uri ：表示该页面可以在指定来源的 frame 中展示

根据上述 X-Frame-Options的三个值描述，只要修改django的X-Frame-Options为SAMEORIGIN ，那么相同域名页面就可以使用frame中展示。

功能

点击劫持保护

clickjacking中间件和装饰器提供了易于使用的保护，以防止clickjacking。当恶意站点诱使用户单击他们已加载到隐藏框架或iframe中的另一个站点的隐藏元素时，会发生这种类型的攻击。

防止点击劫持

现代浏览器采用X-Frame-Options HTTP标头，该标头指示是否允许在框架或iframe中加载资源。如果响应包含标头值为的标头，SAMEORIGIN则浏览器将仅在请求源自同一站点时才将资源加载到框架中。如果将标头设置为，DENY则无论哪个站点发出请求，浏览器都将阻止资源加载到框架中。