axios攔截器?


// 引入axios以及element ui中的loading和message組件
import axios from 'axios'
import { Loading, Message } from 'element-ui'
// 超時時間
axios.defaults.timeout = 5000
// http請求攔截器
var loadinginstace
axios.interceptors.request.use(config => {
  // element ui Loading方法
  loadinginstace = Loading.service({ fullscreen: true })
  return config
}, error => {
  loadinginstace.close()
  Message.error({
  message: '加載超時'
  })
  return Promise.reject(error)
})
// http響應攔截器
axios.interceptors.response.use(data => { // 響應成功關閉loading
  loadinginstace.close()
  return data
}, error => {
  loadinginstace.close()
  Message.error({
  message: '加載失敗'
  })
  return Promise.reject(error)
})
 
export default axios
 
設置登陸攔截
import Vue from 'vue'
import Router from 'vue-router'
 
Vue.use(Router)
 
const router = new Router({
  routes: [
  {
   path: '/' ,
   /*
   * 按需加載
   */
   component: (resolve) => {
   require([ '../components/Home' ], resolve)
   }
  }, {
   path: '/record' ,
   name: 'record' ,
   component: (resolve) => {
   require([ '../components/Record' ], resolve)
   }
  }, {
   path: '/Register' ,
   name: 'Register' ,
   component: (resolve) => {
   require([ '../components/Register' ], resolve)
   }
  }, {
   path: '/Luck' ,
   name: 'Luck' ,
   // 需要登錄才能進入的頁面可以增加一個meta屬性
   meta: {
   requireAuth: true
   },
   component: (resolve) => {
   require([ '../components/luck28/Luck' ], resolve)
   }
  }
  ]
})
// 判斷是否需要登錄權限 以及是否登錄
router.beforeEach((to, from, next) => {
  if (to.matched.some(res => res.meta.requireAuth)) { // 判斷是否需要登錄權限
  if (localStorage.getItem( 'username' )) { // 判斷是否登錄
   next()
  } else { // 沒登錄則跳轉到登錄界面
   next({
   path: '/Register' ,
   query: {redirect: to.fullPath}
   })
  }
  } else {
  next()
  }
})
 
export default router


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM