Angular universal - 为客户端缓存的服务器端请求

标签 angular caching angular-universal server-rendering

我看过很多关于在 Angular 通用应用程序中为客户端缓存数据的文章,因此它不会重复已在服务器上解析的客户端请求。

我只是不明白数据是如何从服务器传输到客户端的。我是将 JSON 注入(inject)到预呈现的 HTML 中还是遗漏了其他内容?

最佳答案

从 Angular 5 开始,Angular 核心内部有一个名为 TransferStateModule 的模块可以为您执行此操作。 https://angular.io/api/platform-browser/TransferState

您只需将您的 API 响应与 StateKey(基本上就像一个字符串)一起添加到服务器端的缓存中,在将 index.html 文件发送到客户端之前,它会以 Json 的形式写入 DOM,在那里您要求StateKey 并从 Json 中获取结果。

在官方通用入门工具包中,您可以看到在哪里注册以及注册什么:https://github.com/angular/universal-starter


更新 Angular 6

你不需要自己设置状态键。新的 TransferStateModule 有一个自动设置键的 HttpClient 拦截器!如果您想拥有更多控制权,您仍然可以自己做,但现在就像添加模块一样简单(最新的通用入门工具包默认导入了它!)

关于Angular universal - 为客户端缓存的服务器端请求,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44261914/

相关文章:

Angular AWS Amplify 身份验证器额外字段

html - 如何在 Angular 6 中设置背景图像?

javascript - Angular 2 : Ts: Nested functions

php - MVC 框架中的缓存策略?

angular - 使用 Angular cli 进行服务器端渲染

asp.net-mvc - 服务器端使用 Edge.js 在 ASP.NET 中呈现 Angular 2

angular - 为什么组合的可观察对象在使用 Subject 时不更新模板,或者如果它们在 ngAfterContentInit 之后发出

asp.net - Response.Flush 破坏页面缓存

asp.net - 从 ASP.NET 禁用所有浏览器的浏览器缓存

javascript - Angular 4 + 通用 : Has no exported member 'StaticProvider'