Javascript GET не получает весь файл JSON - PullRequest
Новая
       36

Javascript GET не получает весь файл JSON

0 голосов
/ 29 октября 2019

У меня есть, как я полагаю, большой JSON-файл, в котором мой код JavaScript не загружает все данные. Я знаю это, потому что на вкладке «Сеть» инструментов разработчика в FireFox говорится, что он получает маркер конца данных, например, 57,301, но в файле содержится 528,342 строки JSON.

Я пытался просто извлечь, но сохранилполучение ошибок об 'ожидании', необходимом для использования асинхронно, но я не знаю, как работают асинхронные функции. В моем запросе xmlhttp я установил флаг async в 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, который не такой большой, вероятно, 10000 строк. Как я могу заставить это работать с файлом JSON, намного большим, более 500 000 строк?

1 Ответ

0 голосов
/ 30 октября 2019

Независимо от размера 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.

Для очень больших файлов может потребоваться просмотр потоков. API-интерфейс Fetch, кажется, действительно поддерживает это, см. пример использования: https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams

...