什么:我正在使用Angular构建一个网站,我想将它部署在纯静态服务器(例如Amazon S3)上。我需要在部署之前预先渲染网站的所有HTML页面,我不知道如何继续。
如何:我目前的想法是让一些抓取工具读取sitemap.xml
之类的文件来检索所有网站的网址列表,然后将这些网址的请求发送到Node所在的服务器安装了.js,我的Angular(通用)应用程序的一个实例正在运行。
问题:这听起来像是正确的方法吗?我错过了一个重要的步骤吗?是否有任何库或npm软件包可以帮助完成此任务?
令人惊讶的是,我找不到任何有关Angular预渲染的文档(仅限RE渲染)。我也看过静态站点生成器的灵感,但它们都使用一堆静态文件作为起点(不是URL列表)。另外,我不想使用像prerender.io这样的第三方服务。
答案 0 :(得分:5)
我刚刚使用Angular 4完成了类似的任务。站点使用Github页面托管,没有后端。请随意使用它作为示例:repo和实现预渲染的提交:0d81d28
我必须实施以下更改:
renderModuleFactory
模块中的@angular/platform-server
生成html文件,并将生成的html保存在适当的位置。/community/overview
之类的网址,则应将html保存到/community/overview/index.html
。角矩阵参数不能工作:(。我必须将矩阵参数移动到URL路由中,例如而不是/docs;doc=overview.html
使用/docs/overview.html
initialNavigation: 'enabled'
添加到路由器配置中:RouterModule.forRoot([{ path: '', ...}], { initialNavigation: 'enabled' })
。我仍然不知道initialNavigation是什么以及为什么它会有所帮助。希望这有帮助。
答案 1 :(得分:-1)
您需要/想要一个特殊的托管服务,将所有http请求定向到root index.html。包含所有页眉和Angular或SPA脚本的文件。否则当您刷新或转到“您的网站/'以外的网址”时根它最终会给你一些404错误。
当然,如果你的前端路由器没有使用哈希网址'你的网站/#/'你基本上使用html5推送状态,这当然主要是一个问题。但即使使用哈希网址,您仍然可以运行。除非服务器环境支持为所有html提供root index.html文件或没有匹配的请求。
围绕上述问题有各种各样的方法,但我当然不推荐它。如果您的服务环境服务支持此功能,您基本上会再次在404页面上提供相同的index.html。
所以基本上你需要设置自己的服务器或使用[Aerobatic] [1]
等服务您可以使用静态网站生成器而不是使用像Angular这样的SPA框架。