15
respostas

Problema ao Tentar Salvar o Placar com Post

Olá,

Estou com problemas para fazer funcionar o código baseado na aula do capítulo 5 do curso de jQuery Parte 2.

Ao executar o comando post, nada acontece no terminal do navegador, o arquivo placar é limpo e fica vazio, e no terminal do linux é retornada a seguinte mensagem: "[TypeError: Cannot read property '_id' of undefined]".

O que é possível fazer para resolver este problema?

15 respostas

Você tem que conferir duas coisas:

  • Sua variável que guarda o elemento da busca está declarado/inicializado no escopo da função ou fora dela?

  • Você conferiu se a variável está retornando/recebendo o valor que você espera? ( use o console.log para fazer isso )

  • O elemento em questão existe na hora da declaração?

Se tudo isso estiver conferido, manda o seu codigo aqui pra gente tentar te ajudar :)

  • A variável que guarda os dados está declarada dentro da função onde é executado o post.

  • Eu conferi todos os resultados das variáveis através do console, e está tudo correto, todos os valores esperados foram exibidos. O problema ocorre apenas ao tentar salvar os dados com a função post. O objeto dados que é passado como parâmetro no método post retorna com os valores corretos no console, então acredito que não seja problema na variável em sí, e nem em seus dados.

--

Segue meu código:

$("#botao-frase").click(geraFraseAleatoria);
$("#botao-id").click(buscaFrase);
$("#botao-sync").click(sincronizaEstatisticas);

//Utilizando função em Ajax para fazer requisição e trazer dados de maneira assíncrona
function geraFraseAleatoria(){

    $("#spinner").toggle();

    $.get("http://localhost:3000/frases", trocaFraseAleatoria)
    .fail(function(){
        $("#erro").toggle();
        setTimeout(function(){
            $("#erro").toggle();
        }, 1500);
    })
    .always(function(){
        $("#spinner").toggle();
    });
}

//Troca a frase aleatóriamente de acordo com as frases armazenados no array no arquivo frases.js
function trocaFraseAleatoria(data){
    var frase = $(".frase");
    var numero_aleatorio = Math.floor(Math.random() * data.length);
    frase.text(data[numero_aleatorio].texto);
    atualizaTempoInicial(data[numero_aleatorio].tempo);
    atualizaTamanhoFrase();
}

function buscaFrase(){
    $("#spinner").toggle();
    var fraseId = $("#frase-id").val();
    var data = {id: fraseId};
    $.get("http://localhost:3000/frases", data, trocaFrase)
    .fail(function(){
        $("#erro").toggle();
        setTimeout(function(){
            $("#erro").toggle();
        }, 2000)
    })
    .always(function(){
        $("#spinner").toggle();
    });
}

function trocaFrase(data){
    var frase = $(".frase");
    frase.text(data.texto);
    atualizaTamanhoFrase();
    atualizaTempoInicial();
}

function sincronizaEstatisticas(){
    var estatisticas = [];
    var linhas = $("tbody>tr")
    linhas.each(function(){
        var usuario = $(this).find("td:nth-child(1)").text();
        var palavras = $(this).find("td:nth-child(2)").text();

        var obj_estatisticas = {
            usuario: usuario,
            palavras: palavras
        }

        estatisticas.push(obj_estatisticas);

    });

    var dados = {
        estatisticas: estatisticas
    };

    console.log(dados);

    $.post("http://localhost:3000/placar", dados, function(){
        console.log("Salvou!");
    });

}

Ao tentar executar o comando abaixo

$.post("http://localhost:3000/placar", dados, function(){ console.log("Salvou!"); });

é exibida a seguinte mensagem no terminal do sistema

[TypeError: Cannot read property '_id' of undefined]

e a mensagem "Salvou!" que deveria aparecer no console do navegador não aparece.

Ok. Eu olhei o curso aqui e voce está usando o NodeJS para receber estes dados. Esse parece ser um erro de parseamento das variáveis recebidas no servidor.

Abre o prompt do NodeJS ( se estiver no windows ) ou o terminal ( Ubuntu e macOs), caminha até a pasta que tem o package.json e faça o comando

npm install

Verifica se ele está dando algum erro.

Este erro que você está tendo geralmente é exibido por causa do BodyParser que pode não estar instalado no server-side

Quando isso acontece, o servidor devolve o erro pro Browser.

Verifica essa informação e manda de volta pra gente ver se resolve :)

  • Eu executei o comando npm install dentro da pasta do servidor onde o arquivo package.json está localizado, e é retornado a seguinte mensagem no terminal: "npm WARN AluraTyper@1.0.0 No repository field."

  • Após isso eu tentei novamente executar o método post, mas nada mudou. Continua com o mesmo erro no terminal ao tentar executar.

Pode ser a falta de suporte para o plugin. Eu baixei os arquivos e não funcionaram também

Volta lá no prompt do nodeJS e faz um npm update

Ele deve te retornar isso aqui, jutnoc om outras coisas:

+-- body-parser@1.18.2
+-- consign@0.1.6
+-- express@4.16.2

Depois levanta o servidor de novo e fala pra gente o que rolou

Executei o comando npm update no terminal e retornou várias linhas, mas das que você citou, apenas as linhas:

consign@0.1.6 
express@4.16.2

A linha body-parser@1.18.2 não retornou.

Ainda assim, tentei executar novamente o método post, mas nada mudou. Continua com o mesmo erro.

Você tem como upar seu código e me passar o link pra eu analisar aqui?

Manda ele no google drive ou algum outro lugar pra eu dar uma olhada

Eu tenho o projeto salvo nesse repositório:

https://github.com/tzanarde/jQuery-Typer

Eu fiz o download do projeto final do curso, disponibilizado pelo instrutor e funciona normalmente o método post.

Inclusive eu executei o comando npm update e retornou as três linhas que você havia citado, inclusive o body-parser@1.18.2.

Acredito que eu deva ter deixado passar alguma coisa durante o curso.

Realmente é o body-parser

Navega até a pasta do servidor pelo cmd do NodeJS e executa o seguinte comando

npm install --save body-parser

Não deixa de avisar se deu certo!

Não deu certo.

Eu executei o comando na pasta, mas continua retornando o mesmo erro.

Pesquisei a respeito e disseram que o problema de não conseguir instalar o body-parser poderia ser em relação ao repositório, então segui esse tutorial, visto que tem muitos likes, mas nada feito. Continuo com o mesmo problema.

Você conseguiu executar com os fontes que te passei?

Sim. Eu usei seu código pra fazer a execução do game. Antes de atualizar o body parser, ele tava dando o erro "[TypeError: Cannot read property '_id' of undefined]"

Depois que eu atualizei, ele parou. Eu vou fazer o seguinte. Vou subir a pasta servidor aqui e você coloca ela no seu projeto e ve. A únca coisa que eu fiz foi instalar o bodyparser. Eu lembro que o body parser tinha parado de funcionar um tempo quando eu tava mexendo com um projeto Meteor de uma empresa. A atualização era obrigatória.

https://drive.google.com/file/d/1rOef46KaUYGMf_LZMbo7l8qyOYE_3ZYa/view?usp=sharing

Ai tem a pasta servidor inteira com o body-parser atualizado

Legal pessoal!!

Substitui a pasta servidor e mesmo assim não funcionou. Tentei executar os comandos de instalação e atualização do npm, mas continua da mesma maneira.

Estava dando uma pesquisada e vi que pode dar problemas relacionados ao proxy, e na rede que estou trabalhando nos conectamos através de um proxy. Tentei realizar a configuração do mesmo seguindo alguns tutoriais como este e este, mas mesmo assim não funcionou.

Vou fazer o seguinte: Vou testar em uma rede sem proxy quando chegar em casa para ver se realmente pode ser isso, pois talvez eu não tenha configurado o proxy devidamente. Após isso eu retorno com as informações.

Por enquanto agradeço muito sua ajuda Allan.

Pode ser um proxy que está bloquando o link externo mesmo. Faça os testes em casa e retorna pra gente saber o que rolou!

Mas lembra de tirar os códigos de proxy de lá pra não dar conflito na sua máquina sem proxy

Precisando de ajudar, estamos aqui!!!