axios在vue中的应用之拦截器

axios在vue中的应用之拦截器

定义：在请求或响应被处理前拦截(在请求处理和在后端响应之后处理)

拦截器分为两种:请求拦截器和响应拦截器

 

1.拦截器使用语法：

1.1 请求拦截器

      $axios.interceptors.request.use

      (

        config=>{

          //在发送请求前做些什么

          return config

        },err=>{

          //在请求错误时做些什么

          return Promise.reject(err)

        }

      )

1.2 响应拦截器

//响应拦截器

      $axios.interceptors.response.use

      (

        res=>{

          //请求成功对应响应数据做处理

          return res

        },err=>{

          //在响应错误时做些什么

          return Promise.reject(err)

        }

      )

      // $axios.get().then(res=>{}) res就是上面return的res

      //axios.get().then().catch(err=>{}) err就是上面的err

//取消拦截器(了解)

//axios.interceptors.request.eject(interceptors);

//例子，登录（token:'')

  let instance = axios.create({})

      intance.interceptors.request.use

      (config=>{

        config.headers.toke=''

        // config.headers={ //因为headers不止有token，此种写法会覆盖其他值

        //   token:''

        // }

        return config;

      }

      )

 

      //访问不需要登录的接口

      let newInstance = axios.create({})