Код не возвращает данные из JSON файла

29 сентября 2021, 05:10

Проходя курс по JS столкнулся с проблемой во время использования Promise вместо обычных callback функций.

Дело в том, что значение из json файла не возвращается от resolve()

let inputRub = document.getElementById('rub'),
    inputUsd = document.getElementById('usd');

function calculate(input){
    input.addEventListener('input', () => {
        function convert() {
            return new Promise (function(resolve, reject) {
                let request = new XMLHttpRequest();
                request.open('GET', 'js/current.json');
                request.setRequestHeader('Content-type', 'application/json; charset=utf-8');
                request.onreadystatechange = function () {
                    if (request.readyState === 4 && request.status == 200) {
                        resolve()
                    } else {
                        reject()
                    }
                }
                request.send()
            })
        } //End covert
        convert()
            .then(() => {
                let data = JSON.parse(request.response); 
                inputUsd.value = inputRub.value / data.usd;
            })
            .catch(() => inputUsd.value = "Что-то пошло не так!")
    });
}
calculate(inputRub);

Ошибок в консоли нет, во вкладке Network возвращает 304

Слышал проблему, что это происходит из-за того что браузер кэширует данные и не происходит их изменения, но это ни о чём не сказало, так как начав гуглить про то, как убрать кэширование браузером - там речь идёт совсем о других моментах.

Если же добавить

let data = JSON.parse(request.response); 
inputUsd.value = inputRub.value / data.usd;

во внутрь функции convert() вместо resolve() - то оно будет нормально конвертировать, но я так понимаю, смысл в том чтобы использовать именно конструкцию внизу

Answer 1

Вот так перепишите и должно заработать:

request.onreadystatechange = function () {
          if (request.readyState === 4 && request.status == 200) {
                   resolve(request.response)
          } else {
                   reject(null)
          }
 }

А вызов convert вот так:

convert().then((resp) => {
                let data = JSON.parse(resp); 
                inputUsd.value = inputRub.value / data.usd;
            })
            .catch(() => inputUsd.value = "Что-то пошло не так!")
    });