django 跨域

什么是跨域

跨域是指一个域下的文档或脚本试图去请求另一个域下的资源，这里跨域是广义的。
其实我们通常所说的跨域是狭义的，是由浏览器同源策略限制的一类请求场景。

什么是同源策略？

同源策略/SOP（Same origin policy）是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等***。所谓同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。

同源策略限制以下几种行为：

  • Cookie、LocalStorage 和 IndexDB 无法读取
  • DOM 和 Js对象无法获得
  • AJAX 请求不能发送

CORS基本流程

浏览器将CORS请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）。
浏览器发出CORS简单请求，只需要在头信息之中增加一个Origin字段。
浏览器发出CORS非简单请求，会在正式通信之前，增加一次HTTP查询请求，称为"预检"请求（preflight）。浏览器先询问服务器，当前网页所在的域名是否在服务器的许可名单之中，以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复，浏览器才会发出正式的XMLHttpRequest请求，否则就报错。

CORS两种请求详解

只要同时满足以下两大条件，就属于简单请求。

（1) 请求方法是以下三种方法之一：
HEAD
GET
POST
（2）HTTP的头信息不超出以下几种字段：
Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

凡是不同时满足上面两个条件，就属于非简单请求。

浏览器对这两种请求的处理，是不一样的。

* 简单请求和非简单请求的区别？

   简单请求：一次请求
   非简单请求：两次请求，在发送数据之前会先发一次请求用于做“预检”，只有“预检”通过后才再发送一次请求用于数据传输。
* 关于“预检”

- 请求方式：OPTIONS
- “预检”其实做检查，检查如果通过则允许传输数据，检查不通过则不再发送真正想要发送的消息
- 如何“预检”
     => 如果复杂请求是PUT等请求，则服务端需要设置允许某请求，否则“预检”不通过
        Access-Control-Request-Method
     => 如果复杂请求设置了请求头，则服务端需要设置允许某请求头，否则“预检”不通过
        Access-Control-Request-Headers

支持跨域，简单请求
            服务器设置响应头：Access-Control-Allow-Origin = ‘域名‘ 或 ‘*‘

支持跨域，复杂请求

由于复杂请求时，首先会发送“预检”请求，如果“预检”成功，则发送真实数据。

“预检”请求时，允许请求方式则需服务器设置响应头：Access-Control-Request-Method
“预检”请求时，允许请求头则需服务器设置响应头：Access-Control-Request-Headers

几种方法

  • 使用django-cors-headers全局控制
  • 使用JsonP，只能用于Get方法
  • 在views.py里设置响应头，只能控制单个接口

django-cors-headers

首先安装
pip install django-cors-headers

然后在settings.py里配置一番就可以

INSTALLED_APPS = [
    ...
    ‘corsheaders‘，
    ...
 ] 

MIDDLEWARE_CLASSES = (
    ...
    ‘corsheaders.middleware.CorsMiddleware‘,
    ‘django.middleware.common.CommonMiddleware‘, # 注意顺序
    ...
)
#跨域增加忽略
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
CORS_ORIGIN_WHITELIST = (
    ‘*‘
)

CORS_ALLOW_METHODS = (
    ‘DELETE‘,
    ‘GET‘,
    ‘OPTIONS‘,
    ‘PATCH‘,
    ‘POST‘,
    ‘PUT‘,
    ‘VIEW‘,
)

CORS_ALLOW_HEADERS = (
    ‘XMLHttpRequest‘,
    ‘X_FILENAME‘,
    ‘accept-encoding‘,
    ‘authorization‘,
    ‘content-type‘,
    ‘dnt‘,
    ‘origin‘,
    ‘user-agent‘,
    ‘x-csrftoken‘,
    ‘x-requested-with‘,
    ‘Pragma‘,
)

无需考虑PUT,DELETE,PATCH方法的支持,cors默认都支持.
若使用更多复杂配置导致无法访问或各种报错,打开谷歌浏览器调试窗口,针对具体报错逐一解决.

location / {
? ? ? ? add_header Access-Control-Allow-Methods ‘GET, POST, OPTIONS‘;

? ? ? ? if ($request_method = ‘OPTIONS‘) {
? ? ? ? ? ? ? ? add_header ‘Access-Control-Allow-Origin‘ ‘*‘;
? ? ? ? ? ? ? ? add_header ‘Access-Control-Allow-Methods‘ ‘GET,POST,PUT,DELETE,PATCH,OPTIONS‘;
? ? ? ? ? ? ? ? add_header ‘Access-Control-Allow-Headers‘ ‘DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Sample-Source‘;
? ? ? ? ? ? ? ? return 200;
? ? ? ? }
? ? ? ? proxy_pass http://127.0.0.1:8080;
? }

JsonP

使用Ajax获取json数据时，存在跨域的限制。不过，在Web页面上调用js的script脚本文件时却不受跨域的影响，JSONP就是利用这个来实现跨域的传输。因此，我们需要将Ajax调用中的dataType从JSON改为JSONP（相应的API也需要支持JSONP）格式。
JSONP只能用于GET请求。

原文地址：https://blog.51cto.com/13764714/2392555

时间： 2024-07-30 20:14:14

django 跨域的相关文章

python Django 跨域解决方案

django解决跨域请求的问题 解决方案 1.安装django-cors-headers pip install django-cors-headers 内容详见:https://github.com/ottoyiu/django-cors-headers 其他解决方 1.使用JSONP 使用Ajax获取json数据时,使用JSONP,JSONP只能用于GET请求,红色部分是注意事项 $.ajax({ url:'http://localhost:8000/hello/', data:data,

用CORS 解决vue.js django跨域调用

Cross-Origin Resource Sharing(CORS)跨域资源共享是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略,是 JSONP 模式的现代版.与 JSONP 不同,CORS 除了 GET 要求方法以外也支持其他的 HTTP 要求.用 CORS 可以让网页设计师用一般的 XMLHttpRequest,这种方式的错误处理比 JSONP 要来的好.另一方面,JSONP 可以在不支持 CORS 的老旧浏览器上运作.现代的浏览器都支持 CO

Django 跨域请求处理

参考https://blog.csdn.net/qq_27068845/article/details/73007155 http://blog.51cto.com/aaronsa/2071108 django处理Ajax跨域访问 使用javascript进行ajax访问的时候,出现如下错误 出错原因:javascript处于安全考虑,不允许跨域访问.下图是对跨域访问的解释: 概念: 这里说的js跨域是指通过js或python在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据

Django跨域请求CSRF的方法示例

web跨域请求 1.为什么要有跨域限制 举个例子: 1.用户登录了自己的银行页面 http://mybank.com,http://mybank.com向用户的cookie中添加用户标识. 2.用户浏览了恶意页面 http://evil.com.执行了页面中的恶意AJAX请求代码. 3.http://evil.com向http://mybank.com发起AJAX HTTP请求,请求会默认把http://mybank.com对应cookie也同时发送过去. 4.银行页面从发送的cookie中提取

Vue+Django 跨域问题配置

跨域请求问题: 1.Django后端解决办法: # 后端下载模块: pip install django-cors-headers # settings配置: MIDDLEWARE = [ 'django.middleware.security.SecurityMiddleware', 'django.contrib.sessions.middleware.SessionMiddleware', 'django.middleware.common.CommonMiddleware', # 'dj

DJango跨域中间键

Skip to main content Search PyPISearch Help Donate Log in Register django-cors-middleware 1.3.1 pip install django-cors-middleware==1.3.1Copy PIP instructions Latest version Last released: Aug 20, 2016 django-cors-middleware is a Django application f

Django 跨域请求 解决 axios 未完待续

import django import os # os.environ.setdefault("DJANGO_SETTINGS_MODULE", "untitled5.settings") # project_name 项目名称 # django.setup() from django.utils.deprecation import MiddlewareMixin import importlib project_settings = os.environ['D

Django解决跨域

Django跨域问题 什么是跨域 ''' 通常情况下,A网页访问B服务器资源时,不满足以下三个条件其一就是跨域访问 1. 协议不同 2. 端口不同 3. 主机不同 ''' Django解决跨域 ''' 安装django-cors-headers模块 在settings.py中配置 # 注册app INSTALLED_APPS = [ ... 'corsheaders' ] # 添加中间件 MIDDLEWARE = [ ... 'corsheaders.middleware.CorsMiddlew

tornado django flask 跨域解决办法（cors）

XMLHttpRequest cannot load http://www.baidu.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://10.16.16.25:9988' is therefore not allowed access. tornado 这个就是典型的cors,允许后端允许跨域的方法.第二种方法,反向代理还在实践中 #!/usr/bi