Angular 2不会使用CORS保存我的身份验证Cookie [英] Angular 2 doesn't save my Authentication Cookie with CORS

问题描述

我有一个angular 2应用程序，该应用程序应该向Node Express后端进行身份验证，在该应用程序中它将向后端发送登录请求并接收cookie.它应该在每个连续的请求中发送此cookie(不是).

I have an angular 2 app which should authenticate to a Node Express backend where it sends an login request to the backend and receives a cookie. It should send this cookie with every consecutive request (which it does not).

我在我的角度应用程序中有一个

I have in my angular app:

类 LoginService

private requestOptions = new RequestOptions({headers: this.headers, withCredentials: true});`


    login(username: string, password: string): Promise<boolean> {
     return this.http.post(this.myUrl + "login",
     JSON.stringify({username:username, password: password}), this.requestOptions)
      .toPromise()
      .then(res => true)
      .catch(this.handleError);
  }

一些 DataService

private requestOptions =  new RequestOptions({headers: this.headers, withCredentials: true})

getData(): Promise<any> {
        return this.http.get(this.myUrl, this.requestOptions)
        .toPromise()
        .then (res => res.json())
        .catch(this.handleError)
    }

在我的节点后端上，我有:

On my node backend, I have:

response.header('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE, OPTIONS');
response.header("Access-Control-Allow-Origin", http://localhost:4200);
response.header('Access-Control-Allow-Credentials', true);
response.header('Access-Control-Allow-Headers', 'Origin, Content-Type, Accept');

当我以角度发送登录请求时，我可以看到它在服务器端被接受，但是当我发送连续请求时，它给了我401未授权，如果您未通过身份验证，则会发送该错误.

When I send the login request in angular, I can see that it got accepted on the server side, but when i send a consecutive request, it gives me 401 Not authorized, which is the error I send if your not authenticated.

但是，当我通过HttpRequester(用于HTTP请求的Firefox插件)发送登录请求时，我可以访问我的角度应用程序中的所有数据.

However, when i send the login request via HttpRequester (Firefox Plugin for HTTP Requests), i can access all the data in my angular app.

我的棱角版本是2.4.10

My angular version is 2.4.10

+++更新+++

因此，我进行了一些测试，发现只要使用相同的服务，我的身份验证就可以正常工作.

So, i made some tests and I found out, that my authentication works fine, as long as I use the same service.

我有一个名为 login.service.ts 的服务和一个名为 data.service.ts 的服务.

I have a service called login.service.ts and a service called data.service.ts.

我可以做什么: 通过 login.service.ts 登录，并通过 login.service.ts 获取数据.

What I can do: Login via login.service.ts and fetch the data via login.service.ts.

我不能做什么: 通过 login.service.ts 登录并继续使用 data.service.ts .

What I can't do: Login via login.service.ts and continue to use data.service.ts.

对于我的用例来说，这不是很实际. 有人对此有任何想法吗?

This is not very practical for my use case. Does someone have any ideas on this?

推荐答案

默认情况下，angular不发送cookie.尝试将{ withCredentials: true }传递给您的RequestOptions:

By default angular is not sending cookies. Try pass { withCredentials: true } to your RequestOptions:

let options = new RequestOptions({ headers: headers, withCredentials: true });
this.http.post(this.connectUrl, <stringified_data> , options);

这篇关于Angular 2不会使用CORS保存我的身份验证Cookie的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！