Angular2 CORSの問題ではなく、http.get（url）が有効なURLで404を返しています

Question

私のDjangoサーバーを呼び出そうとしているAngular2 Appがあります。

私は、外部API呼び出しを行い、オブジェクトのリストを返さなければならないgetObjectsという関数を持っています。私は現在、私のサーバーからデータを正しく取得するXMLHttpRequestを作成しています。

しかし、私がHttp.http.get（url）を使ってリクエストをしようとするたびに、404エラーが表示されます。私はいくつかのHTTPヘッダーを試してみるだけでなく、サーバー上のいくつかの設定で遊んでみましたが、何が間違っているのか分かりません。

私は、Http.http.get（）メソッドが私が気付いていない場面の中で何かをファンキーにしていると仮定します。奇妙なことは、私のブラウザのdev-networkタブには外部のブラウザにアクセスしようとする試みが表示されないことです。

この問題のお手伝いがあれば、私は追加のデバッグ情報を提供することができ、実際に正しい方向にポイントを使用することができます。

ng --version 
angular-cli: 1.0.0-beta.24 
node: 6.9.1 
os: win32 x64 
@angular/common: 2.4.3 
@angular/compiler: 2.4.3 
@angular/core: 2.4.3 
@angular/forms: 2.4.3 
@angular/http: 2.4.3 
@angular/platform-browser: 2.4.3 
@angular/platform-browser-dynamic: 2.4.3 
@angular/router: 3.4.3 
@angular/compiler-cli: 2.4.3 

import { Injectable } from '@angular/core'; 
import { Headers, Http } from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 

... 
    constructor(private http: Http) { } 

    getObjects(): Promise<Object[]> { 
    function httpGet(theUrl) 
    { 
     var xmlHttp = new XMLHttpRequest(); 
     xmlHttp.open("GET", theUrl, false); // false for synchronous request 
     xmlHttp.send(null); 
     return xmlHttp.responseText; 
    } 

    var x = httpGet(this.myUrl); 
    console.log(x); // This works perfectly and I see an entry on my server log 

    this.http.get(this.myUrl) 
    .subscribe(res => console.log(res));// This throws a 404 and I see no entry on my server logs nor in my browser network tab 

    var headers = new Headers({'content-type': 'application/json'}); 

    this.http.get(this.myUrl, {headers: headers}) 
    .subscribe(res => console.log(res));// This throws a 404 and I see no entry on my server logs nor in my browser network tab 

    return this.http.get(this.myUrl) 
     .toPromise() 
     .then(response => response.json().data as Object[]) 
     .catch(this.handleError); //The original code that worked on an internal in-memory-api 
    } 

Answer 1

を私は別のスタックオーバーフローの質問に作業修正を見つけることができた：

Angular 2 HTTP GET returning URL null

問題がでましたInMemoryWebApiModuleと解決策は、私のapp.module.tsファイルに次の設定変更を加えることでした：

- InMemoryWebApiModule.forRoot(InMemoryDataService), 
+ InMemoryWebApiModule.forRoot(InMemoryDataService, {passThruUnknownUrl: true}), 

この小さな設定を変更すると、アプリケーションが機能しなくなりました。

Answer 2

あなたのリクエストを実行していないため、実際には404はありません。それらを実行するにはsubscribe()が必要です。いくつかの例：

this.http.get(this.myUrl).subscribe(res => console.log(res)); 
this.http.get(this.myUrl).subscribe(); 
let response: Observable<Response> = this.http.get(this.myUrl); 
response.subscribe(); 
response.subscribe(v => console.log(v); 

あなたがここで観測について読むことができます。 http://reactivex.io/rxjs/manual/index.html

Answer 3

これは、angular2-in-memory-web-apiの問題です。私も同じ問題がありましたが、AppModuleからInMemoryWebApiModuleを削除すると、API呼び出しが完全に機能しました。