关于前后端分离项目中CSRF等一系列问题的理解小结

本文链接：https://blog.youkuaiyun.com/MSB4011/article/details/131565935

本文总结了在前后端分离项目中遇到的CSRF和CORS问题，包括CSRF Token生成、服务端CORS限制、浏览器跨域设置Cookie策略以及Django的CSRF策略对跨域的限制。作者详细描述了解决这些问题的过程，最终通过代理方式解决了跨域问题，并提供了相应的配置代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近陆陆续续的在学习前后端分离的知识，期望通过这个方式了解前后端各自的技术栈以及前后端交互的具体实现方式，经过自己挑选，最终选择了Vue+django的技术栈，而在实现Vue和django交互的过程中，遇到的第一个问题就是CSRF的问题，为了理解和解决这个问题，自己查询了很多博主的资料，又引出了CORS的问题，这两个问题交织在一起比较繁琐，特此在这里将自己的理解进行一个总结

一、问题的起因

问题的起因：希望在Vue上实现的表单能够通过post请求将数据发送到服务端，例如登录信息等等，为了功能的安全考虑（包括也为了尝试理解CSRF的逻辑），决定在保留django自带的csrf功能的前提下实现相关功能，进而引出一系列问题

二、尝试使用CSRF防御功能引入的问题汇总

1. CSRF Token生成问题

要引入CSRF功能，需要在前端使用get请求第一次访问服务端时生成相关的Token，关于这个生成方法网上有很多文章，但是自己试用下来并不能正常运行，最后不断尝试，总算发现了如下的方式，即，在服务端处理get请求的View函数中，主动的获取token：

from django.http import HttpResponse
from django.middleware.csrf import get_token
 
 
def index(request):
    if request.method == "GET":
        get_token(request)
        resp = HttpResponse('[Get Request]Hello from MSB4011')
        return resp

通过这种方式，当前端请求服务端的这个接口是，服务端将自动返回csrftoken并且储存在cookies中，这样前端就可以获得对应的token，并在后续的post请求中加入'X-CSRFTOKEN': csrftoken来完成相关的认证。需要注意的是，get_token函数本身返回的token并不是标准的csrftoken，而是经过加密计算的，因此很多网络博客写到的用一个变量获取get_token的返回，在通过response的方式返回给前端的逻辑应该是行不通的，不信可以看csrf库里面的代码：

def get_token(request):
    """
    Return the CSRF token required for a POST form. The token is an
    alphanumeric value. A new token is created if one is not already set.

    A side effect of calling this function is to make the csrf_protect
    decorator and the CsrfViewMiddleware add a CSRF cookie and a 'Vary: Cookie'
    header to the outgoing response.  For this reason, you may need to use this
    function lazily, as is done by the csrf context processor.
    """
    if "CSRF_COOKIE" in request.META:
        csrf_secret = request.META["CSRF_COO