跨域问题解决办法

跨域问题及解决

# xss：跨站脚本攻击，cors：跨域资源共享，csrf：跨站请求伪造

# 1 同源策略：请求的url地址,必须与浏览器上的url地址处于同域上,也就是域名,端口,协议相同.
# 2 CORS：跨域资源共享，允许不同的域来我的服务器拿数据
# 3 CORS请求分成两类：简单请求（simple request）和非简单请求（not-so-simple request）
	只要同时满足以下两大条件，就属于简单请求
    （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
        
      #如果发送post请求，数据格式是json---》非简单请求，非简单请求发两次，一次OPTIONS请求，一次真正的请求


# 自己写在后端处理处理
# 4 后端处理，开启cors，跨域资源共享（在中间中写）
class MyMiddle(MiddlewareMixin):
    def process_response(self, request, response):
        response['Access-Control-Allow-Origin'] = '*'
        if request.method == "OPTIONS":
            # 可以加*
            response["Access-Control-Allow-Headers"] = "Content-Type"
            response["Access-Control-Allow-Headers"] = "authorization"

        return response
# 5 在setting的中间件中配置
MIDDLEWARE = [
    # 解决跨域问题
    # 'myapi.utils.middle.MyMiddleware', # 自己写的 为了了解原理
    'corsheaders.middleware.CorsMiddleware', # 第三方库写的
]


# 6 使用第三方，django-cors-headers
-pip install django-cors-headers

-注册app：
    INSTALLED_APPS = (
        ...
        'corsheaders',
        ...
    )

-配置中间件：
	MIDDLEWARE = [  
	...
	'corsheaders.middleware.CorsMiddleware',
	...
]

-setting中配置：
    CORS_ORIGIN_ALLOW_ALL = True
    CORS_ALLOW_METHODS = (
        'DELETE',
        'GET',
        'OPTIONS',
        'PATCH',
        'POST',
        'PUT',
        'VIEW',
    )
    CORS_ALLOW_HEADERS = (
        'authorization',	# 允许JWT
        'content-type',		# 允许非简单请求
    )

  # 配置白名单
  CORS_ALLOW_CREDENTIALS = True    #允许携带cookie
  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',
  )