diango前后端分离的跨域

在命令提示符中安装
pip install django-cors-headers

在settings.py文件中配置

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'corsheaders',#跨域
    'myapp',
    'rest_framework',

]

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',
    'corsheaders.middleware.CorsMiddleware'   # 添加跨域中间件
]
CORS_ORIGIN_ALLOW_ALL = True    #配置参数，允许所有源访问

打开黑窗口 输入
vue create 项目名
选择自定义
只选择路由跟vuex安装

运行终端输入
npm install --save axios

在vue根目录创建vue.config.js文件

module.exports={
    devServer:{
        proxy:'http://127.0.0.1:8000/' 
    }
}

在vue项目创建utils文件年里创建request.js文件

import Axios from 'axios'

//常用来封装
export function get(url,params){
    return Axios.get(url,params)
}
export function post(url,params){
    return Axios.post(url,params)
}
export function put(url,params){
    return Axios.put(url,params)
}
export function del(url,params){
    return Axios.delete(url,params)
}

在views文件夹内创建vue文件

import Index from '../views/people/Index.vue'


const routes = [
  {
    path: '/',    //视图页面
    name: 'Index',
    component: Index