0

I am trying to retrieve a service which is running on another port.I am getting an error as follows

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

my service.ts file is as follows

getDeviceInfo(){
   let headers = new Headers();
    headers.append('Access-Control-Allow-Origin', 'http://localhost:3000',);
    headers.append('Access-Control-Allow-Headers','Authorization')
    let options = new RequestOptions({
      method: RequestMethod.Get,
      url: DEVICE_URL,
      headers: headers
    });
    return  this.http.request(new Request(options))
      .map((res: Response) => res.json());
  }

thanks in advance

sravanthi
  • 175
  • 1
  • 1
  • 14
  • 3
    Those headers should be set in server side not client app.. https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS – Suraj Rao May 03 '17 at 10:55
  • is there any alternative to set them at the client side? – sravanthi May 03 '17 at 10:57
  • nope.. you should set your server side CORS – Suraj Rao May 03 '17 at 10:58
  • For development purpose you can disable CORS in crome browser. But please make sure this is for development purpose and permanent solution is to set CORS at server side. Please refer the below link http://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome – Buddhabhushan Kamble May 03 '17 at 11:01

2 Answers2

1

As per browser policy CORS is not allowed. Howerver if you are using chrome extension POSTMAN or app such as INSOMINA cors error wont occur.

How to pass cors error?

CORS error should only pass by server side.

Consider if your are using express as your server side. Then add following middleware in you app route.

  app.use(function(req,res){
 res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Header' , 'authorization');
  });
thangavel .R
  • 458
  • 4
  • 13
0

You simply can't. Try Oauth to get information/data from other websites.

Vandolph Reyes
  • 603
  • 6
  • 16
  • What do you mean by _You simply can't_ and how is this related to OAuth? This is just CORS issue which could be solved by setting required headers in the response headers – Developer May 03 '17 at 11:00