web-dev-qa-db-ja.com

angular 2 http withCredentials

WithCredentialsを使用してCookieをサービスに送信しようとしていますが、実装方法がわかりません。ドキュメントには、「サーバーがユーザー資格情報を必要とする場合、リクエストヘッダーでそれらを有効にします」という例はありません。私はいくつかの異なる方法を試しましたが、それでも私のクッキーを送信しません。これが私のコードです。

private systemConnect(token) {
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('X-CSRF-Token', token.token);
    let options = new RequestOptions({ headers: headers });
    this.http.post(this.connectUrl, { withCredentials: true }, options).map(res => res.json())
    .subscribe(uid => {
        console.log(uid);
    });
}
angularangular2-servicesangular2-http
38
Lindstrom

このようにコードを変更してみてください

let options = new RequestOptions({ headers: headers, withCredentials: true });

そして

this.http.post(this.connectUrl, <stringified_data> , options)...

ご覧のとおり、2番目のパラメーターは送信するデータ（JSON.stringifyまたは''のみを使用）および1番目のパラメーターのすべてのオプションである必要があります。

51
Oleg Barinov

Angular 4.3以降、 HttpClientとインターセプターが導入されました。

簡単な例を以下に示します。

@Injectable()
export class WithCredentialsInterceptor implements HttpInterceptor {

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

        request = request.clone({
            withCredentials: true
        });

        return next.handle(request);
    }
}

constructor(
      private http: HttpClient) {

this.http.get<WeatherForecast[]>('api/SampleData/WeatherForecasts')
    .subscribe(result => {
        this.forecasts = result;
    },
    error => {
        console.error(error);
    });
10
Alexei

Interceptorを作成することは、アプリケーション全体にわたってヘッダーにデータを挿入することをお勧めします。一方、リクエストレベルごとに実行する必要がある迅速なソリューションを探している場合は、以下のようにwithCredentialsをtrueに設定してみてください

const requestOptions = {
 headers: new HttpHeaders({
  'Authorization': "my-request-token"
 }),
 withCredentials: true
};
4
James Poulose