vue项目创建
1.安装node
https://nodejs.org/en/
2.安装cnpm
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
3.安装vue脚手架
npm install -g @vue/cli
4.创建projectname项目, 按需求选择
vue-cli 用的是 npm 源,只要设置 npm:npm config set registry https://registry.npm.taobao.org
(Babel、Router、Vuex、css Pre-processors、Linter/Formatter)
vue create projectname
↑ vue项目创建成功
vue项目初始化
- 新建utils目录,在目录里面创建request.js 文件
import Vue from 'vue'
import axios from 'axios'
import store from '@/store'
import notification from 'ant-design-vue/es/notification'
import {
ACCESS_TOKEN } from '@/store/mutation-types'
// 创建 axios 实例
const service = axios.create({
baseURL: process.env.VUE_APP_API_BASE_URL, // api base_url
timeout: 6000 // 请求超时时间
})
const err = (error) => {
if (error.response) {
const data = error.response.data
const token = Vue.ls.get(ACCESS_TOKEN)
if (error.response.status === 403) {
notification.error({
message: 'Forbidden',
description: data.message
})
}
if (error.response.status === 401 && !(data.result && data.result.isLogin)) {
notification.error({
message: 'Unauthorized',
description: 'Authorization verification failed'
})
if (token) {
store.dispatch('Logout').then(() => {
setTimeout(() => {
window.location.reload()
}, 1500)
})
}
}
}
return Promise.reject(error)
}
// request interceptor
service.interceptors.request.use(config => {
const token = Vue.ls.get(ACCESS_TOKEN)
if (token) {
config.headers['Access-Token'] = token // 让每个请求携带自定义 token 请根据实际情况自行修改
}
return config
}, err)
// response interceptor
service.interceptors.response.use((response) => {
return response.data
}, err)
2.在utils目录里面新建permission.js文件