Entrar Ainda não tem acesso?
7
respostas

Necessidade de fazer o JSON.stringify

Referente ao curso Node.js: Inovando com Javascript no backend

por Kelvin Weslley Nunes Feitosa
| 55.1k xp | 4 posts
Analista TI B

Quando criei o arquivo "home.js" com a rota da página "index.ejs", foi necessário eu utilizar o JSON.stringify no retorno do SQL para a página HTML, conforme abaixo:

module.exports = function(app) {
    app.get('/', function(request, response, next) {
        var connection  = app.infra.connectionFactory();
        var produtosDAO = new app.infra.ProdutosDAO(connection);
        produtosDAO.listar(function(error, results) {
            if (error) {
                return next(error);
            };
            response.render('home/index', {livros : JSON.stringify(results)});
        });
        connection.end()
    });
};

Se eu não colocá-lo, dá o seguinte erro:

TypeError: /home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/app/views/home/index.ejs:93
   91|         <li class="col-left">
   92|             <a href="linkDetalhe" class="block clearfix">
>> 93|                 <img width="170" height="240" src="urlImagem" alt="<%=livros[i].titulo%>" title="<%=livros[i].titulo%>"/>
   94|
   95|                 <h2 class="product-title"><%=livros[i].titulo%></h2>
   96|                 <small class="buy-button">Lan&#231;amento!</small>

Cannot read property 'titulo' of undefined
   at eval (eval at <anonymous> (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/ejs/lib/ejs.js:495:12), <anonymous>:14:32)
   at returnedFn (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/ejs/lib/ejs.js:524:17)
   at View.exports.renderFile [as engine] (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/ejs/lib/ejs.js:378:31)
   at View.render (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/express/lib/view.js:126:8)
   at tryRender (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/express/lib/application.js:639:10)
   at EventEmitter.render (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/express/lib/application.js:591:3)
   at ServerResponse.render (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/express/lib/response.js:960:7)
   at Query._callback (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/app/routes/home.js:10:22)
   at Query.Sequence.end (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/sequences/Sequence.js:86:24)
   at Query._handleFinalResultPacket (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/sequences/Query.js:144:8)
   at Query.EofPacket (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/sequences/Query.js:128:8)
   at Protocol._parsePacket (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/Protocol.js:280:23)
   at Parser.write (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/Parser.js:74:12)
   at Protocol.write (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/protocol/Protocol.js:39:16)
   at Socket.<anonymous> (/home/kelvinwnfeitosa/Documentos/Projetos/casa-do-codigo/node_modules/mysql/lib/Connection.js:109:28)
   at emitOne (events.js:77:13)

Identifiquei que o formato que o SQL está retornando vem com o objeto "RowDataPacket", por isso a necessidade de utilizar o JSON.stringify.

Só que ná rota do arquivo "produtos.js" o erro não acontece sem o JSON.stringify, conforme abaixo:

module.exports = function(app) {

    app.get('/produtos', function(request, response, next) {
        var connection  = app.infra.connectionFactory();
        var produtosDAO = new app.infra.ProdutosDAO(connection);
        produtosDAO.listar(function(erros, results) {
            if (erros) {
                return next(erros);
            };
            response.format({
                html : function() {
                    response.render('produtos/lista', {lista : results});
                },
                json : function() {
                    response.json(results);
                }
            });
        });
        connection.end();
    });

Alguém sabe me dizer o porquê do erro e porque as vezes é necessário utilizar o JSON.stringify e outras vezes não?

7 respostas
por Alberto Souza
| 2676.6k xp | 5740 posts
Instrutor Desenvolvedor e Instrutor

O engraçado é que o erro é que vc ta tentando acessar uma variável que não está definida.. essa parte do código parece que é aquela onde vc mostra os destaques.. vc tem 3 livros cadastrados? caso não tenha, esse pode ser o erro.

por Kelvin Weslley Nunes Feitosa
| 55.1k xp | 4 posts
Analista TI B

Tenho todos os livros cadastrados, segui passo a passo a aula. Coloquei um console log na variável "results", nos dois exemplos e foi exibido a informação abaixo em ambos os casos:

[ RowDataPacket {
    id: 1,
    titulo: 'Indo além com JavaScript',
    descricao: 'JavaScript avançado',
    preco: 39.9 } ]

Acontece que no segundo exemplo a variável não fica "undefined" como no primeiro exemplo. De alguma forma no segundo exemplo ele consegue converter a variável acima e no primeiro não, só não consegui identificar o porquê disso acontecer.

por Alberto Souza
| 2676.6k xp | 5740 posts
Instrutor Desenvolvedor e Instrutor

No segundo exemplo ele só vai até o length do array, por isso não da problema.

por Kelvin Weslley Nunes Feitosa
| 55.1k xp | 4 posts
Analista TI B

Não, no segundo exemplo, exibo as mesmas informações, conforme trecho abaixo, e ele executa normalmente.

<html>
    <body>
        <table border = "1px">
            <tr>
                <td>id</td>
                <td>Nome</td>
                <td>Descrição</td>
                <td>Preço</td>
            </tr>
            <%for(var i = 0; i < lista.length; i++) {%>
                <tr>
                    <td><%=lista[i].id%></td>
                    <td><%=lista[i].titulo%></td>
                    <td><%=lista[i].descricao%></td>
                    <td><%=lista[i].preco%></td>
                </tr>
            <%}%>
        </table>
    </body>
</html>
por Alberto Souza
| 2676.6k xp | 5740 posts
Instrutor Desenvolvedor e Instrutor

Então, se tiver igual no exercício, no primeiro o for vai até o índice 3 e no segundo até o length do array.. o segundo vai funcionar sempre.. o primeiro só se tiver no mínimo três elementos no array.

por Kelvin Weslley Nunes Feitosa
| 55.1k xp | 4 posts
Analista TI B

Descobri o erro! No primeiro exemplo o arquivo "home.ejs" não verificar a atributo "length" da variável livros, e crava 3 (três) registros conforme o trecho abaixo:

<ul id="home-highlight-collection">
        <%for(i=0; i<3; i++) {%>
        <li class="col-left">
            <a href="linkDetalhe" class="block clearfix">
                <img width="170" height="240" src="urlImagem" alt="<%=livros[i].titulo%>" title="<%=livros[i].titulo%>"/>

                <h2 class="product-title"><%=livros[i].titulo%></h2>
                <small class="buy-button">Lan&#231;amento!</small>
            </a>
        </li>
        <%}%>
    </ul>

Na minha base tenho apenas um livro, por isso que o erro acontece, corrigi para que verificasse o tamanho da lista e funcionou perfeitamente. Só não entendi ainda porque convertendo o resultado com JSON.stringify o erro parou de acontecer.

por Alberto Souza
| 2676.6k xp | 5740 posts
Instrutor Desenvolvedor e Instrutor

Quando vc usou o stringify, as informações apareceram corretamente, é isso? Pq seria estranho mesmo :(.