【Element UI】axios 与 request.js配置


request.js文件
import axios from 'axios'
import { MessageBox } from 'element-ui'

const service = axios.create({
  baseURL: 'http://127.0.0.1:8000/',
  timeout: 5000 # 这里如果你的数据超过几十万条,需要时间长度的话 简直直接注释
})

// 拦截器
service.interceptors.request.use(config => {
  if (window.sessionStorage.getItem('token')) {
    config.headers.authenticate = window.sessionStorage.getItem('token')
  }
  return config
}
)

// 响应器
service.interceptors.response.use(
  // 返回值
  response => {
    const res = response
    if (parseInt((res.data.code)) === 10014) {
      MessageBox.confirm('请联系管理员反馈情况', '请求异常', {
        confirmButtonText: '我知道了',
        type: 'error'
      })
    } else {
      return res
    }
    return res
  },
  // 403 
  error => {
    const res = error
    MessageBox.confirm('请退出账号并重新登录账号', '登录信息失效', {
      confirmButtonText: '好的',
      type: 'error'
    })
    return res
  }
)

export default service


 
api.js 文件

import request from '@/utils/request.js'

// 登陆
export function loginUser (data) {
  return request({
    url: 'api/login',
    method: 'post',
    data
  })
}

   // 获取进入登录     OrderTotal () {       OrderTotalGet().then((res) => {         this.todayTotal = res.data.data       }).catch(_error => {         this.logout()  // 如果403 就退出账号       })     },     // 退出账号     logout () {       window.sessionStorage.clear()     },
 
请求组件使用


// 请求组件
import { loginUser } from '@/api/user.js'


 // 登录
    Login () {
      var datas = {
        username: this.login.username,
        password: this.login.password
      }
      loginUser(datas).then((res) => {
        console.log('登录', res)
      })
    },