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

parametros do proxy

class HttpService {

    get(url) {

        return new Promise((resolve, reject) => {


            let xhr = new XMLHttpRequest();

            xhr.open('GET', url);

            xhr.onreadystatechange = () => {

                if(xhr.readyState == 4) {

                    if(xhr.status == 200) {   

                        resolve(JSON.parse(xhr.responseText));  
                    } else {

                        reject(xhr.responseText);
                    }
                }
            };

            xhr.send();


        });
    }

    post(url, dado) {


            return new Promise((resolve, reject) => {

                let xhr = new XMLHttpRequest();
                xhr.open("POST", url, true);
                xhr.setRequestHeader("Content-type", "application/json");
                xhr.onreadystatechange = () => {

                    if (xhr.readyState == 4) {

                        if (xhr.status == 200) {

                            resolve(JSON.parse(xhr.responseText));
                        } else {

                            reject(xhr.responseText);
                        }
                    }
                };
                xhr.send(JSON.stringify(dado)); // usando JSON.stringifly para converter objeto em uma string no formato JSON.
            });

        }
}

ola, revendo o codigo me pintou uma duvida, quando e chamado resolve um valor e retornado e retornado ne , no caso esse json, mas para receber os dados da requisiçao eu preciso fazer aquele send no final, como o resolve obtem os dados antes do send?

2 respostas
solução!

Olá Luan, tudo bem com você?

A questão é que esse código não pode ser lido de maneira procedural, na verdade o que acontece é que a ordem de execução é a seguinte:

  • Atribuímos uma função para cada mudança do xhr
  • executamos o xhr.send

Após isso começam então a chamada do onreadystatechange, para ficar mais claro o que podemos fazer é adicionar alguns console.logs para ficar mais claro:

  • O primeiro após o xhr.send:
console.log("Executando o Send");
  • O segundo dentro do onreadystatechange, mas para isso crie uma variável estática com o nome numeroDeChamadas, ficando da seguinte forma:
class HttpService {
    static chamadas = 0;

            xhr.onreadystatechange = () => {
           console.log("Chamada número: "+ HttpService.chamadas++)
                if(xhr.readyState == 4) {

                    if(xhr.status == 200) {   

                        resolve(JSON.parse(xhr.responseText));  
                    } else {

                        reject(xhr.responseText);
                    }
                }
            };

            xhr.send();
        console.log("Chamando o Send");
        });

E ai podemos ver que o resultado será o seguinte:

Executando o Send 
Chamada número: 0 
Chamada número: 1 
Chamada número: 2

Ou seja, o nosso código não executa uma função, ao chegar na linha do onreadystatechange, apenas definimos o que iremos fazer, e então, enviamos a requisição, feito isso para mudança de estado do xhr verificamos se é o estado que queremos, caso seja, ai sim iremos entrar e devolver a resposta para o nosso usuário :)

Conseguiu compreender ?

Abraços e Bons Estudos!

obrigado pelo detalhe da explicaçao cara, entendi sim.