0

I'm using angular 6, httpClient, trying to login, no token required, just a username and a password, can't modify the server.

login.ts

  onLogin() {
    this.authService.login(this.email, this.password).subscribe(data => {
      console.log(data);
    });
  }

auth service

  login(username, password) {
    const data = {
      username: username,
      password: password
    };

    const headers = new HttpHeaders();
    headers.set('Content-Type', 'application/json');
    return this.http.post(this.login_url, data, { headers: headers });
  }

There are plenty of questions like this one but those were for angularjs and I'm using angular 6, some answers gave articles to read with no practical coding answer, and some says to change the header, but as far as I can tell from my postman tests, the server only accepts 'Content-Type', 'application/json' And it's working perfectly on postman. When I do it in angular, my post request, becomes options.

Some even say that to avoid CORS, you should setup an interceptor, but that's for when you have a token, no? you save it in localStorage and then you use it, I don't have a token. The server X-Session in the header.

Some say, to create a proxy, package.json,

`"start": "ng serve --proxy-config proxyconfig.json",`

proxyconfig.json

{
    "/api": {
        "target": "example.com",
        "secure": false,
        "changeOrigin": true
    }
}

And the login_url in auth service would point to the rest endpoint without /example/api. I also tried that, it's not working either.

Some says, you have to edit the webserver, to add Access-Control-Allow-Origin, I'd like not to do that, if possible. If not, I'll contact my company and ask them to do it. I'd like a solution using angular 6.

Lynob
  • 5,059
  • 15
  • 64
  • 114
  • one possible reason could be if your clientside URL (login page )and server-side URL are not same domain then, the browser sends one `option` request every time to the back-end to check if the request is allowed, once the option is passed then it sends the post request. – anand Aug 03 '18 at 18:25
  • @anand how? by using an interceptor? could you give an example? – Lynob Aug 03 '18 at 18:31
  • is your api is on node? – Sajeetharan Aug 03 '18 at 18:34
  • @Sajeetharan no, php5, apache server, laravel, centos running on firebase, I don't control the remote server, it belongs to my company, so can't make changes to the server or api – Lynob Aug 03 '18 at 18:36
  • it could be a change that needs to be done on the remote api, you just need to use postman and see if the request is working – Sajeetharan Aug 03 '18 at 18:37
  • @Sajeetharan everything is working on postman but in the browser i see `Cross - Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://example.com. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).` – Lynob Aug 03 '18 at 18:40
  • could you try run your application in incognito mode – Sajeetharan Aug 03 '18 at 18:41
  • @Sajeetharan just tried, same error, I guess I need to contact them – Lynob Aug 03 '18 at 18:44

0 Answers0