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

O WebSocket não aparece no Toolkit do navegador nem emite o alert indicando a promoção

Boa noite.

Meu código cadastra a promoção, mas não há nenhum alerta indicando que a promoção foi cadastrada. Na ferramenta do desenvolvedor do Google Chrome também não aparece o Websocket.

app.js

var app = require ('./config/express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);

app.set('io',io);

http.listen(3000,function(){
    console.log("servidor rodando");
});

promocoes.js

app.post("/promocoes",function(req,res){
        var promocao = req.body;
        console.log(promocao);
        app.get('io').emit('novaPromocao',promocao);
        res.redirect('promocoes/form');
    });

index.ejs

<script src="/socket.io/socket.io.js"></script>
        <script>
            var socket = io();
            socket.on('novaPromocao',function(data){
            alert("Livro em promocao "+data.livro.id);
        });
    </script>

Não entendi o que está acontecendo. Alguém pode me ajudar? Obrigada.

7 respostas

Olá Cássia, tudo bom?

Pode colocar este código no seu arquivo do servidor, para testarmos se a conexão do usuário está realmente criando o socket?

io.on('connection', function(socket){
  console.log('Opa, usuário conectado!');
  socket.on('disconnect', function(){
    console.log('Usuário desconectado :(');
  });
});

Estou com o mesmo problema, inclusive baixei o projeto da aula 8 e tive o mesmo problema. Não aparece nada na aba WS do chrome dev tools, e na aba Doc o status é 304. No terminal tá tudo OK e no console do chrome também, nenhuma mensagem de erro ou algo semelhante.

No caso, você fala em colocar esse trecho de código no script do arquivo index.ejs? Fiz assim:

index.ejs

<script src="/socket.io/socket.io.js"></script>
        <script>
            var socket = io();
            //socket.on('novaPromocao',function(data){
            //alert("Livro em promocao "+data.livro.id);
            io.on('connection', function(socket){
                console.log('Opa, usuário conectado!');
                socket.on('disconnect', function(){
                console.log('Usuário desconectado :(');
            });
        });
    </script>

Mas continua na mesma.

solução!

Pessoal boa noite.

Consegui resolver o meu problema colocando o meu script no form de cadastro de promoções, e não no index. Aí, o alert apareceu normalmente. form.ejs

<html>
    <body>
        <form action='/promocoes' method="post">
        <div>
            <input type="text" name="mensagem"/>
        </div>
        <div>
            <select name="livro[id]">
                <%for(var i=0;i<lista.length;i++){%>
                    <option value="<%=lista[i].id%>"><%=lista[i].titulo%></option>
                <%}%>
            </select>
        </div>
        <input type="submit" value="Cadastrar promoção"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>
        <script>
            var socket = io();
            //var socket = new io.Socket('localhost',{'port':3000});
            socket.connect();
            console.log(socket);
            socket.on('novaPromocao',function(data){
                alert("Livro em promocao "+data.livro.id);
            });
        </script>
    </body>
</html>

Cássia, o código da tag script tem que estar no arquivo onde o código que ele possui vai ser executado. Tente extrair o script para um arquivo script.js e faça a inclusão dele em todas as páginas, assim evita alguns erros :)

E o código que eu passei, fica no arquivo do Node dentro de onde você criou a rota.

io.on('connection', function(socket){
  console.log('Opa, usuário conectado!');
  socket.on('disconnect', function(){
    console.log('Usuário desconectado :(');
  });
});

Assim como a Cássia respondeu, também consegui resolver colocando o