vue pc端项目 注意事项

1.封装请求接口模块

// 导入axios模块
import axios from 'axios'
// 按照我们传入的参数创建一个实例出来
const instance = axios.create({
    // 当前项目的所有接口都是以这个地址开头的
    baseURL:'http://ttapi.research.itcast.cn/'
})

2.接口鉴权

前后端分离模式下 网站的数据都是通过接口获取而来的，有些接口只要提交数据格式正确就能访问，比如注册，登陆，更多的数据是私密性的，必须要有一个正确的用户标识才能访问，也就是告诉服务器你有访问当前数据的权力，token可以作为用户标识用来代表当前用户是有权利访问数据的

统一设置token-请求拦截器

axios 拦截器官方示例：http://www.axios-js.com/docs/#Interceptors

instance.interceptors.request.use(function (config) {
  // 发起正式请求之前 添加token字段
  const userInfo = getUser()//获取token
  if (userInfo && userInfo.token) {
    config.headers.Authorization = `Bearer ${userInfo.token}`
  }
  return config
}, function (error) {
  return Promise.reject(error)
})

注意：instance = 添加了baseUrl属性的axios