一、背景

需求：

最近在做前端微服务嵌入的时候，涉及到csrf验证问题。但是作为被引用的项目，因为安全问题，是不能将csrf完全放开的。只能针对特定的请求，豁免csrf验证。

项目栈：

Django 2.2.6
djangorestframework 3.11.1
vue

二、实现

1.前端部分

前端要做的是，在header中加入一个自定义的参数，作为识别标志
vue项目中用的是axios请求，详情入如下：

axios.interceptors.request.use((config) => {    // 其他代码...    config.headers["AUTH-XXX"] = "xxx"    return config});

2. 后端部分

2.1 解决请求头限定问题

先解决前端请求headers中添加自定义参数中，前端报错provisional headers are shown的问题。
出现这个问题的原因是，django后端是限定前端的请求头参数的。
所以需要在setting文件总，从新配置CORS_ALLOW_HEADERS

# 请求自定义的头部参数auth-xxxCORS_ALLOW_HEADERS = (    "accept",    "accept-encoding",    "authorization",    "content-type",    "dnt",    "origin",    "user-agent",    "x-csrftoken",    "x-requested-with",    "auth-xxx")

2.2 实现豁免csrf验证方法

创建一个中间件，豁免指定请求的csrf验证

class CustomMiddleware(MiddlewareMixin):    def process_request(self, request):        if request.method != "OPTIONS":            # 微前端定义的参数为AUTH-XXX            auth_app = request.meta.get("HTTP_AUTH_XXX")            # 当自定义参数为"xxx"时，才豁免csrf验证            if auth_app and auth_app == 'xxx':                setattr(request, "_dont_enforce_csrf_checks", True)

在setting中，加入中间件

# 请求豁免csrf验证MIDDLEWARE = (        MIDDLEWARE[0: MIDDLEWARE.index("django.middleware.csrf.CsrfViewMiddleware")] +        ("home_application.utils.custom_middleware.CustomMiddleware",)        + MIDDLEWARE[MIDDLEWARE.index("django.middleware.csrf.CsrfViewMiddleware"):])

2.3 豁免csrf验证原理

因为django自带的csrf验证机制如下，只需改变request的属性_dont_enforce_csrf_checks即可

# Assume that anything not defined as 'safe' by RFC7231 needs protection        if request.method not in ('GET', 'HEAD', 'OPTIONS', 'TRACE'):            if getattr(request, '_dont_enforce_csrf_checks', False):

三、django获取Header中的参数注意的地方

• 前端自定义的headers参数一般写成大写，如果由两个单词组成，中间是要用横杠的。例如：AUTH-XXX
• 后端获取这个参数时，横杠会变成下划线，并且参数前面自动加上HTTP_。例如：request.meta.get("HTTP_AUTH_XXX")