node.js - 如何让 create-react-app 使用 IP 连接到我的 api 服务器？

Question

我正在使用 Facebook 的 create-react-app。当我启动网络客户端时，我在控制台中看到:

You can now view web-client in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://192.168.1.107:3000/

问题是我的 Web 客户端使用 localhost 连接到 api 服务器，这意味着我无法使用不同设备上的 IP 地址来调试问题。

env-variables.js:

export const ENV = process.env.NODE_ENV || 'development';

const ALL_ENV_VARS = {
  development: {
    GRAPHQL_ENDPOINT_URI: 'http://localhost:4000/graphql',
  },
....

我尝试用以下内容更新上面的内容:

GRAPHQL_ENDPOINT_URI: `http://${process.env.ip}:4000/graphql`,

这不起作用，process.env.ip 返回未定义。如何让上述 GRAPHQL_ENDPOINT_URI 使用 create-react-app 获取的 IP 地址？

Answer 1

尝试将以下内容添加到客户端 package.json:

"proxy": "http://localhost:4000/",

然后您可以离开

http://localhost:4000

从客户端指向 API 服务器的任何 URL。您只需将这些地址称为

/graphql/<any additional URL data>

我对 Node/Express 后端和 React 前端执行了相同的操作 - 我使用以下内容解析了 server.js 中的/api 部分:

//Use our router configuration when we call /api
app.use('/api', router);

只需将/api 替换为/graphql 即可。

查看这篇文章以获取进一步的解释。希望这有帮助!

https://medium.freecodecamp.org/how-to-make-create-react-app-work-with-a-node-backend-api-7c5c48acb1b0