は、取得しようとした角度2

Question

イムでのREST APIのためのHTTPリクエストを取得することはできませんHTTP GET Magentoの中で作成されたのREST APIを使用して、角度2のフロントエンドでの要求2.

VAR \ \ WWW \ HTML \ Angular2サンプル-ngの\イムは、JSONレスポンスを取得することができ、図示したように私の試みは、JSONファイル（http://10.20.1.2:3000/data.json）を取得する場合-http-マスター\ウェブ\アプリの\はここ

///<reference path="../node_modules/angular2/typings/browser.d.ts" /> 
import "rxjs/add/operator/map"; 
import {Component, Input} from 'angular2/core'; 
import {Http} from 'angular2/http'; 

interface Person { 
    //name: string; 
    //age: number; 
} 

@Component({ 
    selector: 'my-app', 
    template: `<h1>My First Angular 2 App</h1> 
    <div>{{people | json}}</div> 
    ` 
}) 
export class AppComponent { 
    @Input() private people: Person[]; 

    constructor(private http: Http) { 
    } 

public ngOnInit() { 
    this.http.get('http://10.20.1.2:3000/data.json') 
     .map(response => { 
      console.log(response.json); 
      console.log(response.json()); 
      return response.json() 
     }) 
     .subscribe((items: Person[]) => { 
      console.log('items: ' + items); 
      this.people = items; 
     }, error => console.log(error)) 
} 
} 

をapp.component.ts。私は必要なもの

は、私がこのようにMagentoの2のAPIエンドポイントを渡す必要がある：

http://10.20.1.2/Magento2/index.php/rest/V1/customers/1

私はポストマンクライアントから呼び出す場合は、上記の残りのエンドポイントは完璧に動作します。

私が取得app.component.tsファイルに同じURL（http://10.20.1.2/Magento2/index.php/rest/V1/customers/1）を使用する場合：私は:(http://10.20.1.2:3000/Magento2/index.php/rest/V1/customers/1としてポート3000でURLを使用する場合は

）私が手：

応答{_body： "/Mage_ang2/index.php/rest/V1/customers/1↵を得ることができない"、状況：404、STATUSTEXT： "OK"、ヘッダ：ヘッダ、タイプ：2 ...

どちらが欠けていますか？

Answer 1

あなたはヘッダーを設定する必要があります。

アクセス制御 - 許可 - 原産地： 'your_angular_server_address'

と

アクセス制御が-ヘッダを許可：「アクセス - 制御 - 原点許可 '

CORS問題。

Answer 2

あなたはヘッダを追加する必要があります：あなたは、ヘッダーアクセス制御 - 許可 - 起源を

/** 
    * Interceptor set the headers for the request. 
    * Params: 
    * - objectToSetHeadersTo: Request or Arguments that will contain the headers. 
    **/ 
    private setHeaders(objectToSetHeadersTo: Request | RequestOptionsArgs) { 
    const headers = objectToSetHeadersTo.headers; 
    headers.set('Content-Type', 'application/json'); 
    if (this.token) { 
     headers.set('Authorization', 'Token ' + this.token); 
    } 
    }