-1

在 API 请求上返回 303 重定向状态时，我遇到了 CORS 错误。API 托管在 AWS API Gateway 上，并使用 AWS Lambda 与代理响应的集成。当最终用户单击我正在部署的站点上的按钮时，将发出 API 请求。

这是CORS错误：

Access to XMLHttpRequest at 'https://destination.com/' (redirected from 'https://my-api-endpoint.com') from origin 'http://source.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我从 Lambda 函数返回以下代理对象：

{
    "statusCode": 303,
    "headers": {
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Headers": "*",
        "Access-Control-Allow-Methods": "*",
        "Access-Control-Allow-Credentials": True,
        "Location": "https://destination.com/",
    },
}

因此，"Access-Control-Allow-Origin": "*"作为请求中的标头丢失不是问题，这实际上是我迄今为止通过谷歌搜索找到的唯一答案。

此外，如果我将 API 端点放入浏览器，它会按预期工作。据我所知，不同之处在于，当端点直接放入浏览器时，sec-fetch-site标题返回为none，而当我单击网站上的按钮时，标题返回为cross-site，这种差异导致了 CORS 错误。

我的用例是 AWS Marketplace 上的 SaaS 列表，因此当用户订阅我将列出的产品时，POST 请求会发送到我的 API 端点，其中包含我需要摄取的客户端令牌，然后我需要从那里将最终用户路由到我的登录页面。对我来说，最自然的处理方式是返回 303 重定向的 API 端点，但由于源是 AWS Marketplace URL，我自然会遇到跨域问题。

有谁知道如何避免这个 CORS 错误？如果没有，是否有人对我应该如何解决这个问题有其他建议？

4

1 回答 1

-1

原来答案，就像它经常做的那样，正盯着我的脸。https://destination.com是我在 AWS S3 存储桶中托管的一个站点，前面有一个 CloudFront 分布。解决方案是将 CORS 配置添加到 S3 存储桶，然后在 CloudFront 中创建自定义缓存策略。然后，我编辑了 CloudFront 分配的默认行为，以指定缓存策略（我刚刚创建的那个）和源策略 ( CORS-S3Origin)。一旦我使分发无效，它就像一个魅力。感谢@Evert 让我检查我认为我已经排除的内容。

于 2021-07-13T16:25:15.933 回答