AWS Cloudfront作为带有自定义域{Her}的Heroku站点的CDN

Question

最近，我从AWS Route 53（brianpatrickhummel.com）购买了一个域名来托管个人投资组合。投资组合网站已启动并正在运行，使用S3存储桶和Cloudfront作为CDN。在投资组合网站上，访问者可以预览我构建的一些应用程序，这些应用程序使用iframe元素在现场启动，我注意到我的Heroku部署的应用程序需要10-20秒才能加载，因为这些网站的访问者很少平均而且没有CDN服务。

因此，我开始研究使用AWS Cloudfront作为CDN。我从一个Heroku应用程序开始，添加了一个自定义域，现在配置为：

Domain Name: burger.brianpatrickhummel.com
DNS Target: burger.brianpatrickhummel.com.herokudns.com

最后一步是将应用程序的DNS提供程序配置为指向Heroku提供的DNS目标。＆＃34;在此步骤和正确配置Cloudfront发行版之间，我陷入了混乱的困境。我不确定我在Cloudfront，Route 53或两者中进行某些DNS / CNAME更改的位置。

没有多少与这三种技术（Heroku，Cloudfront，Route 53）特别相关的在线文档，而且我花了很多时间在这三篇文章之间蹦蹦跳跳，但无济于事：

Heroku - Using Amazon CloudFront CDN

Configuring Amazon Route 53 DNS for Your Heroku App

我确信必要的更改本质上很简单，并且非常感谢那些可能具有此特定配置经验的人的任何见解。

--- --- UPDATE

我有最后一个问题，现在我已经成功通过Cloudfront路由我的所有Heroku应用程序，我已经意识到所有具有生成POST HTTP请求的组件的应用程序都会收到403 - 禁止错误。这是否与相应的AJAX调用中的相对URL有关：

$(document).on("click", ".saveButton", function () {
  var thisId = $(this).attr("id");
  $.ajax({
    method: "POST",
    url: "/save/" + thisId
  }).done(function () {} 

我在Cloudfront文档中看到以下内容：

  

CloudFront始终缓存对GET和HEAD请求的响应。您还可以配置CloudFront以缓存对OPTIONS请求的响应。 CloudFront不会缓存对使用其他方法的请求的响应。

处理来自Heroku应用程序服务器的响应问题是否比成功发送请求的问题更严重？

- 更新2 -
我认为这与Cloudfront文档中基于此声明的HTTP / HTTPS有关：

  

CloudFront不会将DELETE，OPTIONS，PATCH，POST或PUT请求从HTTP重定向到HTTPS。如果您将缓存行为配置为重定向到HTTPS，则CloudFront将使用HTTP状态代码403（禁止）响应对该缓存行为的HTTP DELETE，OPTIONS，PATCH，POST或PUT请求。

Heroku说：

  

如果您想使用SSL提供Cloudfront资产，您可以在亚马逊为您提供的分发域上使用HTTPS。请注意，虽然您可以为此目的创建CNAME，但通过CNAME和SSL提供Cloudfront资产会产生附加费用。

在AWS Cloudfront分发缓存行为设置中，您可以选择 对于查看器协议策略来自三个选项：

  

如果您希望CloudFront允许查看者使用HTTP或HTTPS访问您的Web内容，请指定HTTP和HTTPS。如果您希望CloudFront将所有HTTP请求重定向到HTTPS，请指定将HTTP重定向到HTTPS。如果您希望CloudFront需要HTTPS，请指定仅HTTPS。

Cloudfront doc继续注意：

  

将HTTP重定向到HTTPS   查看者可以使用这两种协议，但HTTP请求会自动重定向到HTTPS请求。 CloudFront返回HTTP状态代码301（永久移动）以及新的HTTPS URL。然后，查看器使用HTTPS URL将请求重新提交给CloudFront。

     

当查看者发出重定向到HTTPS请求的HTTP请求时，CloudFront会对这两个请求收费。对于HTTP请求，收费仅适用于请求以及CloudFront返回给查看者的标头。对于HTTPS请求，收费是针对请求的，以及源文件和对象返回的对象。

     

仅限HTTPS   观看者只有在使用HTTPS时才能访问您的内容。如果查看者发送HTTP请求而不是HTTPS请求，CloudFront将返回HTTP状态代码403（禁止），并且不会返回该对象。

好悲伤，我不知道举办个人网站会有多复杂！

Answer 1

  

域名：burger.brianpatrickhummel.com

您将在Route 53中将此指向CloudFront ...但在此之前，您需要创建新的CloudFront分配并将该主机名配置为分发的备用域名。

  

DNS目标：burger.brianpatrickhummel.com.herokudns.com

在创建分发CloudFront时将其配置为源域名。

在“缓存行为”设置中，将Host标题列入白名单，以便Heroku了解请求所针对的网站。

Answer 2

  

我不确定我在哪里进行某些DNS / CNAME更改   Cloudfront，Route 53或两者

因为Route53是DNS服务（不是CloudFront），所以您将在Route53中创建CNAME记录。您想在Route53中创建一个CNAME记录，将您的子域指向CloudFront。然后，您需要配置CloudFront以通过配置备用域名字段来了解它需要为该域提供服务。

Answer 3

以下是我要做的步骤，

由于您已经在Route 53上，

  

从ACM获取免费SSL

确认您对域电子邮件地址的SSL验证。 确保它看起来像下面的绿色，

  

使用SSL和CNAME将其分配给CloudFront Endpoint

您还将看到将在Route53中为此SSL端点自动创建一个cname。

如果你ping burger.brianpatrickhummel.com，它应该从clound前面回应。

现在，在Cloudfront中设置Origins，将其指向您的端点，并提供所需的所有缓存设置。如果您不需要缓存设置，则可以将它们全部设置为0，这样cloudfront就不会缓存任何数据。

在您的Cloudront模式中，请确保最后有*，以便它匹配所有网址模式以将其转发到您的终端。

如果您的端点需要受到保护，您可以从Cloudfront传入其他标头，并确保该请求是从云端而不是任何公共端点开始的。

Answer 4

看来 Host 是 no longer trusted and accepted by heroku。它将不再正确链接到该站点

改用 Origin Custom Header。

自定义header的名字会经过一些解析和大小写的变化，所以为了调试它，在这个命令中添加打印请求中提供的相关headers。

puts request.headers.env.reject { |key| key.to_s.include?('.') }

您应该在那里看到您的标题，但可能采用不同的格式。

作为参考，我的标头是 X-Request-ID（这是 recommended by Heroku 的额外用途），它被转换为 HTTP_X_REQUEST_ID。