После GET запроса страница полностью зависает

Question

Нашел api для вывода данных с кинопоиска, он работал на другой машине (на ноуте, работал через оперу), но когда пересел на свой комп (работаю через Яндекс браузер), у меня сразу все стопится после попытки сделать GET запрос, не понимаю почему так происходит.

Самое еще что забавное, у меня почему-то после одной проверки все заработало, я смог вывести результат, но после перезагрузки страницы (со сбросом кэша), у меня все равно в дальнейшем перестал работать. Также проверил на других браузерах, везде работало, но вот в яндексе просто отказывается работать.
Код запроса:

var inputName;
    var inputYear;
    var data;

    if (!name) inputName = document.getElementById("name").value;
    else inputName = name;
    if (!year) inputYear = document.getElementById("year").value;
    else inputYear = year;

    var request = new XMLHttpRequest();

    let search = encodeURI("keyword=" + inputName + "&page=1");
    request.open("GET", "http://kinopoiskapiunofficial.tech/api/v2.1/films/search-by-keyword?" + search, false);
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    request.setRequestHeader("X-API-KEY", "cf1fb679-cc1c-43c2-ba84-36f615f6cec2");

    //let send = "keyword=%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B0%20%D1%81%D0%B0%D0%B4%D0%BE%D0%B2&page=1";
    //request.send(send);

    request.send();
    if (request.status == 200) {
        data = JSON.parse(request.responseText);
        console.log("sch");
        console.log(data.films);
        /* let i = 0;
        while (i < data.genres.length) {
            data["fullGenres"] += data.genres[i].genre;
            i++;
            if (i != data.genres.length) data["fullGenres"] += ", ";
        }
        i = 0;
        while (i < data.countries.length) {
            data["fullCountries"] += data.countries[i].country;
            i++;
            if (i != data.countries.length) data["fullCountries"] += ", ";
        } */
        //data = request.responseText;
        //console.log(data);
        DisplaySearchKP(data);
    }

Answer 1

Страница не зависает, страница просто не дожидается результата запроса. Поскольку JS - однопоточный язык, в нём метод .send() возвращает управление сразу же, а не ждёт ответа сервера.

Для получения ответа вам надо подписаться на событие и продолжить обработку при его получении:

oReq.addEventListener("load", function() {
    var data = JSON.parse(request.responseText);
    // ...
});

Кстати, не забудьте про обработку ошибок (событие error). А ещё посмотрите в сторону Fetch API и асинхронных функций (доступны в современных браузерах, но не доступны в IE):

async function ExecuteSearchKP() {
    const resp = await fetch(...);
    const data = await resp.json();
    // ...
}

БЛОГ НА HUSL

После GET запроса страница полностью зависает

Ответы (1 шт):