在使用 Angular 将 header 插入 HTLM 之前，是否有任何方法可以从 SSR 页面 serverApp-state 中删除它？

Question

我需要从 Angular 通用 SSR 页面中删除特定的 header（日期），这样最终的 HTML 文件中就不会有这个值。考虑到我无法从 API 服务器响应中删除此 header，是否有任何方法可以使用 Angular?

来实现此目的

这里是 serverApp-state 脚本标签的例子，插入到页面上，header:

<script id="serverApp-state" type="application/json">
...
&q;headers&q;:{&q;date&q;:[&q;Fri, 05 Mar 2021 12:44:26 GMT&q;],&q;content-type&q;:[&q;application/json; charset=utf-8&q;],&q;content-length&q;:[&q;2933&q;],&q;connection&q;:[&q;keep-alive&q;],&q;server&q;:[&q;nginx/1.18.0&q;],&q;vary&q;:[&q;origin,accept-encoding&q;],&q;cache-control&q;:[&q;no-cache&q;],&q;accept-ranges&q;:[&q;bytes&q;]}
...
</script>

Answer 1

如果你使用默认的TransferHttpCacheModule，这个模块会注册一个拦截器来缓存xhr响应，包括headers，在传输状态（见interceptor's code）

所以，如果您不想要这些 headers，这里有几个选项

选项 #1

你可以在默认的基础上写你自己的拦截器，但是不要缓存headers。完成后，您只需要在您的应用程序模块提供者中提供您的拦截器

providers:[
    //...,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: MyOwnTokenInterceptor,
      multi: true
    }]

选项 #2

使用 BEFORE_APP_SERIALIZED 令牌以便您可以在 DOM 文档序列化之前对其进行修改。

选项 #3

在您的 server.ts 文件中，更改默认路由，以便您可以在发送之前修改 html 字符串

  // All regular routes use the Universal engine
  server.get('*', (req, res) => {
    res.render(indexHtml, { req, res, providers: [/*....*/] },
      (err: Error, html: string) => {
        
        if(!html)
        {
          res.status(500);
        }
        else
        {
            //Modify html here to remove the headers
        }
      res.send(html || err.message);
    });

在使用 Angular 将 header 插入 HTLM 之前，是否有任何方法可以从 SSR 页面 serverApp-state 中删除它？

Is there any way of removing header from SSR page serverApp-state before it is inserted in HTLM using Angular?

angular

server-side-rendering

angular-universal

angular11