遇到此問(wèn)題的背景:項(xiàng)目需要實(shí)現(xiàn)單點(diǎn)登錄,在前后端分離的前提下,前臺(tái)如何保存token值成為了一個(gè)問(wèn)題。想到的解決方案是,將token值統(tǒng)一存到一個(gè)前端程序,其他的前端程序去這個(gè)前端程序去取token(其他更好的解決方案歡迎指導(dǎo)~~)。在項(xiàng)目用angular的情況下,選擇了以下插件:angular-cross-storage,此插件可以實(shí)現(xiàn)跨域存取localStorage,操作非常簡(jiǎn)單,都有demo。
通常情況下,設(shè)置HTTP的authorization只需在congfig中進(jìn)行如下配置:
var app = angular.module("myApp",[]);
app.config(function($httpProvider) { $httpProvider.defaults.headers.common["Authorization"] = 所需帶的權(quán)限; });
但是在此處,權(quán)限值是存在另一個(gè)前端程序的token值,獲取權(quán)限token值是異步請(qǐng)求,并不能確定在何時(shí)能完成,說(shuō)不定還沒(méi)得到token值,頁(yè)面已經(jīng)發(fā)出了http請(qǐng)求,而這個(gè)沒(méi)設(shè)置Authorization的請(qǐng)求,勢(shì)必會(huì)返回401。
So 先要設(shè)置一個(gè)攔截器,并在攔截器里設(shè)置請(qǐng)求頭,代碼如下:
延伸閱讀
學(xué)習(xí)是年輕人改變自己的最好方式