Angular 7 Universal部署GCP App Engine后SSR失效排查问询

你的问题核心出在app.yaml的路由配置上——当前规则把所有请求都直接返回了客户端的静态index.html，完全绕过了负责SSR的Node.js服务器，自然不会触发服务端渲染。

为什么本地正常，部署后失效？ #

本地运行npm start时，你直接启动了dist/server.js这个Express服务器，它会接管所有请求，先完成SSR再返回渲染后的HTML。但部署到GAE后，你的app.yaml最后一条规则：

- url: /.*
  static_files: dist/browser/index.html
  upload: dist/browser/index\.html

会匹配所有请求，直接返回客户端的空壳index.html（也就是只包含<app-root></app-root>的版本），根本没让Node服务器参与处理。

修复步骤 #

修改app.yaml，移除那条强制返回静态index.html的规则，让GAE的Node.js运行时自动执行你的start脚本（也就是启动SSR服务器），同时保留静态资源的高效路由：

runtime: nodejs16  # 注意：nodejs10已被GAE废弃，换成官方支持的LTS版本比如16/18
handlers:
  # 静态资源路由（保留这些，让GAE直接服务静态文件，更高效）
  - url: /((?:runtime|main|polyfills|styles|vendor)\.[a-z0-9]+\.js)
    redirect_http_response_code: 301
    static_files: dist/browser/\1
    upload: dist/browser/.*
  - url: /((?:runtime|main|polyfills|styles|vendor)\.[a-z0-9]+\.js\.map)
    redirect_http_response_code: 301
    static_files: dist/browser/\1
    upload: dist/browser/.*
  - url: /(styles\.[a-z0-9]+\.css)
    redirect_http_response_code: 301
    static_files: dist/browser/\1
    upload: dist/browser/.*
  - url: /((?:assets|docs)/.*|favicon\.ico)
    redirect_http_response_code: 301
    static_files: dist/browser/\1
    upload: dist/browser/.*

# 移除原来的url: /.* 静态index.html规则，剩下的请求会自动交给Node SSR服务器处理

额外检查点 #

1. 确认server.js的配置：确保你的Express服务器正确设置了SSR逻辑，比如使用ngExpressEngine处理所有非静态请求，示例片段：

import { ngExpressEngine } from '@nguniversal/express-engine';
// ...
app.engine('html', ngExpressEngine({
  bootstrap: AppServerModule,
}));
app.set('view engine', 'html');
app.set('views', join(DIST_FOLDER, 'browser'));

// 所有非静态资源的请求交给SSR处理
app.get('*', (req, res) => {
  res.render('index', { req });
});

2. 更新Node.js版本：nodejs10已经被Google App Engine淘汰，换成官方支持的LTS版本（比如16或18），避免运行时兼容性问题。
3. 验证部署：重新部署后，访问页面时查看响应的HTML源码，如果能看到<app-root>里有渲染好的内容，说明SSR已经生效。

内容的提问来源于stack exchange，提问作者dvdbrk