Angular2的Http覆蓋注入路由器

在我們與舊的組件路由器Angular2 RC4應用程序，我們已經覆蓋了默認的HTTP類趕上HTTP 401名未認證的請求，並將其重定向到登錄頁面。這個重定向發生在Angular路由器上。Angular2的Http覆蓋注入路由器

我們要更新到2.0.1版本，現在使用新的路由器。爲此，我們還必須將新路由器注入到自定義的Http覆蓋類中。編譯成功，但Angular不會運行，因爲當應用程序啓動時，它會嘗試在第一個組件加載之前創建自定義http類。在加載第一個組件之前，不再可能注入新的路由器。

是什麼在這裏，最好的方法？我們是否應該在實例化Http覆蓋類後手動注入路由器？這怎麼能做到？

下面是我們自定義HTTP類，在RC4與舊的路由器工作的代碼。更新到最終版本時，問題出在catchUnauthorized，因爲路由器不能再注入到這個類中。

import {Injectable} from "@angular/core"; 
import {Http, Headers, ConnectionBackend, RequestOptions, RequestOptionsArgs, Response, Request} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import {Router} from '@angular/router-deprecated'; 

@Injectable() 
export class CustomHttp extends Http { 
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions, private router: Router) { 
    super(backend, defaultOptions); 
} 

postJson(url: string, object: any, options: RequestOptionsArgs = {}): Observable<Response> { 
    var body = JSON.stringify(object); 

    if(!options.headers) 
    { 
     options.headers = new Headers(); 
    } 

    options.headers.set("Content-Type", "application/json"); 

    return this.post(url, body, options); 
} 

request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> { 
    return super.request(url, options) 
     .catch(this.catchUnauthorized); 
} 

get(url: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.get(url, options) 
     .catch(this.catchUnauthorized); 
} 

post(url: string, body: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.post(url, body, options) 
     .catch(this.catchUnauthorized); 
} 

put(url: string, body: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.put(url, body, options) 
     .catch(this.catchUnauthorized); 
} 

delete(url: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.delete(url, options) 
     .catch(this.catchUnauthorized); 
} 

patch(url: string, body: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.patch(url, body, options) 
     .catch(this.catchUnauthorized); 
} 

head(url: string, options?: RequestOptionsArgs): Observable<Response> { 
    return super.head(url, options) 
     .catch(this.catchUnauthorized); 
} 

public catchUnauthorized = (error: Response) => { 
    if (error.status === 401 || error.status === 440) { 
     var currentInstruction = this.router.currentInstruction; 
     var instruction = this.router.generate(["/Login", { "session": "true", "returnUrl": currentInstruction.toLinkUrl() }]); 

     if (currentInstruction.urlPath != instruction.urlPath) 
      this.router.navigateByInstruction(instruction); 

     return Observable.throw('Sessie verlopen!'); 
    } 
    if (error.status === 403) { 
     this.router.navigate(['/Error', { 'error': 'forbidden' }]); 
     return Observable.throw('Forbidden!'); 
    } 
    return Observable.throw(error); 
}; 
}

來源

2016-09-28 Willem Burgers

@角/路由器deprecated'。你應該使用'@ angular/router'中的那個' –

正如我在問題中所說的那樣，這就是它在我們的RC4版本中的樣子。要遷移到最終版本，舊的@ angular/router-deprecated將被刪除，並使用新的@ angular/router。但我無法弄清楚如何此類遷移到新的路由器，因爲這個類有在整個應用程序來提供，它需要一個路由器。但是在任何組件加載之前，新路由器不能被注入。 –

我有同樣的問題。嘗試添加「路由器」到「DEPS」：

... 
providers: [ 
{ 
    provide: CustomHttp, 
    useFactory: (backend: XHRBackend, options: RequestOptions, route: Router) => { 
    return new CustomHttp(backend, options, route); 
    }, 
    deps: [ XHRBackend, RequestOptions, Router ] 
} 
...

來源

2016-12-16 13:45:36 Andrew

如果你想使用自定義的類，但everywhhere有來自進口「@角/ HTTP」，供應商必須從「提供HTTP類@角/ HTTP 」，

import {Http} from '@angular/http'; 
import {CustomHttp} from 'my/custom/location'; 

function httpFactory(backend, options){ 
    return new CustomHttp(backend, options); 
} 

{ 
    provide: Http, 
    useFactory: httpFactory, 
    deps: [XHRBackend, RequestOptions] 
}

你甚至可以在你爲什麼要使用路由器從`把httpFactory方法相同的文件，如CustomHttp類

來源

2017-10-12 13:03:54 Vayrex

Angular2的Http覆蓋注入路由器

回答

相關問題