Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

requisição XMLHttpRequest retorna undefined

Olá,

Eu não estou conseguindo fazer com que o meu método/função carregaItem(itemId) retorne um objeto...alguém pode me ajudar?

Usando o código abaixo o método carregaItem retorna undefined...

var ic = new ItemController();
ic.carregaItem(70);
class ItemController {

     ....
    carregaItem(itemId) {
        var getText = function(url, callback) {
            var request = new XMLHttpRequest();
            request.onreadystatechange = function() {
                if (request.readyState == 4 && request.status == 200) callback(request.responseText); 
            };
            request.open('GET', url);
            request.send();
        }
        function mycallback(data) {
            return JSON.parse(data);
        }
        return getText("http://172.16.18.80:8081/api/aa/v1/itens/" + itemId, mycallback);
    }
}
4 respostas

Você viu esse código na aula?

As requisições ajax são assincronas e você deve ou usar promises ou capturar o valor com os callbacks.

Com promises você pode fazer assim:

carregaItem(itemId) {
        var getText = function(url, callback) {
            var request = new XMLHttpRequest();
            request.onreadystatechange = function() {
                if (request.readyState == 4 && request.status == 200) callback(request.responseText); 
            };
            request.open('GET', url);
            request.send();
        }
        function mycallback(data) {
            return JSON.parse(data);
        }
        return Promise.resolve(getText("http://172.16.18.80:8081/api/aa/v1/itens/" + itemId, mycallback));
    }

Sua chamada ficaria assim

ic.carregaItem(70).then((json) => ...seu retorno está aqui...).catch(() => ...deu erro...)

Outra maneira seria passar um callback para o carregaItem

ic.carregaItem(70, (json) => ...retorno aqui...)

Bom dia Edgar,

Esse código não está no curso, eu postei porque achei que o problema se encaixa no conteúdo da aula.

Eu não sou programador javascript, eu só "quebro o galho" aqui na empresa...

Eu usei o seu código mas ao dar um console.log no then() ele imprime undefined..... e me parece que eu não posso usar o return dentro do then por ser um código assíncrono...mas o console.log eu acho que "cabe" em um código assíncrono certo? O que eu fiz de errado? Eu só queria que o carregaItem me retornasse um objeto...

let ic = new ItemController();

    ic.carregaItem(70)
        .then((json) => console.log(json)) // imprime undefined
        .catch((erro) => console.log(erro));

Eu também tentei fazer da forma abaixo mas não deu certo:

let ic = new ItemController();
    let item;
    ic.carregaItem(70)
        .then((json) => doSomething(json))
        .catch((erro) => console.log(erro));

        function doSomething(json) {
            item = json;
        }
        console.log(item);
solução!

Estranho... Enfim tenta assim, fiz de uma forma mais simples:

carregaItem(itemId, callback) {
    const url = `http://172.16.18.80:8081/api/aa/v1/itens/${itemId}`;
    let request = new XMLHttpRequest();
    request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status == 200)         
        callback(JSON.parse(request.responseText)); 
    };
    request.open('GET', url);
    request.send();
}

ai você chama já passando o callback:

ic.carregaItem(70, (data) => { console.warn(data) });

Faça uns cursos de Javascript aqui no alura com o Prof. Calopsita. Vale a pena.