Entrar Ainda não tem acesso?
1
resposta

Resultado diverso

Referente ao curso JavaScript: programando na linguagem da web, no capítulo AjaxBuscando pacientes com AJAX e atividade Capturando erros de requisição

por Estudante
| 105.6k xp | 121 posts

Fiz exatamente o que professor fez, mas o resultado no console foi diferente tanto no MS Edge quanto no Firefox.

Meu js:

var botaoBuscar = document.getElementById("buscar-paciente");

botaoBuscar.addEventListener("click",function(){
    var xhr = new XMLHttpRequest();

    xhr.open("get","https://raw.githubusercontent.com/loresgarcia/Pacientes-API/master/pacientes111111.json"); // abrir a requisição
    xhr.addEventListener("load",function(){
        let resposta = xhr.responseText;
        let pacientes = JSON.parse(resposta);

        if (xhr.status == 200) {
            pacientes.forEach(function(paciente){
                adicionaPacienteNaTabela(paciente);
            });
        } else {
            console.log(xhr.status);
            console.log(xhr.responseText);
        }
    });
    xhr.send(); //envia a requisição

});

O resultado no console é esse: 

15:33:34.481
XHRGEThttps://raw.githubusercontent.com/loresgarcia/Pacientes-API/master/pacientes111111.json
[HTTP/2 404 Not Found 304ms]

15:33:34.761
Uncaught SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 1 column 4 of the JSON data
    <anonymous> file:///B:/OneDrive/Documentos/Alura/introducao-javascript/js/buscar-paciente.js:9
    EventListener.handleEvent* file:///B:/OneDrive/Documentos/Alura/introducao-javascript/js/buscar-paciente.js:7
    EventListener.handleEvent* file:///B:/OneDrive/Documentos/Alura/introducao-javascript/js/buscar-paciente.js:3

Fiz algo de errado ou foi alguma atualização nos navegadores que fez com que eles tratem o erro de forma diferente? Por que a segunda parte do if não foi executado?

1 resposta
por Rafael Rocha
| 2641.1k xp | 5598 posts
Alura Scuba Team Time Alura | Apoio Educacional no Fórum

Olá Renan, tudo bem com você?

O erro apresentado está informando que não foi possível realizar uma requisição devido a url não ter sido encontrada. Na função open() foi fornecido uma url que possui um erro de digitação, no final do caminho foi adicionado múltiplos números um (111111) fazendo com que a url seja inválida.

Peço copie a url disponibilizada abaixo e substitua a utilizada na função open(), no arquivo buscar-pacientes.js

"https://raw.githubusercontent.com/loresgarcia/Pacientes-API/master/pacientes.json"

Após a mudança, salve o arquivo buscar-pacientes.js. Abra o arquivo Index.html no navegador e clique no botão . E verifique se os novos pacientes serão carregados.

Código completo com a mudança aplicada

var botaoBuscar = document.getElementById("buscar-paciente");

botaoBuscar.addEventListener("click",function(){
    var xhr = new XMLHttpRequest();

    xhr.open("get","https://raw.githubusercontent.com/loresgarcia/Pacientes-API/master/pacientes.json"); // abrir a requisição
    xhr.addEventListener("load",function(){
        let resposta = xhr.responseText;
        let pacientes = JSON.parse(resposta);

        if (xhr.status == 200) {
            pacientes.forEach(function(paciente){
                adicionaPacienteNaTabela(paciente);
            });
        } else {
            console.log(xhr.status);
            console.log(xhr.responseText);
        }
    });
    xhr.send(); //envia a requisição

});

Espero ter lhe ajudado. Em caso de dúvidas estou à disposição.

Não hesite em voltar ao fórum para continuar aprendendo e interagindo com a comunidade.

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!