React Native：出错时将axios重定向到不同的地址

Posted 2023-02-22

【中文标题】React Native：出错时将axios重定向到不同的地址

【英文标题】：React Native: Redirecting axios to a different address upon error

【发布时间】：2019-03-22 22:09:35

【问题描述】：

设置：我目前在一个有两个 Mac 用户的组中编码（我正在运行 Linux）。我们正在使用 React Native 制作一个移动应用程序。他们正在一个不适用于 Linux 的 iPhone 模拟器上测试该应用程序。我通过将包提供给物理 android 手机来测试应用程序。这工作正常，直到我尝试向本地服务器发出 axios 请求。 在 axios 请求中，我们输入端点“http://localhost:3001/whatever”。由于我的程序副本是在移动设备上运行的，因此 localhost 指的是设备而不是计算机。我可以通过将“localhost”更改为我的 IP 地址来使请求生效。

例如，

//Instead of
axios.get('http://localhost:3001/api/point')
    .then(response => doaThing(response));
//I could do
axios.get('http://my.ip.addr:3001/api/point')
    .then(response => doaThing(response));

问题： Axios 非常适合我的团队。如果不进行更改，它将对我不起作用。我不想在每次提交之前对代码库进行大量微小的改动。如果第一个请求找不到服务器，有什么方法可以告诉 axios 尝试我的 IP 地址吗？目前 axios 在出现此错误时返回一个 'request.status = 0' 的对象。

如果这是一个愚蠢的想法，请告诉我：我试图通过为 axios 创建一个粗略的包装器来解决这个问题，它可以进行调用、检查错误消息以及它是否有状态0，拨打第二个电话。应返回任何响应。

export default axiOS = 
  get: async (endpoint = '', body = ) => 
    await axios.get(`http://localhost:3001$endpoint`)
      .then(response => response)
      .catch(async err => 
        //if axios cannot find the server, the status code will be 0
        if (err.request.status === 0) 
          await axios.get(`http://my.ip.addr:3001$endpoint`)
          .then(response => response)
          .catch(err => console.log("GET Error: ", err))
         else 
          console.log("GET Error: ", err);
        
      );
  , //etc. for put, post, and delete

被调用

let response = axiOS.get('/api/time');

这可以让所有相关人员的生活更轻松，但我似乎无法在返回未定义值之前解决承诺。

tl;博士 所以我的问题至少有两种可能的解决方案

出现错误时是否可以让 axios 路由到辅助地址？ 我的代码是解决这个问题的可行方案吗？如果是，我可以更改什么以返回对第一个成功请求的响应？ 是否有我没有考虑过的第三种解决方案？

【问题讨论】：

也许这可能有用github.com/axios/axios/issues/108#issuecomment-164044648 或这个***.com/a/47477644/2083099

尝试使用这样的模板字符串：$__DEV__ ? (Platfrom.OS === 'ios' ? 'http://localhost' : 'http://x.x.x.x') : 'https://prod.url'/api/time

@dotoconnor 那太完美了。这正是我所需要的。这将适用于我们的目的。唯一的缺点是，如果我的任何队友在 Android 手机上加载该应用程序，那么该程序将访问我的本地服务器而不是他们的本地服务器。我不认为这是一个大问题。如果您想将其发布为解决方案，我可以将其标记为已回答。

【参考方案1】：

如果应用程序应该公开发布，应用程序应该以某种方式知道要联系哪个服务器。现在，在开发中是 localhost 或本地 ip，以后它很可能是一个域。也就是说：在每种情况下，您都需要找到一种方法来使用要使用的 url 来配置应用程序。我建议使用.env 文件并以某种方式将 url 放入源代码中，以便您的源代码只使用配置中的 url。这样，在您的生产应用程序中就可以轻松获得最终 url。

【讨论】：

我很想使用 .env 文件来配置它，但据我所知，React native 无法理解全局变量。

它没有任何可以挂钩的构建过程吗？类似 webpack 的东西？？