2013-07-15 143 views
5

我有一個.Net MVC WebApi應用程序,並試圖在Angularjs中專門編寫前端。我能夠通過json獲取數據並對其進行操作,但是我現在需要保護數據並將Base64身份驗證添加到服務器的頭文件中。當我瀏覽我的一些.net視圖測試頁面時,我會得到相應的登錄框,要求輸入用戶名/密碼,以便我可以繼續獲取json。AngularJs -.net MVC WebApi身份驗證示例

我不知道該怎麼做是在角度設置在我的$資源中的標題中傳遞此信息(用戶/通行證)。有沒有完整的例子可以更好地向我展示如何做到這一點?我知道它涉及cookies並使用服務器傳回的令牌,但我不知道如何將這些碎片放在一起。

當我把所有這些都集中在一起後,我希望能夠發佈一個完整的骨架示例(DAL,RESTFUL,控制檯測試層)。

所以問題是 - 如何在使用AngularJS $資源時將認證信息插入到客戶端的頭文件中?

感謝

+0

我不確定這裏的問題是什麼。你如何設置Angular的頭文件?要麼... ?另外,你有什麼試圖做的? –

+0

我同意blesh,這個問題非常廣泛。但是使用[Authenticate]批註應該可以讓你找到某個地方,並輸出一個防僞標記。 Phil Haack在這裏寫了這個 http://haacked.com/archive/2011/10/10/preventing-csrf-with-ajax.aspx – marko

回答

3

如果你把在服務器端AngularJS標頭中的cookie將所有的時間發送這個cookie ..ü無關。

如果你想在Header中傳遞token而不是在角度上的cxookie中,只需在配置塊中執行:$httpProvider.defaults.headers.common['X-Auth'] = yourKey;

然後如果你想知道用戶是否登錄或者他是否擁有權限只是實現了攔截器。這是一個簡單的工廠,您將始終在您的配置塊中推送responseIntercetors。

這家工廠將傾聽來自服務器和他的執行每個響應您要檢查錯誤情況下,響應的狀態代碼:

401 - >未登錄 403 - >未授權

工廠的

例如:

myModule.factory('myHttpInterceptor', function ($q) { 
    return function (promise) { 
     return promise.then(function (response) { 
      // do something on success    
      return response; 
     }, function (response) { 
      // do something on error 
      //check status 401 or 403 
      return $q.reject(response); 
     }); 
    }; 
}); 

然後把你的工廠在HTTP responseIntercetors像這樣在你的CON圖塊:

myModule.config(function ($httpProvider) { 
    $httpProvider.responseInterceptors.push('myHttpInterceptor'); 
}); 

只要記住這個解決方案在AngularJS 1.1.4(仍然不穩定),不推薦使用......

工廠必須是一個有點不同只是指這個職位的詳細信息:AngularJS Intercept all $http JSON responses

希望它有幫助