问题
In angular 2 app every request to API has header with token, in case token has expired API responds with 401 http code. I have a method to update token, but how I can resend previous request pausing others while a new token is in the process of getting?
回答1:
You could extend the Http
class for this this way, catch the error using the catch
operator of observables:
An approach could be to extend the HTTP object to intercept errors:
@Injectable()
export class CustomHttp extends Http {
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
console.log('request...');
return super.request(url, options).catch(res => {
// do something
});
}
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
console.log('get...');
return super.get(url, options).catch(res => {
// do something
});
}
}
and register it as described below:
bootstrap(AppComponent, [HTTP_PROVIDERS,
new Provider(Http, {
useFactory: (backend: XHRBackend, defaultOptions: RequestOptions) => new CustomHttp(backend, defaultOptions),
deps: [XHRBackend, RequestOptions]
})
]);
Within the callback defined in the catch
operator, you could call your method to update the token, get the result, set the new token on the source request and execute it again. This would be completely transparent.
Here is a sample:
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
return super.get(url, options).catch(res => {
if (res.status === 401) {
return this.getToken().flatMap(token => {
var sourceOptions = options || {};
var headers = sourceOptions.headers || new Headers();
headers.append('Authorization', token); // for example
return super.get(url, options);
});
}
return Observable.throw(res);
});
}
Edit
To "pause" other requests you need to implement some caching within the getToken
method using the do
and share
operators:
getToken() {
if (hasTokenExpired()) {
this.token = null;
this.tokenObservable = null;
}
if (this.token) {
// Gotten the new token
return Observable.of(this.token);
} else if (this.tokenObservable) {
// Request in progress...
return this.tokenObservable;
} else {
// Execute the "refresh token" request
return this.get('/refreshToken')
.map(res => res.json)
.do(token => {
this.token = token;
this.tokenObservable = null;
})
.share();
}
}
来源:https://stackoverflow.com/questions/37306671/resend-request-angular-2