CORS ISSUE in Angular2

Question

私のアプリケーションにwebpack angular2スターターキット（https://github.com/AngularClass/angular2-webpack-starter）を使用しています。問題が発生しました。

は私が

getSomeData(): Observable<any> { 
    let url = here is my api URL; 
    let headers = new Headers({ 'Content-Type': 'application/json; charset=utf-8', "Access-Control-Allow-Origin": "*", 'dataType': 'json', }); 
    let options = new RequestOptions({ headers: headers }); 

    return this._http.get(url, options).map(res => res.json()); 
} 

を呼び出しますようにしようと、私は次のエラーを持っている

のXMLHttpRequestをロードすることはできません（私のURL）プリフライトリクエストへの応答は、アクセス制御チェックに合格しない：いいえ「のアクセスを-Control-Allow-Origin 'ヘッダーは、要求されたリソース上に存在します。 Origin 'http://localhost:3000'はアクセスできません。応答はHTTPステータスコード405でした。

このApi（Firebirdを使用しています）はデフォルトでXMLを返しますが、これは問題の原因になる可能性があります。

1. これはいつもJSONになったのですか？
2. CORSでこの問題を解決するにはどうすればよいですか？

Answer 1

この問題はサーバー側で発生しています。後者は、HTTP呼び出しの応答でAccess-Control-Allow-Originヘッダーを返す必要があります。

ほとんどの場合、これを行うためにサーバーアプリケーションに接続できるツールがあります。サーバーは、クライアントがOriginヘッダー（ブラウザによって自動的に追加された）を送信するときにCORSヘッダーを返す必要があることを知っています。

は、CORSの詳細についてはこちらの記事を参照してください。

• http://restlet.com/blog/2015/12/15/understanding-and-using-cors/