React Native 中的 Fetch/Axios 无错误地停止

Question

我的本​​地盒子上有一个可以运行的小应用程序。设置是 React Native、Redux Thunk 和 Redux。使用 Thunk，我确实从我的后端服务器加载数据。

这一切都很好，除了一个请求在加载数据时停止。代码如下：

export function readData() {
    return function (dispatch) {
        console.log("service called");

        return axios.get(
              BASE_URL + '/my-data',{ 
              timeout: 120000,
              transformResponse: function(data) {
                console.log("transform");
                return JsonUtils.readJsonFromResponse(data);
              }
            }
          ).then(response => {
            console.log("output");
            dispatch(showData(response.data.result));
          }).catch(error => {
          console.log("error", error);
          throw error;
      });

    }
}

上面的代码现在显示的是 axios，但是 Fetch 也会出现同样的问题。当我将代码更改为另一个 URL 时，它工作得很好。结果有效。我看到的唯一区别是我的其他 URL 提供了大约 5kb 的数据，而有问题的 URL 目前提供了大约 100kb。

上面的输出是：

service called

当使用另一个 URL 时，会写入所有控制台输出。

在服务器端，我可以看到输出已写入并传递。看起来请求发送成功，返回了响应，但 React 没有接收到它。

有趣的是，有时（很少）这可以与有问题的 URL 一样正常工作。

我同时禁用了远程调试。我在 Mac 上工作并使用 iOS 模拟器，但我也验证了问题发生在我的 iPhone 7+ 上。

编辑：我也玩过超时（没有超时= 0，非常高的超时）等等。这没有帮助。我可以看到本地（！）服务器响应非常快。在我的 Postman 测试中，响应时间约为 100 毫秒。

EDIT2：我从来没有遇到过 catch 块或看到任何其他错误。

EDIT3：这是有问题的服务的结果。请注意，它是有效的 JSON 前置和后缀 /* */（历史原因）。就像现在一样，它可以被许多其他客户使用。

/* {
    "result": [{
        "tasks": [{
            "id": xxxx,
            "active": true,
            "complete": false,
            "description": "",
            "estimated": null,
            "lastused_at_ts": 1468263101,
            "completed_at_ts": null,
            "created_at_ts": 1322611200,
            "name": "xxxxxx",
            "projectId": xxxxx,
            "projectName": null,
            "taskCategoryId": 1,
            "taskCategoryName": "xxxx.default",
            "uuid": "xxxxxx-8182-47c2-9cd6-8eff216ee714",
            "taskCategory": {
                "id": null,
                "name": "xxxx.default"
            },
            "createdAt": "16.01.1970 07:23",
            "lastUsed": 1468263101,
            "completedAt": "20.04.2018 09:47"
        },
                 ....],
        "times": null,
        "name": "xxxxxx",
        "id": 32,
        "comment": "xxxxx",
        "uuid": "xxxxx-3a00-4e1d-82a1-e72318d5df3f",
        "createdAt": "16.01.1970",
        "active": false
    }, 
               ...
} */

在我添加 ... 的地方，还有更多数据行。输出通常不是很漂亮，它是单行。

什么可能导致这个问题？

Answer 1

您目前拥有timeout 或6000。可能发生的情况是更大的请求（100kb）需要更长的时间才能解决。尝试增加超时。

此外，您应该添加链 .catch() 子句，因为您可以 console.error() 这样的东西来帮助调试它们。