首页 > 其他分享 >Django 解决 CORS 跨域问题

Django 解决 CORS 跨域问题

时间:2024-06-15 15:24:45浏览次数:17  
标签:跨域 middleware django Access CORS Django response

Django 解决 CORS 跨域问题

CORS 基本概念

CORS(Cross-Origin Resource Sharing 跨域资源共享)是一种用于在Web浏览器中处理跨域请求的机制。跨域请求指的是在浏览器中,从一个域名的网页去请求另一个域名的资源。在默认情况下,浏览器限制了跨域请求,以保护用户的安全和隐私。

CORS 作用

浏览器采用了同源保护策略,为了防御恶意攻击,会检查Request消息与Response消息的域名 Domain与端口 Port,如果不相同,则表示响应消息与请求消息不是同源,可能是伪造的响应消息,因此浏览器添加了CORS限制功能,默认不接受非同源的响应消息。

CORS 工作机制

CORS通过在服务器端设置响应头来允许跨域请求。当浏览器发起跨域请求时,服务器可以在响应头中添加一些特定的字段,告诉浏览器该请求是被允许的。这些字段包括Access-Control-Allow-Origin、Access-Control-Allow-Methods、Access-Control-Allow-Headers等。

Access-Control-Allow-Origin: 指定了允许访问该资源的域名。可以设置为特定的域名,也可以设置为*表示允许任意域名访问。
Access-Control-Allow-Methods: 指定了允许的HTTP方法,如GET、POST等。
Access-Control-Allow-Headers: 指定了允许的请求头。
浏览器在收到服务器的响应后,会检查响应头中的CORS字段,如果与当前页面的域名匹配并且字段值符合要求,浏览器就会允许该跨域请求,并将响应返回给页面。
  • 说明

    需要注意的是,CORS只在浏览器中起作用,不会影响非浏览器环境下的请求。此外,CORS并不能完全解决跨域问题,仍然需要其他安全措施来保护Web应用程序的安全性。
    

★ 解决CORS跨域请求的思路

  • 方式一:通过自定义中间件修改Response头部
    • 1-在 myproject/myapp/ 目录下,新建 middlewares.py 文件存放中间件

      class CorsMiddleware(object):
          """中间件:跨域访问"""
          def __init__(self, get_response):
              self.get_response = get_response
          
          def __call__(self, request):
              return self.get_response(request)
          
          # process_template_response(), process_response() 只能二选一、根据view的response类型,重载相应方法。 
          def process_template_response(self,request,response):
              # 如果view 使用了render渲染response,使用这个中间件
              response["Access-Control-Allow-Origin"] = "*"
              return response
              
          def process_response(self,request,response):
              # 如果view使用HttpResponse, 将使用这个中间件
              response["Access-Control-Allow-Origin"] = "*"
              return response
      
      
    • 2-将新定义的中间件 CorsMiddleware 添加到 settings.pyMIDDLEWARE 的列表

      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',
          'myapp.middlewares.CorsMiddleware',  # 允许跨域访问中间件
      ]
      
      
    • 3-测试

      • 操作说明

        再次发起跨域的Ajax请求,可以成功接收到django的响应数据。使用浏览器DevTools检查Response响应头部参数,可以看到已经添加了Access-Control-Allow-Origin: *
        
      • 示例

        HTTP/1.1 200 OK
        Date: Sat, 21 Aug 2023 08:26:17 GMT
        Server: WSGIServer/0.2 CPython/3.11.4
        Content-Type: text/html; charset=utf-8
        Access-Control-Allow-Origin: *
        X-Frame-Options: DENY
        Content-Length: 5177
        Vary: Cookie
        X-Content-Type-Options: nosniff
        Referrer-Policy: same-origin
        
    • 总结

      此方法虽然简单易行,Access-Control-Allow-Origin 设置为*, 允许任何跨域访问,显然不太安全,每次修改须更新代码,因此仅适用于开发测试环境。
      
  • 方式二:通过 django-cors-headers 库来实现 (生产环境下推荐使用)
    • 1-安装

      pip install django-cors-headers
      
    • 2-修改 settings.py 配置文件

      • 添加到应用列表

        INSTALLED_APPS = (
            ##...
            'corsheaders'
        )
        
      • 添加中间件列表 corsheaders.middleware.CorsMiddleware

        MIDDLEWARE = [
            'django.middleware.security.SecurityMiddleware',
            'django.contrib.sessions.middleware.SessionMiddleware',
            'django.middleware.common.CommonMiddleware',
            'django.middleware.csrf.CsrfViewMiddleware',
            'corsheaders.middleware.CorsMiddleware',
            ......
        
        
      • 添加允许访问的域名

        • 允许所有域名访问

          CORS_ORIGIN_ALLOW_ALL = True
          
        • 允许指定的域访问

          CORS_ORIGIN_ALLOW_ALL = False
          # 允许域名加入白名单
          CORS_ORIGIN_WHITELIST = (
              'http//:localhost:8000',
          )
          

★ 总结

在测试环境中,可以允许所有domain来访问,以避免 CORS问题,前后端分离项目在生产环境下,通常应该部署在同域下,
如果确实需要跨域,则将前端域名添加到白名单 CORS_ORIGIN_WHITELIST配置项中,禁止其它域访问。

标签:跨域,middleware,django,Access,CORS,Django,response
From: https://www.cnblogs.com/cs-songbai/p/18249319

相关文章

  • Django ORM非空判断、以及通用写法
    django文档DjangoORM中,判断非空(notnull)有多种方式,使用isnull查询方法#查找所有name字段不为空的对象objects=MyModel.objects.filter(name__isnull=False)使用exclude方法排除空值:#查找所有name字段不为空的对象objects=MyModel.objects.exclude(name_......
  • 如何确保数据跨域交换安全、合规、可追溯性?
    数据跨域交换是指在不同的组织、系统或网络之间进行数据的传输和共享。随着数字经济的发展,数据跨域交换在促进数据流通和创新融合方面发挥着重要作用。然而,这一过程也面临着诸多挑战和风险,例如数据安全、合规性、完整性以及责任不清晰等问题。在进行不同地域文件传输时,可能遇到......
  • FastAPI-7:框架比较(Flask、Django及FastAPI)
    7框架比较(Flask、Django及FastAPI)关于一个新的Web框架,您可能想知道的第一件事就是如何入门,而一种自上而下的方法就是定义路由(从URL和HTTP方法到函数的映射)。7.1FlaskFlask自称是微框架。它提供基本功能,你可以根据需要下载第三方软件包进行补充。它比Django小,入门时学习......
  • 在Django中使用Celery
    首先需要确保安装依赖pipinstallceleryrediseventlet在创建的app文件内添加tasks.py#app01/tasks.pyfromceleryimportshared_task@shared_taskdefsimple_task():print('Taskexecutedsuccessfully')在项目目录下(与settings.py文件同级)添加celery.py......
  • 从零手写实现 nginx-19-HTTP CORS(Cross-Origin Resource Sharing,跨源资源共享)介绍+解
    前言大家好,我是老马。很高兴遇到你。我们为java开发者实现了java版本的nginxhttps://github.com/houbb/nginx4j如果你想知道servlet如何处理的,可以参考我的另一个项目:手写从零实现简易版tomcatminicat手写nginx系列如果你对nginx原理感兴趣,可以阅读:从零......
  • node使用http-proxy-middleware做代理,解决跨域问题
    constexpress=require('express')consthistory=require('connect-history-api-fallback')const{createProxyMiddleware}=require('http-proxy-middleware')letapp=express()app.use(history())////匹配api开头的请求,实际转发的请求保a......
  • django 的安装和启动
    1.pycharm创建project方法与之前selenium相同,需在pycharm终端先pipinstalldjango,然后创建好项目路径,再在终端输入django-adminstartproject项目名称。2.app的创建和说明在项目目录下(与manange.py同级的)的地方打开终端在项目目录下输入pyhtonmanage.pystartappapp01(......
  • Django学习项目-learning log报错合集(2)
    样式篇stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css:1  Failedtoloadresource:net::ERR_CONNECTION_TIMED_OUTdjango-bootstrap3样式无效按这篇文章进行修改......
  • 架构设计-跨域问题的根源及解决方式
    前面文章《架构设计-web项目中跨域问题涉及到的后端和前端配置》中说明了处理跨域问题的一种方式,本文详细说明下产生跨域问题的原因及处理方式。一、产生跨域问题的原因:浏览器的同源策略:这是跨域问题的根本原因。同源策略是浏览器对JavaScript施加的安全限制,目的是出于浏览......
  • 关于Spring Security的CORS
    目录一、CORS是什么二、同源安全策略三、SpringSecurity中CORS的开启四、其它处理方法一、CORS是什么        CORS(Cross-OriginResourceSharing,跨源/域资源共享)是一个W3C标准,一种允许当前域(domain)的资源(比如html/js/webservice)被其他域(domain)的脚本(比如AJ......