我使用的是angular 2(不是最新的,通过angular-cli: 1.0.0-beta.11-webpack.9-4使用),我必须为每个http请求设置withCredentials为true。我尝试使用
为一个请求设置它http.get('http://my.domain.com/request', {withCredentials: true})
和一切都很好,但我试图使用一些东西在bootstrap如下,但没有得到任何成功
import './polyfills.ts';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
import { AppModule } from './app/';
import {Http, Headers, BaseRequestOptions, RequestOptions, BrowserXhr} from '@angular/http';
if (environment.production) {
enableProdMode();
}
export class MyRequestOptions extends BaseRequestOptions {
constructor () {
super();
this.headers.append('withCredentials','true');
}
}
platformBrowserDynamic().bootstrapModule(AppModule,
[{ provide: RequestOptions, useClass: MyRequestOptions}]
);
我不知道它是否需要了,但我有同样的问题,我已经用这种方式解决了:
-
创建BaseRequestOptions的子类(扩展了RequestOptions):
import { Headers, BaseRequestOptions } from "@angular/http"; export class AuthRequestOptions extends BaseRequestOptions { constructor() { super(); this.withCredentials = true; } }
-
在应用程序引导中注册
import { RequestOptions } from '@angular/http'; import { AuthRequestOptions } from './<path>/AuthRequestOptions'; @NgModule({ bootstrap: [...], imports: [...], providers: [ { provide: RequestOptions, useClass: AuthRequestOptions}, ... ] }...
(在我的例子中,这是与CORS+NTLMAuthentication一起工作的)
如Sierrodc
所示,Angular 4.3+允许使用拦截器来配置这个。下面显示了一个使用NTLMAuthentication的完整示例:
拦截器
@Injectable()
export class WithCredentialsInterceptor implements HttpInterceptor {
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
request = request.clone({
withCredentials: true
});
return next.handle(request);
}
}
模块配置(拦截器允许与其他拦截器堆叠):
@NgModule({
imports: [CommonModule, BasicRoutingModule, HttpClientModule],
declarations: [HomeComponent, CounterComponent, FetchDataComponent],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: WithCredentialsInterceptor,
multi: true
},
{
provide: HTTP_INTERCEPTORS,
useClass: BaseUrlInterceptor,
multi: true
}
]
})
export class BasicModule { }
实际使用
constructor(
private http: HttpClient) {
this.http.get<WeatherForecast[]>('api/SampleData/WeatherForecasts')
.subscribe(result => {
this.forecasts = result;
},
error => {
console.error(error);
});
}