為請求添加accessToken
除了登錄和注冊頁面, 其他任何的訪問都需要加上accessToken參數(shù), 以表明用戶的身份.
angular.module('app')
.factory('accessTokenInterceptor', function ($injector) {
return {
request: function (config) {
var authService = $injector.get('authService');
var url = config.url;
if (!/\s*.html$/.test(url) && url.indexOf('/sign-in') == -1 && url.indexOf('/sign-up') == -1) {
config.params = angular.extend({}, config.params, {
accessToken: authService.getToken()
});
}
return config;
}
}
});
loading動(dòng)畫的顯示與隱藏
當(dāng)請求發(fā)起時(shí), 給用戶一個(gè)loading動(dòng)畫的反饋
angular-loading-bar
身份認(rèn)證
服務(wù)器向用戶返回的狀態(tài)碼和提示信息台舱，常見的有以下一些（方括號(hào)中是該狀態(tài)碼對應(yīng)的HTTP動(dòng)詞）.
- 200 OK - [GET]：服務(wù)器成功返回用戶請求的數(shù)據(jù)柳爽，該操作是冪等的（Idempotent）.
- 201 CREATED - [POST/PUT/PATCH]：用戶新建或修改數(shù)據(jù)成功.
- 202 Accepted - [*]：表示一個(gè)請求已經(jīng)進(jìn)入后臺(tái)排隊(duì)（異步任務(wù)）
- 204 NO CONTENT - [DELETE]：用戶刪除數(shù)據(jù)成功.
- 400 INVALID REQUEST - [POST/PUT/PATCH]：用戶發(fā)出的請求有錯(cuò)誤，服務(wù)器沒有進(jìn)行新建或修改數(shù)據(jù)的操作，該操作是冪等的.
- 401 Unauthorized - [*]：表示用戶沒有權(quán)限（令牌、用戶名、密碼錯(cuò)誤）.
- 403 Forbidden - [*] 表示用戶得到授權(quán)（與401錯(cuò)誤相對），但是訪問是被禁止的.
- 404 NOT FOUND - [*]：用戶發(fā)出的請求針對的是不存在的記錄，服務(wù)器沒有進(jìn)行操作物蝙，該操作是冪等的.
- 406 Not Acceptable - [GET]：用戶請求的格式不可得（比如用戶請求JSON格式，但是只有XML格式）.
- 410 Gone -[GET]：用戶請求的資源被永久刪除敢艰，且不會(huì)再得到的.
- 422 Unprocesable entity - [POST/PUT/PATCH] 當(dāng)創(chuàng)建一個(gè)對象時(shí)诬乞，發(fā)生一個(gè)驗(yàn)證錯(cuò)誤.
- 500 INTERNAL SERVER ERROR - [*]：服務(wù)器發(fā)生錯(cuò)誤，用戶將無法判斷發(fā)出的請求是否成功. 狀態(tài)碼的完全列表
angular.module('app')
.factory('authInterceptor', function($q, AUTH_EVENTS) {
return {
responseError: function(error) {
var statusCodeMap = {
401: AUTH_EVENTS.notAuthenticated,
403: AUTH_EVENTS.notAuthorized
};
var authEvent = statusCodeMap[response.status];
if (authEvent) {
$rootScope.$broadcast(authEvent, response);
}
return $q.reject(response);
}
}
}
});
獲取請求響應(yīng)時(shí)間
讓我們用攔截器來測一下從后臺(tái)返回響應(yīng)需要多少時(shí)間. 可以通過給每個(gè)請求和響應(yīng)加上時(shí)間戳
angular.module('app')
.factory('timestampMarkerInterceptor', function() {
return {
request: function(config) {
config.requestTimestamp = new Date().getTime();
return config;
},
response: function(response) {
var config = response.config;
config.responseTimestamp = new Date().getTime();
var time = config.responseTimestamp - config.requestTimestamp;
console.log('The request: ' + config.url + ' took ' + (time / 1000) + ' seconds.');
return response;
}
};
});
