Angular：如何在使用SSR时为开发中的资产设置baseHref

Question

在生产环境中，我们设置 base href 为：

ng build --base-href /app/

这很好用。 特别是我们的资产也按预期在/app/assets/提供服务。

但是，在我们运行的地方，我无法在开发中达到相同的效果：

ng run project:serve-ssr

资产保留在/assets中，无法在/app/assets中访问。

我在angular.json中尝试过的事情

• 设置architect.build.options.baseHref
• 设置architect.serve.options.servePath
• 设置architect.server.options.servePath （不允许）
• 设置architect.serve-ssr.options.servePath （不允许）

我还尝试设置 DI 令牌APP_BASE_HREF并在 AppModue 中提供它，但没有效果。

Answer 1

假设您使用的是@nguniversal ，我们通过在server.ts中创建一个虚拟路径前缀来解决这个问题：

server.use(process.emv.BASE_HREF, express.static(distFolder));

BASE_HREF在应用程序启动期间设置为环境变量：

BASE_HREF=/app ng run project:serve-ssr

Answer 2

最后，我在开发中的 express 服务器中重写了 url。 不过对此并不满意，所以如果有人有更好的答案，我会很乐意接受。

在server.ts中：

if (environment.removeAssetsPrefix.length) {
  server.use((req, _, next) => {
    if (req.url.startsWith(environment.removeAssetsPrefix + '/assets/')) {
      req.url = req.url.substring(environment.removeAssetsPrefix.length);
    }
    next();
  });
}

在environment.ts ：

export const environment = { 
  ...
  removeAssetsPrefix: '/app'
};