実際に、私たちのバックエンドはリクエストヘッダーにCookieを使ってリクエストを認証します。私はヘッダー "Cookie"を設定するとそれが拒否されることを知っています。では、バックエンドにCookieを送信する方法はありますか?Angular2のすべてのリクエストのリクエストヘッダに「Cookie」を送信するにはどうすればよいですか?
19
A
答えて
38
私は、サーバーにあなたの認証を依頼する段階があると思います。これに続いて(認証が成功した場合)、サーバーは応答内のクッキーを返します。ブラウザはこのクッキーを保存し、各呼び出しごとに再度送信します。
クロスドメインリクエスト(CORS)の場合、ブラウザで要求にCookieを追加するには、XHRのwithCredentials
をtrue
に設定する必要があります。
Angular2でこれを可能にするために、我々は、以下のようにBrowserXhr
クラスを拡張する必要があります:
@Injectable()
export class CustomBrowserXhr extends BrowserXhr {
constructor() {}
build(): any {
let xhr = super.build();
xhr.withCredentials = true;
return <any>(xhr);
}
}
と拡張とBrowserXhr
プロバイダオーバーライドします。詳細については、この質問を参照してください
bootstrap(AppComponent, [
HTTP_PROVIDERS,
provide(BrowserXhr, { useClass: CustomBrowserXhr })
]);
を:
編集(以下freakerのコメント)
RC2から、以下に述べるように、あなたは要求構成内で直接withCredentials
プロパティを使用することができます。
this.http.get('http://...', { withCredentials: true })
編集([maxou]のコメントに続いて)
withCredentialsを含めることを忘れないでください。ごとにに真。
この機能は現在angular2に追加されました。 'http.get(url、{withCredentials:true})'のようなことを単に行うことができるようになりましたので、この便利な回避策はもう必要ありません(2.0.0-rc4以前)。 – freaker
はい、そうです。私はRC2で追加されました。それに応じて私の答えを更新しました。これを指摘してくれてありがとうございます;-) –
'withCredentials'を使うと、応答の' Set-Cookie'がクライアントによって設定されますが、依然としてクライアントは 'Cookie'をリクエスト(以前のリクエストで設定されたもの) – maxbellec