linkedin - Angular 2: EXCEPTION: Response with status: 0 for URL: null

Question

I am trying to send a HTTP GET request from my Angular2/ionic2 app using http.get. The HTTP GET request contains a valid Linkedin access token and is supposed to return some profiledata. However, the following error occurs when getProfileData() is called:

3     229881   group    EXCEPTION: Response with status: 0  for URL: null
4     229895   error    EXCEPTION: Response with status: 0  for URL: null
5     229909   groupEnd
6     229950   error    Uncaught Response with status: 0  for URL: null, http://192.168.178.49:8100/build/js/app.bundle.js, Line: 95774

Still:

• The GET request with the same URL works when tested on www.hurl.it
• The GET request called from the app works with a different URL, e.g. let URL = "https://httpbin.org/get?name=hannes"

onboarding-load.ts:

import { Component } from '@angular/core';
import { NavController, Platform, Alert } from 'ionic-angular';
import { OnboardingHelloPage } from '../onboarding-hello/onboarding-hello';
import { CordovaOauth, LinkedIn } from 'ng2-cordova-oauth/core';    
import { Http, Headers, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map'


@Component({
  templateUrl: 'build/pages/onboarding-load/onboarding-load.html',
})
export class OnboardingLoadPage {
  private data;
  private code;

constructor(private navCtrl: NavController, private platform: Platform, private http: Http) {
    this.http = http;
    this.navCtrl = navCtrl;
  }

public getProfileData() {
  let URL = "https://api.linkedin.com/v1/people/~?oauth2_access_token=SOMEVALIDTOKEN&format=json";
  //let URL = "https://httpbin.org/get?name=hannes"

  this.http.get(URL)
    .map(res => res.json())
    .subscribe(data => {
      this.data = data;
      console.log(JSON.stringify(data));
  });
  // go to next page
  this.viewOnboardingHello();
}
...
}

Answer 1

It's probably a CORS issue.
Your Angular2 APP is hosted on another server than the API you're calling.

If you want to bypass this (only for test purposes), install this Chrome extension and add

Access-Control-Allow-Origin:

to your headers.
For real usage you should call the API from your server(Node, PHP, Python ...) (where the angular2 APP is hosted) and pass data to your angular2 APP.