0

I have written the user service as to get the user info using the api call.

user.service.ts

getBasicInfo(): Observable<any> {
            return this.http.get(this.config.apiUrl + 'api/supplier-basic-info/' + 'userID')
            .map(res => res.json());
        }

And in the component i have written the observable like this:

user.component.ts

getBasicInfo(){
    this._userService.getBasicInfo().subscribe(
      data => this.supplierInfo = data.results
    );
  }

And when i am trying to bind the data in the html component like this:

<div>{{getBasicInfo()}}</div>

Then i am getting the error in the console as:

Failed to load http://<SOME.IP.ADDRESS.>/api/supplier-basic-info/54: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 403.

Why i am not able to get the data in the HTML. Can anyone help me on this? As the back end developer is storing the details of user in the cookie. What else i need to do to get the data and bind it in the HTML page using Angular. As i am very new to this Angular4 component based programming.

Thanks.

youi
  • 1,887
  • 5
  • 20
  • 31

1 Answers1

1

This doesn't have anything to do with your frontend code. You can optimise this but that would be another story.

The problem is that CORS is not activated. Have a look at: CORS

You have to activate CORS in your server side configuration. Cause you didn't specify your technology, I cannot help you with exact links. Just google for "activate cors in [your server framework]" ;)

Ore
  • 972
  • 2
  • 12
  • 24
  • True, although u may need to config your header to match the enabled media types like json for example, otherwise you might get rejected by the server for unsupported media type. – Berlin_Bro Nov 03 '17 at 13:44
  • The backend is developed using drupal and they generate the drupal apis to consume in the application. – youi Nov 03 '17 at 13:44
  • @Berlin_Bro then the error would be different. – Ore Nov 03 '17 at 13:48