如何使用 NestJS 在 Google App Engine 上从同一域部署后端和前端?

How to deploy both back end and front end from the same domain on Google App Engine with NestJS?

当前文件夹结构是这样的:

root
  -.github/workflows
  -frontend
  -backend

后端使用 NodeJS-NestJS/Express 和 从 React 前端提供静态文件。前端必须由后端提供服务,因为一些特定的 cookie 是与静态资产一起提供的。例如,用户必须到达 example.com/ 才能看到该网站,而 API 就像 example.com/someapi。由于缺少重要的 cookie,将前端部署到 example1234.com 并向 API 调用 example.com/someapi 将无法工作。

App Engine用于存储后端,启用Identity Aware Proxy。目前,我知道 2 个选项:

  1. 使用 dispatch.yaml,我相信这不会起作用,因为前端和后端在 2 个不同的实例上,所以域不同(例如,example1234.comexample.com)。
  2. 使用 Cloud Storage Bucket,这将有效,但静态资产必须公开可用。这是不允许的,因为应用程序仅供内部使用。 IAM是必须的,也就是说,一个应用程序本身也有一个单独的认证层。

欢迎对我的想法提出任何建议或更正!


更新-解决方案 根据公认的答案,这是我解决这个问题的方法。

  1. 构建 React,并将其构建文件夹复制到后端的文件夹中。

  2. nest-cli.json 中,在 NestJS 构建中包含静态 React 构建

    "compilerOptions": {
    "assets": [
        "resources/build"
    ]}
    
  3. 在编译期间动态加载静态服务路径。

所有这些都是在 CI/CD 管道中完成的。

如果您必须通过后端来提供静态文件,请直接从后端提供它们(并删除未经任何检查提供的静态文件的值)。

IAP 是一种防止访问静态文件的解决方案,但如果它还不够,除了我之前的评论,你没有其他解决方案(至少对于无服务器产品,我相信你可以做更多可定制的事情容器或 VM 中的 Nginx)