使用 Reactjs 应用程序作为域后端中 express nodejs 的前端答案

【问题标题】：Use Reactjs app as a frontend for express nodejs in backend on domain使用 Reactjs 应用程序作为域后端中 express nodejs 的前端
【发布时间】：2020-08-27 10:11:02
【问题描述】：

我使用 react js 创建了一个前端应用程序，它在后端调用 express 节点 js api，在 localhost 中我没有问题，因为它在 localhost 上运行，但是当我将它们都部署在 plesk 服务器上时，我没有知道如何从我的 react js 应用中调用 express api。

1.如何在 plesk 服务器的生产环境中运行 express node js。 2.如何从react js app调用express api（在localhost我使用http://localhost:8000/users）

谢谢你

【问题讨论】：

第一个问题可以通过快速搜索plesk.com/blog/product-technology/node-js-plesk-onyx 来解决。至于第二个问题，与在 localhost 上运行时的配置有什么不同吗？如果没有，请执行相同操作，但将 localhost:8000 替换为您的域。

标签： node.js reactjs express plesk

【解决方案1】：

此部署假设您将 React 应用程序构建到您的 express 应用程序中。所以最终，您的应用程序与您的后端在同一个域上运行。例如。如果您将 React 应用程序构建到 express 中的 reactapp 文件夹，那么您可以使用：

app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname, 'reactapp/index.html'));
});

在同一条快车上，您的 api 有另一条路线：

app.get('/api/somerestapi', (req, res) => {
  // process your api request 
  res.send({data: 'some data'});
});

这意味着，您使用相对路径从 React 调用您的 API：

const request = new XMLHttpRequest();
request.open('GET', '/api/somerestapi);
...

【讨论】：

感谢您的回复，我的构建在不同的域，我的后端在子域示例：react js build => example.com express api => api.example.com
这对您有帮助吗？ github.com/facebookincubator/create-react-app/issues/…。无论如何，我建议您将所有内容都放在一个域上，在一台服务器上。
非常感谢您的帮助，我会尽力使其正常工作并回复您。
你知道如何使用 node js 在 plesk 上运行 express 应用吗？