2017-09-12 27 views
1

TypeScript言語(フロントエンド側)とAWSとAPIゲートウェイ(バックエンド側)を使用して、角度4のWebアプリケーションを開発しています。 私は問題があります:APIゲートウェイは、完全に動作するデータ更新PUT要求で構成されています。 私は自分のアプリケーションでこのコードを使用する場合(ただし、私は(正しく書き込まれているように見える)、このメソッドを呼び出すと角度とAPIゲートウェイ:PUTメソッドを実装する方法は?

putObject(myObject: MyObject) { 
    if (this.authService.getAuthToken()) { 
    let cognitoToken = this.authService.getAuthToken(); 
    let headers = new Headers({'Content-Type': 'application/json'}); 
    headers.append('Authorization', cognitoToken); //JWT token 
    let url = correctUrl; 

    return this.http.put(url, JSON.stringify(myObject) , 
      {headers}) 
     .map(data => data.json()) 
     .catch(this.handleError); 
    } else { 
     let errMsg = 'Error retrieving Authrization token from Cognito 
         user session'; 
     console.error('error message: ' + errMsg); 
     return Observable.throw(errMsg); 
    } 
    } 

、PUT要求は実行されません(correctUrlは、正しいURLを参照する文字列です) JSONオブジェクトが完全に一致しています)、 コンソールに表示されます:Method PUT is not allowed by Access-Control-Allow-Methods in preflight response. 「CORSを有効にする」に進むと、PUT、GET、OPTIONSの3つのメソッドにチェックボックスがあります。 同じ方法でGETリクエストを呼び出すと、すべてが完全に機能しますが、PUTで​​同じことは起こりませんので、説明しません。

+0

あなたはdevモードでアプリケーションを実行しますか?私はそれを構築し、それをサーバーに置くと、もう* cors *を有効にする必要はありません。 – Swoox

+0

この "devモード"を有効にするには?とにかく、私はPUTで同じように起こっていないので、すべてが完全に動作する同じ方法で取得を呼び出す、私は説明していない! – claudioz

+0

POSTで同じ事例で投稿することはできますか? preflightは主にOPTIONSが最初に送信されるヘッダーです。 – Swoox

答えて

0

これは一般的なCORSの問題です。 (あなたのPUTメソッドのリソースのための) ゴーAPIへのゲートウェイ]> [オプション]> [ヘッダーのマッピング>

  • アクセス制御 - 許可 - ヘッダ「Content-Typeの、X-AMZ-日、認可、X-API X-XSRF-TOKEN、アクセス制御 - 許可ヘッダー、アクセス制御 - 許可 - 発信元 '
  • アクセス制御許可メソッド' DELETE、GET、 HEAD、OPTIONS、PATCH、POST、PUT '
  • アクセス制御が許可された発信元' * '

詳細が必要な場合はお知らせください。

関連する問題