在開發(fā)中我們經(jīng)常遇到這樣的需求，需要用戶直接點(diǎn)擊一個(gè)鏈接進(jìn)入到一個(gè)頁面，用戶點(diǎn)擊后鏈接后會(huì)觸發(fā)401攔截返回登錄界面，登錄后又跳轉(zhuǎn)到鏈接的頁面而不是首頁，這種問題該如何去做呢？

創(chuàng)新互聯(lián)公司致力于互聯(lián)網(wǎng)品牌建設(shè)與網(wǎng)絡(luò)營銷，包括成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、SEO優(yōu)化、網(wǎng)絡(luò)推廣、整站優(yōu)化營銷策劃推廣、電子商務(wù)、移動(dòng)互聯(lián)網(wǎng)營銷等。創(chuàng)新互聯(lián)公司為不同類型的客戶提供良好的互聯(lián)網(wǎng)應(yīng)用定制及解決方案，創(chuàng)新互聯(lián)公司核心團(tuán)隊(duì)十載專注互聯(lián)網(wǎng)開發(fā)，積累了豐富的網(wǎng)站經(jīng)驗(yàn)，為廣大企業(yè)客戶提供一站式企業(yè)網(wǎng)站建設(shè)服務(wù)，在網(wǎng)站建設(shè)行業(yè)內(nèi)樹立了良好口碑。

先說一下我們需要用到的幾個(gè)API：

1.router.currentRoute:當(dāng)前的路由信息對象，我們可以通過router.currentRoute.fullPath獲得解析后的 URL，包含查詢參數(shù)和 hash 的完整路徑，如果要訪問的頁面的路由有命名（name）的話，可以通過router.currentRoute.name獲得當(dāng)前路由的名稱。

2.router.replace：作用和router.push相同，不過它不會(huì)向history添加新紀(jì)錄，而是替換當(dāng)前的history記錄。

由于大家的代碼寫的都不一樣，我就不放我具體的實(shí)現(xiàn)代碼，簡單介紹一下思路：

1.用戶點(diǎn)開鏈接后，跳轉(zhuǎn)到的目標(biāo)的路由頁面，然后觸發(fā)401攔截器，返回登錄頁面：

//401攔截
if（status == "401"）{
  router.push("/login")   
}

2.我們可以在401攔截的時(shí)候?qū)⒛繕?biāo)鏈接保存在url中：

if (status == 401) {
   //判斷當(dāng)前的路由是否是目標(biāo)路由
   if(router.currentRoute.name == "target"){
    //跳轉(zhuǎn)回login路由，并把目標(biāo)路由的url路徑保存在login的query中
    router.replace({
     name:"login",
     query: {redirect: router.currentRoute.fullPath}
    })
   }else{
    /* 普通401攔截直接返回到登錄頁面 */
    router.push('/login');
   }
  }

3.點(diǎn)擊登錄后使用url上保存的query直接跳轉(zhuǎn)回目標(biāo)頁面

router.push({path:decodeURIComponent(url)});

以上就是我們分享的功能實(shí)現(xiàn)代碼，感謝你對創(chuàng)新互聯(lián)的支持。