为请求添加accessToken
除了登录和注册页面, 其他任何的访问都需要加上accessToken参数, 以表明用户的身份.
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动画的显示与隐藏
当请求发起时, 给用户一个loading动画的反馈
angular-loading-bar
身份认证
服务器向用户返回的状态码和提示信息,常见的有以下一些(方括号中是该状态码对应的HTTP动词).
- 200 OK - [GET]:服务器成功返回用户请求的数据,该操作是幂等的(Idempotent).
- 201 CREATED - [POST/PUT/PATCH]:用户新建或修改数据成功.
- 202 Accepted - [*]:表示一个请求已经进入后台排队(异步任务)
- 204 NO CONTENT - [DELETE]:用户删除数据成功.
- 400 INVALID REQUEST - [POST/PUT/PATCH]:用户发出的请求有错误,服务器没有进行新建或修改数据的操作,该操作是幂等的.
- 401 Unauthorized - [*]:表示用户没有权限(令牌、用户名、密码错误).
- 403 Forbidden - [*] 表示用户得到授权(与401错误相对),但是访问是被禁止的.
- 404 NOT FOUND - [*]:用户发出的请求针对的是不存在的记录,服务器没有进行操作,该操作是幂等的.
- 406 Not Acceptable - [GET]:用户请求的格式不可得(比如用户请求JSON格式,但是只有XML格式).
- 410 Gone -[GET]:用户请求的资源被永久删除,且不会再得到的.
- 422 Unprocesable entity - [POST/PUT/PATCH] 当创建一个对象时,发生一个验证错误.
- 500 INTERNAL SERVER ERROR - [*]:服务器发生错误,用户将无法判断发出的请求是否成功. 状态码的完全列表
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);
}
}
}
});
获取请求响应时间
让我们用拦截器来测一下从后台返回响应需要多少时间. 可以通过给每个请求和响应加上时间戳
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;
}
};
});