Question

我正在使用React前端和Node.js后端（API）构建Web应用。
在React前端中，我这样调用API方法：

axios({
    method: 'post',
    url: 'http://servername:9999/reports.activities',
    data: {
        user_id: 1
    }
}).then(res => {
    this.setState(res.data);
});

有时我需要测试尚未发布到生产环境中的API方法。
在本地测试后端时，我在nodemon api.js上运行localhost:9999。
每次我想使用本地运行的API测试前端时，都必须在前端代码中将http://servername:9999更改为http://localhost:9999。
我认为这不是正确的方法。
使用不同的url进行开发（在本地运行npm start时和生产（npm build）时，最好的方法是什么？
我当时正在考虑为此目的使用dotenv。这是正确的方法吗？
最佳做法是什么？

Answer 1

如果您正在使用create-react-app，则已经安装了dotenv。

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-development-environment-variables-in-env

因此您可以这样做：

const API_ENDPOINT = process.env.REACT_APP_API_ENDPOINT || 'http://production';

...
url: `${API_ENDPOINT}/reports.activities`

使用不同的API URL进行React和axios的开发和生产

1 个答案: