【问题标题】:Can I prerender Angular and fall back to SSR from S3?我可以预渲染 Angular 并从 S3 回退到 SSR 吗?
【发布时间】:2020-03-05 02:46:59
【问题描述】:

我有一个 Angular 应用程序,该应用程序当前由 .Net Core 呈现在服务器端。我想更改我的构建过程以预呈现我的几乎所有站点并将所有静态文件推送到 Amazon S3 存储桶并将我的域名指向那里。但是,我无法预渲染我的所有网站(至少现在还没有)。

我发现我可以return my index.html 处理任何未预渲染且不存在于 S3 存储桶中的页面,这将允许我在客户端渲染页面,但我想更进一步,服务器端即时渲染页面。

如果预呈现的版本不存在,我是否可以将 S3 站点用作反向代理,从我的 .Net Core 站点获取 SSR 页面?

更新:为了清楚起见,S3 存储桶将用于 CloudFront CDN,因此在 S3 存储桶前设置代理可能不是一种选择。

更新 2: 我发现我可以发送 dynamic content via CloudFront,但我不希望一切都是动态的。我希望从廉价的 S3 存储桶中提供任何静态内容(例如我的预渲染页面),并且如果静态版本不存在,则仅从更昂贵的 EC2 实例中提供动态内容。

【问题讨论】:

  • 您可以通过在 S3 存储桶和 CloudFront 之间使用 EC2 实例设置反向代理来实现此目的,并配置中间件以呈现缺失的页面。

标签: angular amazon-web-services amazon-s3 server-side-rendering


【解决方案1】:

简短的回答是否定的。您不能使用 S3 作为反向代理从其他来源获取丢失的对象。

但是,如果您的静态内容可以通过路径轻松识别,您可以在 CloudFront 中创建两个来源,一个用于静态内容,一个用于动态内容,并使用不同的行为/每个来源的路径模式组合:静态内容的 S3 存储桶,也可能是动态内容的自定义来源(托管在 EC2 上)。

您可能还想查看 CloudFront 源故障转移,尽管它是为支持高可用性场景而设计的,它可能适合您的使用案例。您还需要两个来源,主要来源和故障转移(用于静态和动态内容)。在此处查看更多信息: https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/high_availability_origin_failover.html

【讨论】:

  • 我也发现了 CloudFront Origin Failover。我会试一试,看看它是否有效。
  • 记住 CloudFront Origin Failover 旨在支持高可用性场景,特别是故障转移;如果资源(动态与静态)可以通过路径解决,我建议采用行为/路径模式路线。您将节省往返行程。
  • 有道理。目前我认为我将故障转移组作为默认来源。我想我会更改它以使我的 EC2 成为默认源,然后添加行为以将故障转移源组用于任何应该为静态的路径。这样,如果文件丢失,我会得到我想要的回退行为,并且我会绕过 S3 处理其他所有内容 - 其中包括我知道将是动态的任何内容。
  • 效果很好。我将所有预定义静态内容的行为定义为仅转到 S3,具有各种缓存级别的动态内容仅转到我的 ELB,在第一次请求后将是静态的动态图像的故障转移(例如生成的缩略图然后保存到S3),然后 * 将其他任何内容发送到我的 ELB。我在让故障转移正常工作时遇到了一些麻烦,但我认为将“主机”标头列入白名单就可以了。
猜你喜欢
  • 2020-12-16
  • 1970-01-01
  • 1970-01-01
  • 2019-10-03
  • 1970-01-01
  • 2019-08-27
  • 1970-01-01
  • 2018-04-14
  • 2020-03-14
相关资源
最近更新 更多