在开发和生产环境中自动代理AJAX请求

Question

我正在使用Next.js和Axios个库。

我的axios请求看起来像这样：

axios.get('/api/users/1')

当我在同一个实例中使用API​​和渲染服务器时，这工作正常。 但现在我的API后端完全分离了。

在开发模式下，它在localhost:3001托管，而前端（下一个）开发服务器托管在localhost:3000上。在生产中，渲染服务器托管在https://example.com，而API托管在https://api.someoherdomain.com。

如何保持axios请求的清洁（无需导入内容和手工添加url字符串），使它们像/api/users/1一样，但在托管开发模式时自动生成localhost:3000/api/users/1并在托管时https://example.com/api/users/1在生产中。

我需要像这样的东西，但要同时处理生产和开发模式。

  

不建议采用生产规模的方法（因此   显式开发标志）因为我们应该将代理范围作为外部UI应用程序   并有单独的网络服务器处理。

如果无法做到这一点，我正在寻找最优雅的方式来处理这个问题。有什么建议吗？

在制作中我们使用Plesk（使用Ngnix）。

Answer 1

您可以创建axios实例并根据环境变量设置baseUrl参数:) 这里的文档：https://github.com/mzabriskie/axios#creating-an-instance