无服务器 AWS Lambda CORS 错误

Question

我正在尝试从 angularjs 应用程序向我使用无服务器设置的 lambda 函数发出 http 请求。

这是我的 serverless.yaml 函数

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

创建客户功能

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);
    });
};

在我的 AngularJS 应用程序中，我这样称呼它

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

但是，我不断收到此错误：

对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问Origin ' http://localhost:5000 '。响应具有 HTTP 状态代码 403。

我尝试在 POST 方法的 API 网关中启用 CORS，但这并没有改变结果。

我也试过在 yaml 文件中明确设置 CORS

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

仍然没有运气。

有谁知道我在这里做错了什么？

一件奇怪的事情是，我可以通过 PostMan 使帖子正常工作，但是如果我通过我的应用程序尝试它，它就会中断。

谢谢

更新

当我这样做时，serverless deploy它会像上图一样出现在 AWS 中，方法看起来像这样

正如我之前所说，我尝试直接从 API Gateway 控制台启用 CORS，但是当我尝试调用该方法时没有任何区别。

Answer 1

您对屏幕截图的更新显示未为任何这些资源设置 OPTIONS 方法。当您在控制台中为 API 网关资源启用 CORS 时，AWS 会自动进行设置。

当您为资源启用 CORS 时，您可以在 AWS 控制台中看到这种情况，但是，当然，您serverless deploy正在覆盖此配置。

要/createcustomer通过无服务器部署在 AWS 中正​​确配置资源，您可以重写 serverless.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 Gateway 中创建两个资源，一个为 CORS 正确配置，一个缺少 OPTIONS 方法：