/**
 * 关于 axios cancel token 的配置
 * 当 Vue 单页应用，一个页面请求未完全结束就被调走到其他路由的时候
 * 需要把前一个页面的未完成的请求，全部干掉，不影响当前路由的请求
 */
import Vue from 'vue'
import App from './App.vue'
import router from './router'

// Axios configuration
window.axios = require('axios')
// ... other config

// Axios request interceptors
// 定义 cancel token
let requestSource = { token: null, cancel: null }
const CancelToken = window.axios.CancelToken

// 打断 axios 请求，当 config.cancelToken 有值的时候，请求会被 cancel 掉
window.axios.interceptors.request.use(config => {
  config.cancelToken = requestSource.token
  return config
}, error => {
  return Promise.reject(error)
})

// Router Before Each Configuration
// 在进入每个新路由之前，给 axios 的 cancel token 赋值
router.beforeEach((to, from, next) => {
  requestSource.cancel && requestSource.cancel()
  requestSource = CancelToken.source()
  next()
})

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')