【问题标题】:Javascript GET not getting entire json fileJavascript GET没有获取整个json文件
【发布时间】:2019-10-29 19:54:42
【问题描述】:

我有,我认为是大型 JSON 文件,其中我的 javascript 代码没有提取所有数据。我知道这一点是因为在 FireFox 的开发人员工具的 Network 选项卡中指出,它在 57,301 处接收到数据结束标记,但文件中有 528,342 行 JSON。

我试图只获取,但我不断收到关于“等待”需要使用异步的错误,但我不熟悉异步函数的工作原理。在我的 xmlhttp 请求中,我将异步标志设置为 false。这是我可以让它与我正在运行的代码一起工作的唯一方法。

我正在拉入具有纬度、经度和高度的 json 对象。我的 JSON 格式如下:

{"points":[
{"lat": 0, "lon": 0},
.
.
.
{"lat": 0, "lon": 0}]}

我的请求是这样编码的

function get_json_data(){
var data = [];
var response = new XMLHttpRequest();
response.onreadystatechange = function(){

     data_points = JSON.parse(this.responseText);
     *** CONVERTING LAT/LON TO ARRAY AND PUTTING INTO DATA ***

});
response.open("GET", "http://url/path/to/json", false);
response.send();

return data;
}

它适用于不是那么大的 JSON 文件,可能有 10,000 行。我怎样才能让它与一个更大的 JSON 文件一起工作,超过 500,000 行?

【问题讨论】:

  • 可能值得在您的代码中添加一个 readyState 检查器,因为 onreadystatechange 处理程序实际上被调用了 4 次......请参阅 this question
  • 另外,如果您可以看到问题发生在浏览器级别,那么问题可能在于您托管 JSON 文件的方式,而不是您的客户端。
  • Read the warning 关于不将 readyStateChanged 用于同步(你在做什么)请求

标签: javascript json coordinate-systems


【解决方案1】:

无论 JSON 大小如何,我认为这样的事情最好异步处理,因为您是从外部源(API、文件系统等)加载它。所以我建议你再试一次fetch()。遗憾的是,由于安全原因,jsbin 和 jsfiddle 不允许我调用外部 API,所以我无法制作交互式演示,但代码应该如下所示:

async function getData() {

    const response = await fetch('<url here>');
    const json = await response.json();

    // Do stuff with JSON

}

========== OR ==========

function getData() {

    fetch('<url here')
        .then(res => res.json())
        .then(data => {
            doStuffWithData(data);
        });

}

Fetch API 基本上会返回一个响应,您需要对此进行处理(例如,检查状态是否为 200 OK,请参阅 https://developers.google.com/web/updates/2015/03/introduction-to-fetch)。在您的情况下,您需要在确保请求成功后将响应转换为 JSON 对象,然后操作该 JSON。

对于非常大的文件,您可能需要查看 Streams。 Fetch API 似乎确实支持这一点,请参见此处的用法示例:https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams

【讨论】:

  • 我试过了,异步的功能对我有用,但我一直收到同样的错误,关于文件的 json 结尾太早了
  • 可能是文件太大而无法一次全部加载到内存中。我认为将文件作为流读取可能会有所帮助。我已经编辑了我的答案以包含参考。
猜你喜欢
  • 2013-07-26
  • 2019-08-20
  • 1970-01-01
  • 1970-01-01
  • 2012-10-27
  • 2016-10-22
  • 1970-01-01
  • 1970-01-01
  • 2016-10-15
相关资源
最近更新 更多