亚洲 国产精品 日韩-亚洲 激情-亚洲 欧美 91-亚洲 欧美 成人日韩-青青青草视频在线观看-青青青草影院

千鋒教育-做有情懷、有良心、有品質的職業教育機構

手機站
千鋒教育

千鋒學習站 | 隨時隨地免費學

千鋒教育

掃一掃進入千鋒手機站

領取全套視頻
千鋒教育

關注千鋒學習站小程序
隨時隨地免費學習課程

當前位置:首頁  >  技術干貨  > axios的請求攔截和vue路由的導航守衛有什么區別

axios的請求攔截和vue路由的導航守衛有什么區別

來源:千鋒教育
發布人:syq
時間: 2022-08-11 10:49:50 1660186190

  在Vue項目中,有兩種用戶登錄狀態判斷并處理的情況,分別為:導航守衛和axios攔截器。

axios的請求攔截

  1. 導航守衛:攔截組件

  · 導航守衛就是我們進行某些頁面的時候需要判斷當前用戶是否登錄過,如果登陸過,則可以跳轉,否則重定向到登錄頁面

  · 導航守衛只是前端做出判斷,檢查請求頭中是否帶有token,并不能判斷token是否失效

  · 每個守衛方法接收三個參數:

  o to: Route: 即將要進入的目標 路由對象

  o from: Route: 當前導航正要離開的路由

  o next: Function: 一定要調用該方法來 resolve 這個鉤子。執行效果依賴 next 方法的調用參數。

  o next(): 進行管道中的下一個鉤子。如果全部鉤子執行完了,則導航的狀態就是 confirmed (確認的)。

  o `next(false)`: 中斷當前的導航。如果瀏覽器的 URL 改變了 (可能是用戶手動或者瀏覽器后退按鈕),那么 URL 地址會重置到 from 路由對應的地址。

  o next('/') 或者 next({ path: '/' }): 跳轉到一個不同的地址。當前的導航被中斷,然后進行一個新的導航。你可以向 next 傳遞任意位置對象,且允許設置諸如 replace: true、name: 'home' 之類的選項以及任何用在 router-link 的 to prop 或 router.push 中的選項。

  o next(error): (2.4.0+) 如果傳入 next 的參數是一個 Error 實例,則導航會被終止且該錯誤會被傳遞給 router.onError() 注冊過的回調。

  o ps: 一定要確保要調用next

  // 添加路由守衛--導航守衛

    // 作用是通過判斷來決定當前的路由跳轉到底能不能進行

    // 這種守衛,只要進行路由的跳轉就會自動的觸發,不能人為調用

    router.beforeEach((to, from, next) => {

      // to:目標路由

      // from:源路由

      // next:下一步的操作,就是用戶當前需要進行的操作

      console.log(to);

      // console.log(from);

      // 判斷當前用戶是否登陸,如果登陸了則可以跳轉,否則重定向到登陸頁

      // 獲取用戶登陸之后的token,進行token的判斷

      if (to.path !== '/login' || to.path !== '/register') { // 非登錄頁面驗證是否存在token

        let token = localStorage.getItem('token')

        if (token) {

          next()

        } else {

          Toast('請先登陸')

          // 說明沒有登陸,則重定向到登陸頁

          next({ name: 'login' })

        }

      } else {

        next()

      }

    })

  2. axios攔截器:攔截后端接口

  · 每次發送請求之前判斷vuex或者本地存儲中是否存在token

  · 如果存在,則統一在http請求的header都加上token,這樣后臺根據token判斷你的登錄情況

  · 即使本地存在token,也有可能token是過期的,所以在響應攔截器中要對返回狀態進行判斷

    // 添加請求攔截器

    // 每一個我們自己封裝的axios請求都會經過這個攔截器

    axios.interceptors.request.use(function (config) {

        console.log(config)

        // 在發送請求之前做些什么:我要看看有沒有token,如果有,則以請求頭的方式進行傳遞

        let token = localStorage.getItem('token')

        if (token) {

          // 設置請求頭

          config.headers.Authorization = token

        }

        return config;

      }, function (error) {

        // 對請求錯誤做些什么

        return Promise.reject(error);

    });

  3. 導航守衛和axios攔截器的區別

  · 導航守衛就是路由守衛,想進入一個頁面時,判斷是否有權限訪問(有token,就有權限,沒有就返回),但并不能判斷是否失效。

  · axios攔截器是發送請求判斷token的有效性,如果有就將token放在請求頭里。

  · 導航守衛和axios攔截器一起使用,進而來確保登錄的狀態

  更多關于IT前端培訓的問題,歡迎咨詢千鋒教育在線名師,如果想要了解我們的師資、課程、項目實操的話可以點擊咨詢課程顧問,獲取試聽資格來試聽我們的課程,在線零距離接觸千鋒教育大咖名師,讓你輕松從入門到精通。

tags:
聲明:本站稿件版權均屬千鋒教育所有,未經許可不得擅自轉載。
10年以上業內強師集結,手把手帶你蛻變精英
請您保持通訊暢通,專屬學習老師24小時內將與您1V1溝通
免費領取
今日已有369人領取成功
劉同學 138****2860 剛剛成功領取
王同學 131****2015 剛剛成功領取
張同學 133****4652 剛剛成功領取
李同學 135****8607 剛剛成功領取
楊同學 132****5667 剛剛成功領取
岳同學 134****6652 剛剛成功領取
梁同學 157****2950 剛剛成功領取
劉同學 189****1015 剛剛成功領取
張同學 155****4678 剛剛成功領取
鄒同學 139****2907 剛剛成功領取
董同學 138****2867 剛剛成功領取
周同學 136****3602 剛剛成功領取
相關推薦HOT
開班信息
北京校區
  • 北京校區
  • 大連校區
  • 廣州校區
  • 成都校區
  • 杭州校區
  • 長沙校區
  • 合肥校區
  • 南京校區
  • 上海校區
  • 深圳校區
  • 武漢校區
  • 鄭州校區
  • 西安校區
  • 青島校區
  • 重慶校區
  • 太原校區
  • 沈陽校區
  • 南昌校區
  • 哈爾濱校區
宝贝我不想带小雨伞了| 亚洲熟妇AV日韩熟妇在线| 国产精品久久无码一区| 暗呦交小U女国产精品视频| 中文字幕AV一区二区三区人妻少| 亚洲国产一二三精品无码| 无遮挡粉嫩小泬久久久久久欧| 色8激情欧美成人久久综合电| 欧美一区二区放荡人妇| 欧美黑人一级二级巨大久久天堂 | 亚洲AV永久无码老湿机漫画| 无码欧亚熟妇人妻AV在线| 少妇婬荡久久久久AV无码| 日韩电影久久久被窝网| 人妻熟妇乱又伦精品视频APP| 欧美日韩在大午夜爽爽影院 | 午夜成人鲁丝片午夜精品| 咬住下唇动漫在线播放完整版| 亚洲色精品一区二区三区 | 野兽的夜晚第四季忘不掉的前任 | 久久99精品久久久久久不卡 | 亚洲最大的熟女水蜜桃AV网站| WWW久久久天天COM| 草草影院CCYY国产日本欧美| 成人欧美一区二区三区| 从厨房一路干到卧室好吗| 二虎进入温如玉160章小说| 丰满熟妇乱又伦在线无码视频| 国产AV无码专区亚汌A√| 国产精品成人AV电影不卡| 国产免费久久精品国产传媒| 国内精品久久久久久久小说 | 欧美丰满熟妇XXXX| 性俄罗斯牲交XXXXX视频| 亚洲AV无码成人专区片在线观看 | 国产乱子伦视频一区二区三区| 老太BBWWBBWW高潮| 欧美AAAAAA级午夜福利视频| 女儿的朋友中字头| 人妻少妇看A偷人无码精品| 日韩欧美AⅤ综合网站发布| 丝袜护士无码视频一区二区三区| 污污网站18禁在线永久免费观看| 午夜香吻电视剧免费观看| 亚洲AV无码AV男人的天堂| 亚洲精品国产V片在线观看| 一二三四免费中文在线| 18禁美女裸体无遮挡免费观看国| CHINESE新版少妇嫖妓VI| 成熟人妻换╳╳╳╳| 久久精品国产亚洲AV蜜桃AV| 男生坤坤放在女生坤坤叫什么| 无码专区6080YY免费视频| 亚洲欧美xxxx| 99久久综合狠狠综合久久| 波多野结衣TORRENT| 国产精品久久国产精品99 | 18禁超污无遮挡无码免费游戏| 国产精品无码专区在线播放| 精品亚洲国产成人AV制服| 内谢XXXXX8老| 亚洲精品无码AV人在线播放| 丰满人妻被中出中文字幕| 男同GAY片自慰AV网站| 亚洲国产精品无码AV| 坐在根茎写作业好吗| 俄罗斯POMOGISEBE| 麻豆星空精东天美MV| 日日玩日日摸日日上| 性俄罗斯牲交XXXXX视频| YSL小金管水蜜桃色| 久久人妻AV无码中文专区| 人人妻人人澡人人爽人人爱看| 阳台顶着岳刘晓莉的肥臀| 国产无遮挡18禁无码网站免费| 美乳丰满人妻无码视频| 日韩AV一区二区在线| 中文字幕无码毛片免费看| 国产成人精品亚洲日本专区61| 久久不见久久见免费影院3| 无码H肉动漫在线观看| 在线观看特色大片免费网站| 公车上双乳被老汉揉搓玩弄漫画| 精品人妻AV一区二区三区| 全部免费毛片在线播放| 亚洲AV无码潮喷在线观看 | 红杏亚洲影院一区二区三区| 农村风流大炕作爱| 野花日本中文免费完整版4| 韩国无码无遮挡在线观看| 欧美牲交A欧美牲交AⅤ免费真| 一本久久A久久精品亚洲| 激情综合婷婷丁香五月俺来也| 无码人妻精品中文字幕免费| 丰满人妻熟妇乱又伦精品视频三| 欧美日韩亚洲中文字幕二区| 最新国产在线拍揄自揄视频| 久欠精品国国产99国产精2| 天天躁日日躁狠狠躁人妻 | 久久国产精品99精品国产| 校园H学长含着粉嫩小奶| 国产成人无码一区二区三区在线 | 国产一卡2卡3卡4卡无卡国色 | HEZYO东京热无码专区| 国产最大成人亚洲精品| 污黄啪啪网18以下勿进| 国产成人AAAAA级毛片| 人人爽人人爽人人片A∨不卡| 亚洲欧美精品午睡沙发| 厨房挺人ⅩXXX猛交| 人妻无码中文字幕一区二区三区| DIPTYQUE含羞草香薰| 欧美黑人巨大手机在线观看| 2021国内精品久久久久精品| 国内精品久久久久久久久齐齐 | 久久久久久亚洲AV无码蜜芽| 天天做AV天天爱天天爽| 俄罗斯卖CSGO的网站| 搡BBB搡BBBB搡BBBB| 丰满少妇人妻无码| 少妇被粗大猛进进出Va| 99精品国产在热久久婷婷| 国语对白做受XXXXX在| 日韩人妻中文字幕| 波多野结衣的电影| 日韩视频一二三区2021| 国产69精品久久久久9999不| 欧美人文艺术欣赏PPT背景| 亚洲日韩精品无码专区加勒比海| 国产成人高清精品免费软件| 婷婷色婷婷开心五月四房播播| HD极品FREE性XXⅩ护士I| 人妻18毛片A级毛片免费看| 锕锕锕锕锕锕锕好大污下载| 久久精品国产久精国产| 一本色道久久HEZYO无码 | 一面亲上边一面膜下边56| 乱人伦人妻中文字幕无码| 西西人体午夜视频无码| 国产揄拍国产精品| 亚洲欧洲日产国码无码AV一| 麻豆国产AV丝袜白领传媒| 337P粉嫩日本欧洲亚洲大胆艺 | 男吃奶玩乳尖高潮视频午夜I| 亚洲成a人片在线观看无码专区| 国产 国语对白 露脸| 无码人妻久久一区二区三区不卡| 国产在线孕妇孕交| 亚洲午夜无码毛片av| 国产男男Gay做受| 亚洲开心婷婷中文字幕| 麻豆WWW传媒入口| FREE性VIDEOXXⅩ欧美| 少妇人妻真实偷人精品视频| 国产在线精品无码AV不卡顿| 艳妇乳肉豪妇荡乳XXX| 欧美精品多人P群无码| 顶级大但人文艺术中的绘画作品| 人妻精品久久一区二区av| 国产ΑV在线ΑV天堂AⅤ国产| 小浪货腿打开水真多真紧| 久久国产精品成人影院| 91麻豆精品无码一区二区三区| 麻花传媒0076在线观看| А√新版天堂资源在线BT| 天天做天天爱夜夜夜爽毛片 | 国产丰满麻豆HDXVIDEOS| 少妇无码太爽了在线播放| 国语对白做受XXXXX在线| 自慰喷水高清毛片AV片| 三级4级全黄60分钟| 好了AV四色综合无码久久| 中文弹幕日产无线码一区| 日韩欧美操逼视频| 精品国产人成亚洲区| 亚洲精华液一二三产区| 免费人妻AV无码专区| √天堂资源中文WWW| 如狼似虎的熟妇14P| 狠狠色丁香久久婷婷综合五月 | 熟妇人妻久久中文字幕麻豆网| 国精产品一线二线三线区别| 中文字幕亚洲人妻| 四虎永久在线精品免费无码| 国产成人人人97超碰超爽8| 亚洲日韩丝袜熟女变态夜夜爽 | 办公室被绑奶头调教羞辱OL| 掀开老师的裙子挺进去| 免费无码AV片流白浆在线观看| 国产成人无码H在线观看网站| 亚洲熟悉妇女XXX妇女AV| 日本少妇毛茸茸高潮| 丁香色婷婷国产精品视频| 亚洲精品无码久久久影院相关影片| 欧美老熟妇XOXOXOⅩO| 国产毛片久久久久久国产毛片| 147VT最大但人文艺术| 香蕉久久久久久AV综合网成人| 男人扒开女人下面猛进猛出 | 蜜乳一区在线视频|