正在为 React/Express 个应用代理生产中的 api 个请求

Question

我正在使用分离的存储库（后端和前端）开发 MERN 堆栈项目，在开发环境中，我使用“代理”连接服务器 API 与反应，它工作得很好。

//package.json in react
{
...
"proxy": "http://localhost:8000/",
...
}

但是当我切换到 production 环境并将代理值替换为已部署的 link 时，不再支持“proxy”。我搜索了一下，发现它只适用于开发环境，我尝试了在互联网上找到的几种解决方案，但没有成功！

顺便说一句，我正在用 Heroku 部署后端，用 Netlify 部署前端。目前两者都部署无误，但后台和前台之间没有连接。

Answer 1

在生产中我们不能使用（代理）..相反，我们可以在前端为后端设置一个变量URL，反之亦然。

让我们从后端配置开始：

app.use(cors({ 
   origin: "frontend_URL", 
   credentials: true 
  }));

现在，让我们看看前端配置：

在您喜欢的任何位置设置变量：

export const API_URL = "URL";

在您调用 API 的文件中：

import axios from "axios";
import { API_URL } from "./your/path";
axios.defaults.withCredentials = true;

axios.get(`${API_URL}/your/route`);

现在您可以部署了...

Proxying api requests in production for React/Express app