サーバレスおよびPUTコマンドのCORS問題

Question

ServerlessおよびAWSの別のCORS問題が発生しています。私はPUTメソッドを許可するために具体的にそれを伝える必要があるようだが、私はこのコードがどこに行くのかわからない。私は私のラムダ関数に次のコードを持っている：私は取得しています

module.exports.update = (event, context, callback) => { 
    const timestamp = new Date().getTime(); 
    const data = JSON.parse(event.body); 
    if (typeof event.pathParameters.timeoffgroupid !== 'string') { 
    console.error('Validation Failed'); 
    callback(new Error('Couldn\'t update the todo item.')); 
    return; 
    } 
    const params = { 
    TableName: 'TimeOffGroup', 
    Key: { 
     timeoffgroupid: event.pathParameters.timeoffgroupid, 
    }, 
    ExpressionAttributeValues: { 
     ':timeOffGroup': data.timeOffGroup, 
     ':timeOffGroupColor': data.timeOffGroupColor, 
     ':dateModified': timestamp 
    }, 
    UpdateExpression: 'SET timeOffGroup = :timeOffGroup, timeOffGroupColor = :timeOffGroupColor, dateModified = :dateModified', 
    ReturnValues: 'ALL_NEW', 
    }; 

    dynamoDb.update(params, (error, result) => { 
    if (error) { 
     console.error(error); 
     callback(new Error('Couldn\'t update the todo item.')); 
     return; 
    } 
    const response = { 
     statusCode: 200, 
     body: JSON.stringify(result.Attributes), 
     headers: { 
     "Access-Control-Allow-Origin" : "*", // Required for CORS support to work 
     "Access-Control-Allow-Credentials" : true 
     } 
    }; 
    callback(null, response); 
    }); 
}; 

エラーは次のとおりです。

のXMLHttpRequestが https://pwqlomgq89.execute-api.us-east-1.amazonaws.com/dev/timeoffgroup/7d463800-0935-11e7-b618-4b1d72ddca8e?timeOffGroup=Holiday+editedをロードすることはできません。 要求された リソースに「Access-Control-Allow-Origin」ヘッダーが存在しません。したがって、オリジン 'http://localhost:9000'は許可されません。 応答はHTTPステータスコード502を持っていました。angular.js：14328 おそらく未処理の拒否： {"data"：null、 "status"：-1、 "config"：{"method"： "PUT"、 "transformRequest" [null]、 "transformResponse"：[null]、 "jsonpCallbackParam"： "コールバック"、 "データ"：{}、 "url"： "https://pwqlomgq89.execute-api.us-east-1.amazonaws.com/dev/timeoffgroup/7d463800-0935-11e7-b618-4b1d72ddca8e"、 "params"：{"timeOffGroup"： "Holiday edited"} "contentType"： "application/json; charset = utf-8"}}、 "statusText"： "ヘッダー"：{"Accept"： "application/json、text/plain、 /" "}

CORSを動作させるためにサーバーレスのチュートリアルのすべての呼び出しに従っています。しかし、それは私が仕事を取得して作成しているようだが、PUTコマンドは動作していません。クロスドメインに対してPUTを許可するために更新コマンドを設定する必要がある場所はありますか？私はPUTメソッドへのアクセスのためのより多くのここで必要になる場合がありますように

が見える： ヘッダ：

{ 
    "Access-Control-Allow-Origin" : "*", // Required for CORS support to work 
    "Access-Control-Allow-Credentials" : true 
} 

Answer 1

あなたの問題はあなたがOPTIONS動詞を処理していないということであるようです。この要件の詳細については、answerを参照してください。

PUTリクエストを行う前に、ブラウザはこの種のリクエストがサーバーによって確実に行われるように、安全対策としてOPTIONSリクエストをプリフライトします。 OPTIONSをサポートしていない場合は、PUTリクエストは作成されません。

この問題を解決するには、serverless.ymlファイルにOPTIONSのサポートを追加してください。

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

    try { 
    switch(event.httpMethod + ' ' + event.resource) { 
     case 'PUT /foo/bar': 
     handlePut(callback); 
     break; 
     case 'OPTIONS /foo/bar': 
     handleOptions(callback); 
     break; 
     default: 
     // return HTTP 400 
    } 
    } 
    catch (err) { 
    // return HTTP 500 
    } 
}; 

const handlePut = (callback) => { 
    callback(null, { 
     statusCode: 200, 
     headers: { 
      'Access-Control-Allow-Origin': '*' 
     }, 
     body: JSON.stringify({ 
      message: 'PUT' 
     }) 
    }); 
}; 

const handleOptions = (callback) => { 
    callback(null, { 
     statusCode: 200, 
     headers: { 
      'Access-Control-Allow-Origin': '*', 
      'Access-Control-Allow-Headers': 'origin, content-type, accept', 
      'Access-Control-Allow-Methods': 'POST, PUT, OPTIONS' 
     } 
    }); 
};