时间戳

首页 > 解决方案 > 使用 Cloudfront S3 处理静态资产的 AWS 指南 - EC2 用于 API 调用

amazon-web-services - 使用 Cloudfront S3 处理静态资产的 AWS 指南 - EC2 用于 API 调用

问题描述

我正在尝试让我的静态网站向 EC2 实例发送一些非常基本的 API 调用——任何人都可以分享最佳实践或为我指明正确的方向吗？

当前设置如下：

似乎我有两个选择 - 通过云端传递 API 调用（似乎无法让它工作）或允许跨源客户端并将我的 axios 请求指向不同的 IP。以这种方式允许 CORS 是否被认为是不好的做法？

对于第一个选项，我在 cloudfront 上创建了第二个源，并将其指向路由 53 DNS，该路由指向我的 ec2 弹性 IP。问题是，尽管在我的云端控制台中对所有来源启用了 POST，但我无法让 API 工作：

<?xml version="1.0" encoding="UTF-8"?>
<Error>
<Code>MethodNotAllowed</Code>
<Message>The specified method is not allowed against this resource.</Message>
<Method>POST</Method>
<ResourceType>OBJECT</ResourceType>
<RequestId>2B5DB5E28188BE4A</RequestId>
<HostId>yXiiLTR5v8KERjzbG3fx4BGcZG5FO0e3Yufa0b9aC2W3sMyuOK3BBADtZj097T8E0qBZ3F/rBC8=</HostId>
</Error>

我想我的问题，除了健全性检查设置如下：

非常感谢您的时间和帮助！我很感激

标签： amazon-web-servicesamazon-s3amazon-ec2amazon-cloudfront

解决方案

对于任何试图使此设置与 CloudFront CDN 一起使用的人 - 使用 lambda 函数是最好的方法。创建一个 Lambda 函数来处理每个请求并使用 AWS API Gateway 进行管理。

必须使用以下代码片段在您的 S3 存储桶上启用 CORS：

`<CORSConfiguration>
 <CORSRule>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
  <MaxAgeSeconds>3000</MaxAgeSeconds>
 </CORSRule>
</CORSConfiguration>`

另外，我从这个练习中学到的一些东西可能会帮助其他人：每当客户端向您的端点发送 OPTIONS 请求时，您需要返回带有这些标头的 200。这可以在您选择的任何后端完成，但这里有一个 API Gateway 指南：

https://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html

这是我发现的指南，描述了如何创建类似的（高度可扩展的）堆栈：

https://www.codeengine.com/articles/process-form-aws-api-gateway-lambda/

谢谢！

推荐阅读