1

I am consuming a web service which is hosted in our on premise Development environment.

I am able to get data if I directly hit the url from browse but at the same time if I consume the same data from my Angular 4 app.

It is giving me an error 

Response for preflight has invalid http status code 401?

even if I added CORS plugin in my browser.

my headers are as follows.

headers: new HttpHeaders(
{
'Content-Type': 'application/json',
'Authorization' : 'Basic '+ btoa('username:password'),
'Accept' : 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8'
}
)

As I am getting data from browser I copied all the headers from browsers dev console network tab and pasted it to my Angular App request header.

Please help.

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
Abhi
  • 433
  • 2
  • 7
  • 17
  • 2
    You need to ensure the OPTIONS request doesn't need authentication on the server. – Günter Zöchbauer Jan 03 '18 at 07:18
  • 1
    See https://stackoverflow.com/questions/45533002/basic-authentication-with-header-javascript-xmlhttprequest/45533146#45533146. Your browser doesn’t include the Authorization request header in the preflight OPTIONS request. You can’t fix that problem by adding additional headers to the OPTIONS response. Instead as @GünterZöchbauer indicates, the server must be configured to accept OPTIONS request without looking for the Authorization header. – sideshowbarker Jan 03 '18 at 07:23
  • @GünterZöchbauer means exactly what? Shall I get in touch with backend guy and ask him to put some response header.. – Abhi Jan 03 '18 at 07:23
  • The backend guy needs to change the server so that OPTIONS request don't check for authentication but are processed always without restriction. If they don't want to support CORS, they should communicate that in the headers. – Günter Zöchbauer Jan 03 '18 at 07:25
  • the preflight requests are something which is placed when talking to cross-domain, in your case, you have a different back-end server. Copying the headers from the network tab, would not help as, the preflight is initiated on top of your request. Your best bet is to Include CORS from Backend. If there is alredy a support for it, make sure that 'Access-Control-Allow-Methods' has 'OPTIONS' included in it. for more clarification https://stackoverflow.com/questions/35553500/xmlhttprequest-cannot-load-https-www-website-com# – Rahul Jan 03 '18 at 08:20

1 Answers1

0

This error shows that Cross Origin requests are not allowed on the server end.

I would suggest you to enable cross origin requests on to your server side code.

Vikramjeet
  • 215
  • 6
  • 16