angular2 withCredentials = true fails on safari and IE

Question

I am trying to authenticate using a webservice and make subequent api calls.

export class HomeComponent {
  newName: string;

  headers = {
    headers: new Headers({
      'Content-Type': 'application/json',
      'Accept': 'application/json'
    })
  };
  constructor(public http: Http, public nameListService: NameListService) {
    let _build = (<any>http)._backend._browserXHR.build;
    (<any>http)._backend._browserXHR.build = () => {
      let _xhr = _build();
      _xhr.withCredentials = true;
      return _xhr;
    };
  }
  login(path, data) {
    var creds = { 'Email': '[email protected]', 'Password': 'pass', 'RememberMe': true };
    this.http.post('http://xx.net/api/Users/Login', JSON.stringify(creds), this.headers)
      .subscribe(res => {
      console.log(res);
      });
  }
  getdata() {
    this.http.get('http://xx.net/api/Users/LoggedInUser', this.headers)
      .subscribe(res => {
      console.log(res);
      }, (er) => {
        console.log(er);
      });
  }
}

in the constructor i am setting _xhr.credentails to true. Everything works great in chrome, But fails in IE and Safari. When i try to login(in all browser), i can see the response header with "Set-Cookie", But safari and IE does not seems to send this cookie with subsequent requests so i get 401. Chrome does this correctly.

is this a bug with the framework.

Answer 1

Might be a dup of Issue in this.withCredentials attribute in Cross Origin Resource Sharing

Steps for allowing 3rd party cookies:

IE 10 - Internet Options > Privacy > Advanced > Third Party Cookies > Accept

Safari - Preferences > Privacy > Block Cookies > Never