vue+django跨域问题的学习

在vue中进行axios请求数据的数据是弹出错误信息

No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

出现了跨域问题

解决方法：

第一步：

安装django-cors-headers

pip3 install django-cors-headers

第二步：

在setting.py文件中的：
MIDDLEWARE添加corsheaders.middleware.CorsMiddleware

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    ......
]

第三步：

在INSTALLED_APPS里添加corsheaders

INSTALLED_APPS = [
    .....
    'corsheaders',
    .....
]

第四步：

在最后加入：

# 定义允许的匹配路径正则表达式
CORS_URLS_REGEX = '^.*$'

# 设置允许访问的方法
CORS_ALLOW_METHODS = (
    'DELETE',
    'GET',
    'OPTIONS',
    'PATCH',
    'POST',
    'PUT',
    'VIEW',
)

# 设置允许的header
CORS_ALLOW_HEADERS = (
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
)

最后：

成功请求到数据

参考: 连接