如何在S3上上传预渲染文件并在初次加载我们的网页时访问？

Question

我使用Angular Universal Starter工具包实现了我的Web应用程序。我想将预渲染文件上传到S3存储桶，以便我的初始页面加载得更快。但是我找不到有关将预渲染文件上传到S3以及如何在初始加载时访问该文件的正确配置？

Answer 1

使用预呈现的HTML与上传静态网站相同。假设您安装并配置了aws cli（使用aws configure），您可以在目录上运行以下命令将文件上传到s3存储桶。

  

这只会上传/更新那些已经改变的文件   现有的存储桶文件。

aws s3 sync my_local_dir s3://my_s3_bucket_name

此外，如果要设置缓存，则可以添加以下选项

aws s3 sync my_local_dir s3://my_s3_bucket_name --cache-control max-age=604800

Answer 2

@Shailaja shah ..这个答案有点晚了，我不知道你是否得到了答案。但我还是在这里添加它来帮助SO用户。

我不知道Angular如何使用像S3这样的静态文件托管。 Angular Universal需要服务器端Javascript引擎（nodejs）在将页面交给客户端bowser之前预先呈现页面; Amazon S3除了提供一些静态文件之外没有任何功能。 另一方面，通过客户端渲染，S3可以正常工作，因为它唯一的工作就是提供静态文件（index.html，app.js，app.css等）

一个类似的问题（这个qn是关于另一个静态文件服务器nginx，而不是S3）：https://github.com/angular/universal/issues/554

BTW，Angular Universal is part of the main ng project now

在这里开一个赏金，因为我也很想知道。

Answer 3

我已在目前的组织中实施了它。我的情况有所不同 由于库存，我们的内容是动态的。因此，我们过去只向所有抓取工具发送预渲染页面，而不是真实用户。这样做是出于以下原因：

1. 不会将抓取工具发送到真实服务器，否则会影响我们的分析。
2. 为什么要为只需要静态数据的抓取工具解决我们的服务器问题。
3. 最重要的是，MOST引擎无法呈现Angular标签。基本上，在显示搜索结果之前，它们不会在页面上执行javascript。如果我们不这样做;我们网站的搜索结果看起来很糟糕。

我们是如何做到的：在我们的nginx上;如果user-agent是任何搜索引擎将请求转移到安装了https://github.com/prerender/prerender的预呈现服务器（独立服务器），我们配置规则。

最重要的是在这个预渲染服务器上配置了s3HtmlCache插件。这个插件首先检查S3中的页面是否可用;如果不是它在运行时创建页面 - ＆gt;保存在s3中 - ＆gt;发送给客户。

所以，要解决你的问题：在你的nginx;只需将所有请求转移到预渲染服务器。

如果您遇到任何问题，请告诉我。我已经实现了它，我知道这肯定会起作用。一切顺利。