विवरण
सबसे अच्छा समाधान मैंने पाया है XHRBackendकि इस तरह से ओवरराइड करने के लिए HTTP प्रतिक्रिया की स्थिति 401और 403एक विशेष कार्रवाई की ओर जाता है।
यदि आप अपने कोणीय अनुप्रयोग के बाहर अपने प्रमाणीकरण को संभालते हैं, तो आप वर्तमान पृष्ठ को ताज़ा करने के लिए बाध्य कर सकते हैं जैसे कि आपका बाहरी तंत्र चालू हो। मैं नीचे दिए गए कार्यान्वयन में इस समाधान का विवरण देता हूं।
आप अपने एप्लिकेशन के अंदर एक घटक को भी अग्रेषित कर सकते हैं जैसे कि आपका कोणीय अनुप्रयोग पुनः लोड नहीं किया जाता है।
कार्यान्वयन
कोणीय> 2.3.0
@Mrgoos के लिए धन्यवाद, यहाँ कोणीय 2.3.0+ में बग फिक्स के कारण सरलीकृत घोल 2.3.0+ है (देखें मुद्दा https://github.com/angular/angular/issues/11606 ) सीधे Httpमॉड्यूल का विस्तार ।
import { Injectable } from '@angular/core';
import { Request, XHRBackend, RequestOptions, Response, Http, RequestOptionsArgs, Headers } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
@Injectable()
export class AuthenticatedHttpService extends Http {
constructor(backend: XHRBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
return super.request(url, options).catch((error: Response) => {
if ((error.status === 401 || error.status === 403) && (window.location.href.match(/\?/g) || []).length < 2) {
console.log('The authentication session expires or the user is not authorised. Force refresh of the current page.');
window.location.href = window.location.href + '?' + new Date().getMilliseconds();
}
return Observable.throw(error);
});
}
}
मॉड्यूल फ़ाइल में अब केवल निम्न प्रदाता हैं।
providers: [
{ provide: Http, useClass: AuthenticatedHttpService }
]
राउटर और एक बाहरी प्रमाणीकरण सेवा का उपयोग करते हुए एक अन्य समाधान @ grgoos द्वारा निम्नलिखित gist में विस्तृत है ।
कोणीय पूर्व 2.3.0
निम्नलिखित कार्यान्वयन के लिए Angular 2.2.x FINALऔर काम करता है RxJS 5.0.0-beta.12।
यदि HTTP कोड 401 या 403 वापस आ जाता है, तो यह वर्तमान पृष्ठ पर पुनर्निर्देशित करता है (साथ ही एक अद्वितीय URL प्राप्त करने और कैशिंग से बचने के लिए एक पैरामीटर)।
import { Request, XHRBackend, BrowserXhr, ResponseOptions, XSRFStrategy, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
export class AuthenticationConnectionBackend extends XHRBackend {
constructor(_browserXhr: BrowserXhr, _baseResponseOptions: ResponseOptions, _xsrfStrategy: XSRFStrategy) {
super(_browserXhr, _baseResponseOptions, _xsrfStrategy);
}
createConnection(request: Request) {
let xhrConnection = super.createConnection(request);
xhrConnection.response = xhrConnection.response.catch((error: Response) => {
if ((error.status === 401 || error.status === 403) && (window.location.href.match(/\?/g) || []).length < 2) {
console.log('The authentication session expires or the user is not authorised. Force refresh of the current page.');
window.location.href = window.location.href + '?' + new Date().getMilliseconds();
}
return Observable.throw(error);
});
return xhrConnection;
}
}
निम्न मॉड्यूल फ़ाइल के साथ।
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HttpModule, XHRBackend } from '@angular/http';
import { AppComponent } from './app.component';
import { AuthenticationConnectionBackend } from './authenticated-connection.backend';
@NgModule({
bootstrap: [AppComponent],
declarations: [
AppComponent,
],
entryComponents: [AppComponent],
imports: [
BrowserModule,
CommonModule,
HttpModule,
],
providers: [
{ provide: XHRBackend, useClass: AuthenticationConnectionBackend },
],
})
export class AppModule {
}