将 React Dashboard 制作成 Cloud Run 应用程序的好方法是什么？

Question

处理以下设置的好方法是什么：

我想要一个 Cloud Run 应用程序充当仪表板 (React)，其中从 API（也是同一项目中的 Cloud run 应用程序）获取统计信息并在浏览器中显示它们。

Dashboard 成为 Cloud Run 应用程序的原因

仪表板只能由具有特定角色的授权人员访问。我已经为访问 Cloud Run 服务设置了所有安全措施、负载均衡器、IAP、IAM。到目前为止，他们都没有 GUI。

我想象它如何工作

通过调用端点在浏览器中打开仪表板：Cloud Run 应用程序的www.domain/dashboard/。这会自动通过 LB、IAP、需要身份验证等。当到达端点（url）时，浏览器会显示仪表板，仪表板还会在呈现之前从 API 应用程序（使用服务帐户）获取数据（我知道的最后一部分怎么做）

问题

像这样处理它是个好主意吗？

如何让端点呈现 React 代码？

例子：

router.get('/dashboard/', async (req, res) => {
    // 1. prepare some data from the api
    // 2. Render some React view and pass the data
    res.send('OK');
});

谢谢

我非常了解 React，我知道如何在 Cloud Run 服务之间进行通信。我不知道的是如何将这两者很好地结合起来。

Answer 1

我建议：

1. 使用带有 nginx 的 docker 容器
2. 让它在 nginx 服务的公共静态目录中复制您的 React 应用程序
3. 将 docker 容器部署为您的云运行前端服务
4. 定义并关联 IAM 策略，以便只有前端服务可以调用后端服务（不允许未经身份验证）

   如果你不知道/不喜欢 nginx，你可以使用 expressjs static 或其他框架的类似方法来做同样的事情。