本篇文章為大家展示了使用vue-resource請求怎么實現(xiàn)http登錄攔截，內(nèi)容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

網(wǎng)站建設(shè)哪家好，找創(chuàng)新互聯(lián)！專注于網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、微信小程序定制開發(fā)、集團企業(yè)網(wǎng)站建設(shè)等服務(wù)項目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了山陰免費建站歡迎大家使用！

路由文件

export default [
 {
  name: 'root',
  path: '',
  component: function (resolve) {
   require(['你的vue文件路徑地址'], resolve);
  },
  children: [
    {
      name: 'applicationLayout',
      path: '/app/applicationLayout/:appId',
      component: function (resolve) {
       require(['你的vue文件路徑地址'], resolve);
      },
      meta: {
       requireAuth: true,    // 需要登錄才能進入的頁面可以增加一個meta屬性
      }
    }
  ] 
]

main.js 入口文件中加入以下代碼

const UNAUTHORIZED_CODE = 401;

router.beforeEach((to, from, next) => {
 if (to.meta.requireAuth) {
  if (storage.get('platformUser')) {
   store.dispatch('loginUser', JSON.parse(storage.get('platformUser')));    //將用戶信息存儲到vuex中，供全局使用
   next();
  } else {
   store.dispatch('initLoginModal', {state: true});     //顯示登錄彈窗
   next();
  }
 } else {
  next();
 }
});

//攔截http請求中返回401狀態(tài)碼，并針對其顯示登錄彈窗
Vue.http.interceptors.push((request, next) => {
 next((response) => {
  if (response.body.status === UNAUTHORIZED_CODE) { //與后臺約定登錄失效的返回碼
   store.dispatch('initLoginModal', {state: true});        //顯示登錄彈窗
   store.dispatch('removeUser');                      //移出瀏覽器中存儲的用戶信息
  }
  return response;
 });
});

上述內(nèi)容就是使用vue-resource請求怎么實現(xiàn)http登錄攔截，你們學(xué)到知識或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識儲備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前題目：使用vue-resource請求怎么實現(xiàn)http登錄攔截-創(chuàng)新互聯(lián)
文章分享：http://chinadenli.net/article42/dioihc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供電子商務(wù)、網(wǎng)站內(nèi)鏈、動態(tài)網(wǎng)站、網(wǎng)站設(shè)計公司、建站公司、網(wǎng)站改版

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)