在 vercel 中部署 React 应用程序，后端在渲染中

Question

大家好！

新年快乐

我试图在 vercel 或 netlify 中部署我的 vite React 应用程序。我在渲染中托管了它的后端部分，现在后端正在工作，但是当我在前端托管时，请求 URL 更改为托管 URL，因为我使用 vite 代理来使用快捷 URL，但它在开发中不起作用，

我的 vite cconfig 示例

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    VitePWA(manifestForPlugin),
    react(),
  ],
  server: {
    proxy: {
      "/api": {
        target: "https://sample__.onrender.com",
        changeOrigin: true,
        secure: false,
        rewrite: (path) => path.replace("/api", ""),
      },
    },
  },
  build: {
    proxy: {
      "/api": {
        target: "https://sample__.onrender.com/", 
        changeOrigin: true,
        secure: false,
        rewrite: (path) => path.replace("/api", ""),
      }
    }
  }
});

所以当我调用 api 时，我的 url 是这样的：

api/auth/login/

所以在本地主机中，它将变成，

localhost:8000/auth/login/

但是当我从 netlify 或 vercel 的开发服务器上做到这一点时，它变得像

mydoamin.com/api/auth/login/

在本地主机中，我的后端正在 8000 中运行，前端正在 5173 中运行

Answer 1

您可以使用vercel rewrites作为反向代理，您可以参考文档这里