Vue和Django的跨域配置以及Element-ui的相关信息

1.Vue跨域配置

axios.defaults.baseURL = 'http://127.0.0.1:8000'
// 请求携带cookie
axios.defaults.withCredentials = true
// 异步请求 不阻塞  ---请求头
axios.defaults.headers['X-Requested-With'] = 'XMLHTTpRequest'
// 获取本地token    没有则为空
axios.defaults.headers['token'] = localStorage.getItem('token')
// 内容类型
axios.defaults.headers.post['Content-Type'] = 'application/json'

Vue.prototype.$axios = axios

2.Django配置

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 加入corsheaders中间件
    'corsheaders.middleware.CorsMiddleware',
    # 注释csrf中间件
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'day1.urls'
# 允许所有源访问
CORS_ORIGIN_ALLOW_ALL = True
# 跨域白名单
CORS_ORIGIN_WHITELIST = ('http://127.0.0.1:8080',)
# 允许带着cookie
CORS_ALLOW_CREDENTIALS = True
# 允许请求头
CORS_ALLOW_HEADERS = ('X-Requested-with', 'token', 'Content-Type')
# 允许请求方法
CORS_ALLOW_METHODS = ('GET', 'POST', 'PUT', 'DELETE')

3.Element-ui

Element-ui是一套基于Vue2.0的组件库.它提供了大量的资源,助力我们的网站快速成型