Ionic2 添加自定义http头时未保存Angular2 httponly cookie

我在实现和处理Angular2应用程序和Java后端API之间的CORS问题上走到了死胡同

我知道并知道什么是CORS请求，已经在angular1应用程序中实现，但我无法在Angular2（Ionic2）应用程序中实现

ionic 2应用程序应该使用现有的API web服务，该服务已经启用了发出CORS请求的所有功能，并且身份验证仅使用Http cookie完成。。。已经在Angular 1中实现

出于某种原因，当我们在请求中设置头时，Angular2将“withCredentials”标志设置为false或根本不发送，请求发送到api，但cookie不会返回。。。我们不能进行经过身份验证的API调用。 我尝试了很多方法将http头和“withCredentials”标志一起发送，但在Angular2中似乎没有任何效果，而在Angular1中效果很好。我们发送的所有头都是服务器允许的，它们在响应中的“访问控制允许头”中返回

有趣的是，如果我尝试发送仅带有“withCredentials”标志的请求，则请求是send ok，并且浏览器正确设置了cookie

我试过以下几件事：

创建自定义http类，如下所述：

扩展like BrowserXhr类并将“withCredentials”设置为true，如下所述：

直接在RequestOptions中设置，如下所示：

扩展BaseRequestOptions（RequestOptions），如下所示：

示例代码：

import { Injectable } from '@angular/core';
import { Headers, RequestOptions } from '@angular/http';

@Injectable()
export class DefaultRequestOptions extends RequestOptions {

    withCredentials:boolean = true;

    // headers:Headers = new Headers({
    //     'Accept': 'application/json, text/plain, */*',
    //     'Authorization': 'sometoken',
    // });

    constructor() {
        super();
        if(!this.headers){
            this.headers = new Headers();
        }

         this.headers = new Headers();
         this.headers.append('Accept','application/json');
         this.headers.append('CustomHeader',"someTokenGoesHere");

        this.withCredentials = true;
    }
}

本单元后面部分：

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    IonicModule.forRoot(MyApp,{tabsHideOnSubPages:true})
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    { provide: RequestOptions, useClass: DefaultRequestOptions } 
  ]
})

我也试过这样做：

let headers = new Headers();
headers.append("Accept",'application/json');
headers.append("CustomHeader",'someTokenGoesHere');

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

this.http.get('apiurl',options).subscribe((res)=>{ console.log(res)})

如果有人成功地组合了http头和withCredentials标志，请分享您的经验

更新：

---

我没有找到这个问题的解决方案，所以我们决定删除一些安全头并对请求进行ip地址过滤。通过这种方式，我们不需要发送任何额外的http头并继续使用httponly cookies。

您可以在http请求的options对象中添加头

let headers: Headers = new Headers({
  'Content-Type': 'application/x-www-form-urlencoded'
});
let options = {
  method: RequestMethod.Post,
  headers: headers,
  responseType: ResponseContentType.Blob,
  withCredentials: true
};

return this.http
  .post(API + `/user/${id}`, {}, options)
  .map((r: Response) => {

  });

---

谢谢回复。我也尝试了你的解决方案，但我得到了与我以前尝试相同的行为。现在发送了标题，但cookie不是保存/设置的，而是浏览器。例如，登录后，我看到服务器返回httponly cookie（Set cookie头），但cookie不会保存，也不会在下一个请求中转发。每次手动设置任何请求头时都会发生同样的情况。很难模拟或创建plunker或codepen，因为您需要的服务器只能使用httponly cookies。