Angular 2とHttpオブジェクトを使用してWebページを取得します

Question

Angular 2フレームワークで新しく、HTTPオブジェクトを理解しようとしています。ここではチュートリアル以下 イム：

http://www.joshmorony.com/using-http-to-fetch-remote-data-from-a-server-in-ionic-2/

この種のデータを提供しますが、私は変数に含まれているHTMLを取得したいサーバーからJSONファイルを取得するために、その完璧。私は、すべてのhtmlファイルを持って、いくつかの情報を得るためにそれを解析したいと思います。

私はこのようなウェブサイトでの例のURLを変更します。

this.http.request('https://www.google.ca/').map(res => res.text()).subscribe(data => { 
    this.webPage = data.toString(); 
    console.log("data:" + data); 
}); 

私はこのエラーを得た：

EXCEPTION: Response with status: 0 for URL: null

は、私は良いAPIを使用していますか？ 何が間違っていますか？

おかげで、 パット

Answer 1

これはCORS問題です。
フルエラーがある：

XMLHttpRequest cannot load https://www.google.ca/. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'https://run.plnkr.co' is therefore not allowed access. 
EXCEPTION: Response with status: 0 for URL: null 

ので、あなたが「https://www.google.ca/」を要求することはできません：1）あなたはアプリでHTTPリクエストを作るとき、原点はすでにあなたのホストとして定義され、「localhost」のか、自分のできることサイトのホスト。 2） 'www.google.ca'はもう1つの起源で、「アクセス制御許可元」が設定されていないか、サイトのホストが「アクセス制御許可元」リストにありません。

「www.google.ca」のhtmlが必要な場合は、プロキシサーバーが必要です。手順は次のとおりです。1）ng2アプリケーションで、プロキシサーバーにリクエストを送信し、それを依頼します。 2）プロキシサーバーのリクエスト 'www.google.ca'とあなたのng2アプリにhtmlを送信します。

プロキシサーバーが「www.google.ca」をリクエストすると、オリジンは「www.google.ca」と定義されます。したがって、プロキシサーバーはhtmlを取得できます。