AngularJS 是一个 JavaScript 框架。它可通过 [removed] 标签添加到 HTML 页面。这篇文章主要介绍了分享Angular http interceptors 拦截器使用(推荐),需要的朋友可以参考下
在AngularJS中，HTTP服务是应用与服务器进行数据交互的核心组件。然而，有时我们需要在请求发送之前或响应接收之后执行一些通用的操作，如添加认证令牌、处理错误、记录日志等，这时Angular的HTTP Interceptors（拦截器）就派上了用场。本文将详细介绍如何在AngularJS中使用HTTP拦截器，并提供一些最佳实践。
HTTP拦截器是AngularJS提供的一种机制，允许我们在HTTP请求发出前和响应返回后进行拦截和处理。它们通过`$httpProvider.interceptors`数组来注册，可以用于全局地增强HTTP服务的行为。拦截器本质上是实现了特定接口的服务，这个接口定义了`request`、`response`、`requestError`和`responseError`四个方法。
1. `request`: 在HTTP请求被发送到服务器之前调用。可以修改请求配置，比如添加自定义头，或者取消请求。返回的是修改后的请求配置或者Promise，如果Promise被拒绝，请求将被取消。
```javascript
app.config(function($httpProvider) {
$httpProvider.interceptors.push(function($q, $location) {
return {
request: function(config) {
// 添加认证令牌
if (localStorage.getItem('authToken')) {
config.headers.Authorization = 'Bearer ' + localStorage.getItem('authToken');
}
return config;
}
};
});
});
```
2. `response`: 在HTTP响应被返回给客户端之前调用。可以修改响应数据，比如解密数据，或者决定是否显示给用户。返回的是修改后的响应对象或Promise。
```javascript
app.config(function($httpProvider) {
$httpProvider.interceptors.push(function($q) {
return {
response: function(response) {
// 对响应数据进行处理
return response;
}
};
});
});
```
3. `requestError`: 如果在`request`阶段发生错误，该方法会被调用。通常用于处理请求被取消或请求配置无效的情况。
4. `responseError`: 当HTTP请求失败时（例如服务器返回错误状态码），此方法会被调用。你可以在这里处理错误，比如重试请求，或者提示用户。
```javascript
app.config(function($httpProvider) {
$httpProvider.interceptors.push(function($q) {
return {
responseError: function(rejection) {
if (rejection.status === 401) {
// 未授权，重新登录
window.location.href = '/login';
}
return $q.reject(rejection);
}
};
});
});
```
除了在配置阶段注册拦截器，还可以在运行时通过`$http`服务的实例注入拦截器：
```javascript
$http({
url: '/api/data',
method: 'GET'
}).then(
// 成功处理
).catch(
// 错误处理
).finally(
// 总是执行
).interceptors.push({
responseError: function(rejection) {
// 运行时拦截器错误处理
}
});
```
使用HTTP拦截器时需要注意以下几点：
- 拦截器应尽可能保持轻量级，避免在其中进行复杂业务逻辑。
- 拦截器的错误处理应该谨慎，因为它们可能会导致整个应用的错误处理流程变得混乱。
- 当多个拦截器同时存在时，它们的执行顺序可能会影响结果，因此需合理安排。
- 为了确保良好的用户体验，不要在拦截器中进行阻塞操作，比如同步请求或长时间计算。
AngularJS的HTTP拦截器是实现请求和响应处理的强大工具，它们可以帮助我们实现诸如认证、日志记录、错误处理等功能，从而提升应用的健壮性和用户体验。合理利用拦截器，可以使代码更加模块化，提高代码复用率，降低维护成本。
