2017-10-08 11 views
1

私は、serverlessを使用してセットアップしたラムダ関数に、anglejsアプリケーションからhttpリクエストを実行しようとしています。ここでサーバレスAWSラムダCORSエラー

は私のserverless.yaml機能は

functions: 
    createcustomer: 
    handler: handler.createcustomer 
    events: 
     - http: post /createcustomer 
     cors: true 

である私はしかし、私はこれを取得しておく。この

app.factory('MyFactory', ['$http', function($http) { 
    return { 
     CreateCustomer: function(customer) {$http.post('<apipath>/createcustomer', {customer:customer})} 
    } 
}]); 

のようにそれを呼び出す私のAngularJSアプリから

module.exports.createcustomer = (event, context, callback) => { 

    let customer = JSON.parse(event.body).customer; 

    service.create(customer, function(result) { 
     let response = { 
      statusCode: 200, 
      headers: { 
       "Access-Control-Allow-Credentials": true, 
       "Access-Control-Allow-Origin": "*", 
       "Content-Type": "application/json", 
      }, 
      body: JSON.stringify({ 
       result: 'Created Customer Successfully', 
       message: 'The account has been created!', 
       type: 'success', 
       customer: result 
      }) 
     }; 
     callback(null, response); 
    }); 
}; 

お客様関数を作成エラー:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:5000 ' is therefore not allowed access. The response had HTTP status code 403.

POSTメソッドでAPIゲートウェイでCORSを有効にしようとしましたが、結果が変更されませんでした。

は私もまだYAMLファイルを明示的

functions: 
    createcustomer: 
    handler: handler.createcustomer 
    events: 
     - http: post /createcustomer 
     cors: 
      origin: '*' 

運でCORSを設定しようとしました。

私がここで間違っていることを誰もが知っていますか?

奇妙なことは、私がPostManを使ってうまく動作するようにすることができるということですが、私のアプリを通してそれを試してみると、壊れます。

おかげ

UPDATE

enter image description here

私はserverless deployを行うと、それは上の写真のようにAWSに表示し、私が言ったようにメソッドは、この

enter image description here

のように見えます以前は、API Gatewayコンソールから直接CORSを有効にしようとしましたが、メソッドを呼び出そうとすると、違いはありませんでした。

+0

ラムダ応答にAccess-Control-Allow-Headersヘッダーを追加してみます。 –

+0

@KaustubhKhareは、まだ運を試していません。 – DevShadow

+0

投稿した内容に基づいて表示されます。私はAPIゲートウェイコンソールとラムダコンソールが本当に反映され、正しく展開されているかどうかを確認するためにコンソールをチェックします。 – dashmug

答えて

1

あなたのアップデートは、OPTIONSメソッドは、これらのリソースのいずれかのために設定されていないことを示しています。コンソールでAPIゲートウェイリソースに対してCORSを有効にすると、AWSはこれを自動的に設定します。

リソースに対してCORSを有効にするとAWSコンソールで表示されますが、もちろんserverless deployがこの設定を上書きしています。

/createcustomerリソースをserverlessデプロイメントによってAWSで正しく構成するには、サーバーレスのこの部分を書き直すことができます。YAML:

events: 
    - http: post /createcustomer 
    cors: true 

このように見えるように:

events: 
    - http: 
     path: /createcustomer 
     method: post 
     cors: true 

私は、フレームワークの.yml構文の専門家ではないよ、そう、これはまさに、なぜ私が説明することはできません。

それでも、私はこのようなファイルいることが確認されました:

functions: 
    deletecustomer: 
    handler: handler.deletecustomer 
    events: 
     - http: 
      path: /deletecustomer 
      method: post 
      cors: true 
    createcustomer: 
    handler: handler.createcustomer 
    events: 
     - http: post /createcustomer 
     cors: true 

はAWS APIゲートウェイ、正しくCORSのために構成された一つ、およびOPTIONSメソッドを逃す1で2つのリソースを作成します。

Two resources, one correct and one missing OPTIONS

+0

これは魅力的なように機能しました。ありがとうございます! – DevShadow

1

ここでは、役立つ構成です。 CORSの起源を特定することは常に安全です。したがって、原点をlocalhost:{ポート番号}にロックする方が良いでしょう。また、CORS設定で資格情報を有効にすることもできます。一例として、以下のサーバレス設定を参照してください。スクリーンショットと

cors: 
 
    origin: 'http://localhost:4200' 
 
    headers: 
 
    - Content-Type 
 
    - X-Amz-Date 
 
    - Authorization 
 
    - X-Api-Key 
 
    - X-Amz-Security-Token 
 
    - X-Amz-User-Agent 
 
    allowCredentials: true