Django办理Axios跨域问题（AxiosError {message ‘Network Error...） ...

Django办理Axios跨域问题（AxiosError {message: ‘Network Error…）


  
Django中担当axios哀求时会遇到的AxiosError: Network Error问题，这是由于当你用axios发送一个哀求到不同网站上（好比域名不同、端口不同），浏览器会认为这是不安全的操作，会拒绝这个哀求
Django中会有专门的中间件办理这个跨域问题，先直接上代码
【1】安装

1. pip install django-cors-headers

复制代码

【2】进入setting.py

1.注册app

1. INSTALLED_APPS = [
2.     '....其他app'
3.     'corsheaders',
4. ]

复制代码

2.注册中间件

1. MIDDLEWARE = [
2.     '....其他中间件'
3.     'corsheaders.middleware.CorsMiddleware',
4. ]

复制代码

3.新增配置文件

1. # 允许跨域源
2. CORS_ORIGIN_ALLOW_ALL = True
3. # 允许的请求头
4. CORS_ALLOW_HEADERS = (
5.     "accept",
6.     "accept-encoding",
7.     "authorization",
8.     "content-type",
9.     "dnt",
10.     "origin",
11.     "user-agent",
12.     "x-csrftoken",
13.     "x-requested-with",
15.     # 额外允许的请求头
16.     'token',
17. )

复制代码

原理

浏览器有一个名为同源策略（Same origin policy）的约定，它是浏览器最焦点也最基本的安全功能
该策略限制哀求的url中必须与浏览器上的url所在处于同域上，即域名(www.xxx.com)、端口(8080)、协议(http、https)雷同，否则浏览器会报cors错误
CORS

CORS分为简朴哀求和非简朴哀求

• 简朴哀求：只哀求一次，如果服务器处理了cors则正常返回，否则报错
  
• 非简朴哀求：先发送一次options哀求，如果服务器处理了cors则再发送真正的哀求，如果服务端没有处理则不会再发送
  

符合下面两个条件的就是简朴哀求

• 哀求方式时以下三种之一
  
  
  
  • HEAD
    
  • GET
    
  • POST
    
  
  
• HTTP的头信息不超出以下几种字段
  
  
  
  • Accept
    
  • Accept-Language
    
  • Content-Language
    
  • Last-Event-ID
    
  • Content-Type
    
  
  

而django-cors-headers则会帮我们自动处理简朴哀求和非简朴哀求，因此不需要我们再手动添加字段，除非有额外答应的哀求头参数

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。