EXCEPTION: Response with status: 0 for URL: null in angular2

Question

I'm getting following exception, when I'm trying to connect to remote API using anguar2 http. Also my web server is receiving request and responding properly.

I'm able to make a successful curl request to the local server.

EXCEPTION: Response with status: 0 for URL: null

service.ts

getAllProducts(): Observable<string> {
      return this.http.get(this.productUrl)
      .map(this.extractData)
}

private extractData(res: Response) {
    let body = res.json();
    console.log(body)
    return body.data || { };
}

Answer 1

Hope this will helps someone.

The problem was with resource definition. When I'm trying to connect to remote resource using angular2 http.get, I was getting following error

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at …

FIX:

As I'm using flask-restful to build remote API, below fix solved my problem

from flask_restful.utils import cors
from flask_restful import Api

api = Api(app, decorators=[cors.crossdomain(origin='*')])

Complete source code will be available here : inventory-manager