如何在Vue中實(shí)現(xiàn)登錄成功后保存token-創(chuàng)新互聯(lián)

這篇文章將為大家詳細(xì)講解有關(guān)如何在Vue中實(shí)現(xiàn)登錄成功后保存token，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個(gè)參考，希望大家閱讀完這篇文章后對(duì)相關(guān)知識(shí)有一定的了解。

創(chuàng)新互聯(lián)專注于平桂網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠(chéng)為您提供平桂營(yíng)銷型網(wǎng)站建設(shè)，平桂網(wǎng)站制作、平桂網(wǎng)頁(yè)設(shè)計(jì)、平桂網(wǎng)站官網(wǎng)定制、微信小程序開發(fā)服務(wù)，打造平桂網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供平桂網(wǎng)站排名全網(wǎng)營(yíng)銷落地服務(wù)。

在vue中，可以用**Storage（sessionStorage，localStorage）**來(lái)存儲(chǔ)token，也可以用vuex來(lái)存儲(chǔ)（但要考慮頁(yè)面刷新數(shù)據(jù)消失問(wèn)題，可以在vuex用Storage），

下面介紹用localStorage來(lái)存儲(chǔ)：

在登錄請(qǐng)求成功后，會(huì)返回一個(gè)token值，用loaclStorage保存

localStorage.setItem('token',res.data.token)

在main.js中設(shè)置全局請(qǐng)求頭和響應(yīng)回來(lái)的判斷

//設(shè)置axios請(qǐng)求頭加入token
Axios.interceptors.request.use(config => { 
 if (config.push === '/') { 
  } else { 
   if (localStorage.getItem('token')) { 
     //在請(qǐng)求頭加入token，名字要和后端接收請(qǐng)求頭的token名字一樣 
     config.headers.token=localStorage.getItem('token');  
   } 
  } 
   return config; 
 }, 
 error => { 
  return Promise.reject(error);
 });

//=============================
//響應(yīng)回來(lái)token是否過(guò)期
Axios.interceptors.response.use(response => { 
  console.log('響應(yīng)回來(lái)：'+response.data.code) 
  //和后端token失效返回碼約定403 
  if (response.data.code == 403) {
    // 引用elementui message提示框  
    ElementUI.Message({  
     message: '身份已失效', 
     type: 'err'  
     });
    //清除token 
    localStorage.removeItem('token ');
    //跳轉(zhuǎn)  
    router.push({name: 'login'}); 
   } else { 
     return response 
   } 
  }, 
 error => { 
  return Promise.reject(error); 
  })

網(wǎng)站題目：如何在Vue中實(shí)現(xiàn)登錄成功后保存token-創(chuàng)新互聯(lián)
當(dāng)前路徑：http://muchs.cn/article14/dsodde.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供App開發(fā)、微信公眾號(hào)、網(wǎng)站排名、微信小程序、移動(dòng)網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)

廣告

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