2016-11-25 35 views
6

我从我的应用程序中获取来自第三方REST服务的结果。这些服务因 Request header field X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers in preflight response.而停止,因为angular2已将此标头设置为默认情况下所有请求的标准。Angular 2为单个服务或每个请求禁用XSRFStrategy

我已经想通了如何禁用此:

import { HttpModule, XSRFStrategy } from '@angular/http'; 

export class NoXSRFStrategy { 
    configureRequest(req: Request) { 
    // Remove `x-xsrf-token` from request headers 
    } 
} 
@NgModule({ 
    imports: [ 
    HttpModule 
    ], 
    declarations: [ ], 
    providers: [{ provide: XSRFStrategy, useFactory:() => new NoXSRFStrategy() }] // !!HACK!! 
}) 
export class AppModule { } 

但这部作品在模块级,这意味着无论哪个服务为他们提供了它禁用此为所有请求。

我想要的是为我自己决定哪个Http调用应该被剥离这样的头文件并且可以继续使用它们。使用上面的解决方案,我必须在单独的模块中隔离该服务,并且仅对该模块使用NoXSRFStrategy。我没有在其他模块中与其他服务一起测试过,但我希望这不会将NoXSRFStrategy设置为全局请求配置。

只是为了说明,我想什么是可能的:

@Injectable() 
export class MyService { 

    constructor(private http: Http) { } 
    apiCall() { 
    return this.http.get('some.online/service.json', {useXsrf: false}); // ...or something... IDK 
    } 

也许服务水平:

@Injectable() 
export class MyService { 

    constructor(private http: Http) { 
    this.http.setXsrfStrategy(NoXSRFStrategy); // For only this http instance... 
    } 

有谁知道是否有禁用X-XSRF-的任何方式TOKEN标题除了设置模块级别配置?

+0

在这里有相同的问题。你能解决它吗? – Sebastian

+0

我不想为我的整个应用程序在全局范围内设置它,并最终放置了一个小型NodeJS Express服务器来处理我的角应用程序和第三方服务器之间的对话。但是如果你不关心为你的应用程序所做的所有请求移除X-XSRF-TOKEN,上面的第一个代码块将为你解决问题。 –

回答

1

我想通了!

你可以用你自己的方法覆盖默认的Http类。这是我得到的最接近的Http拦截:

app.module.ts

@NgModule({ 
    declarations: [AppComponent], 
    imports: [HttpModule], 
    providers: [{ provide: Http, useClass: AuthHttp }], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

AuthHttp.ts

import {Injectable} from '@angular/core'; 
import {Http, Request, Response, RequestOptionsArgs, RequestOptions, XHRBackend} from '@angular/http'; 
import {Router} from '@angular/router'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/observable/throw'; 

@Injectable() 
export class AuthHttp extends Http { 
    constructor(backend: XHRBackend, defaultOptions: RequestOptions) { 
    super(backend, defaultOptions); 

    // Setup default http headers here 
    defaultOptions.headers.append('Cache-control', 'no-cache'); 
    defaultOptions.headers.append('Cache-control', 'no-store'); 
    defaultOptions.headers.append('Pragma', 'no-cache'); 
    defaultOptions.headers.append('Expires', '0'); 
    } 

    request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> { 
    // Before request execution. You can manipulate headers per request here. 

    return super.request(url, options) 
     .map(res => { // Successful Response 
     return res; 
     }) 
     .catch((err: any) => { // Unsuccessful Response. 
     return Observable.throw(err); 
     }); 
    } 
} 
-1

我就可以不再用它发送令牌。

document.cookie = "XSRF-TOKEN=; path=/" // <- add this 
this.http.get(url, options) 

只需清除名为“XSRF-TOKEN”的cookie即可。

而且我做了一个扩展的Http类,可以选择发送令牌或不发送。