# drf技术

**Repository Path**: hailang123/drf-technology

## Basic Information

- **Project Name**: drf技术
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-10-15
- **Last Updated**: 2022-01-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Django, Vue

## README

Django API
Django REST framework
&
Vue - Axios
Django 实现跨域
pip install django-cors-headers

后端django根目录settings.py
INSTALLED_APPS = [
  ...
    'rest_framework',
    'corsheaders',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'corsheaders.middleware.CorsMiddleware', // 跨域设置
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
添加
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_HEADERS = ('*')
.vue项目中
命令行
Npm install axios
Npm install vue-axios

前端vue根目录/ main.js
引入axios
前端需要数据的页面
引入 axios
设定方法：
Created(){}
Methods:{
getData(){
Axios.get(`数据页面`).then((response) =>{
This.数据名称 = response.data
})​