在 Firebase 托管和 Firebase 云功能 v2 上连接 React 应用程序

Question

我有 Vite React 应用程序（在本地完美运行），其配置可通过 url（express 应用程序）将所有以

/functions

开头的 api 请求重定向到 firebase 函数。

export default defineConfig({
  plugins: [react()],
  server: {
    proxy: {
      '/functions': {
        target: FIREBASE_CLOUD_FUNCTIONS_URL,
        changeOrigin: true,
        secure: false,
        rewrite: (path) => path.replace(/^\/functions/, ''),
      },
    }
  }
})

我的 firebase v2 功能已在 europe-west3 区域部署并可用

我的所有 API 端点均可通过下一个 url 访问：

• https://functions-someid-ey.a.run.app/someMethod1

• https://functions-someid-ey.a.run.app/someMethod2

• https://functions-someid-ey.a.run.app/someMethod3

现在我正在尝试将我的 React 应用程序部署到具有相同行为的 Firebase Hosting 中。我遵循这个教程

我的 firebase.json 如下所示：

{

  "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "/functions/**",
        "function": {
          "functionId": "functions",
          "region": "europe-west3"
        }
      },
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

但是部署后所有 api 调用都会返回

404

:

• https://PROJECT_ID.web.app/functions/someMethod1

• https://PROJECT_ID.web.app/functions/someMethod2

• https://PROJECT_ID.web.app/functions/someMethod3

我缺少什么？如何正确设置从托管到云函数 v2 的重定向/重写？也许我使用了错误的

functionId

标识符（我只使用函数名称）。感谢您的帮助！

Answer 1

问题是 firebase 重写只是将完整的 url 传递给函数：

https://PROJECT_ID.web.app/functions/someMethod1 -> /functions/someMethod

您的 Express 应用程序应该托管

/functions/someMethod

（我的只是

/someMethod

）