socket.io/?EIO=3&transport=polling&t=1345678不收费

Question

我使用node.js，express和socket.io进行了聊天。这是app.js代码：

var express = require('express'),
    app = express(),
    server = require('http').createServer(app),
    io = require('socket.io').listen(server);

server.listen(process.env.PORT || 8080);



app.use(express.static(__dirname + '/'));


io.on('connection', function(socket){
  socket.on('message sent', function(data){
    io.emit('receive', { msg: data.msg, uname: data.uname, uid: data.uid, uimg: data.uimg });
  });

  socket.on('message sent room', function(data){
    console.log(data.mid);
    io.in(data.uroom).emit('receive', { msg: data.msg, uname: data.uname, uid: data.uid, uimg: data.uimg, mid: data.mid });
  });

  socket.on('join', function(data){
    io.emit('join user', { uname: data.uname, uid: data.uid });
  });

  socket.on('create', function (room) {
    socket.join(room);
  });

});

这是我的haml文件中的代码

  %script{:src => "https://cdn.socket.io/socket.io-1.2.0.js"}

    - if Rails.env.production?
      :javascript
        var socket = io.connect('https://myherokuappurl.herokuapp.com/');
    - else
      :javascript
        var socket = io.connect('http://localhost:8080/');

    :javascript
      var userId = "#{current_user.id}";
      var userName = "#{current_user.name}";
      var userImg = "#{@userImage}";
      var room  = "#{@conversation.id}";
      var messageId = 0;

      $(document).ready(function(){
        socket.emit('create', room);
        $( "#m" ).focus();
        var wtf    = $('.panel-chat');
        var height = wtf[0].scrollHeight;
        wtf.scrollTop(height);
      });

      $('form').submit(function(){
        var message = $('#m').val();
        $.ajax({
          type: "POST",
          url: "#{dashboard_messages_path}",
          dataType : 'json',
          data: {'message' : {'conversation_id': room,
                 'body': message,
                 'user_id': userId} },
          success: function(data) {
            console.log(data.id);
            messageId = data.id;
            socket.emit('message sent room', {msg: $('#m').val(), uname: userName, uid: userId, uimg: userImg, uroom: room, mid: messageId});
            $('#m').val('');
          }
        });
        return false;
      });

      socket.on('receive', function(data){
        var message = '<tr><td class="td-chat"><div class="text-center"><img alt="'+data.uname+'" class="avatar center-block" src="'+data.uimg+'" height="60" width="60"></div></td><td><small><strong>'+data.uname+':<br></strong></small>'+data.msg+'</td></tr>';
        var currentMessageId = data.mid;

        if (data.uid != userId) {
          $.ajax({
              type: "GET",
              url: "#{dashboard_message_read_path}",
            dataType : 'json',
              data: {'message_id':currentMessageId }
            });
        }
        $("#table-chat").append(message);
        var wtf    = $('.panel-chat');
        var height = wtf[0].scrollHeight;
        wtf.scrollTop(height);
      });

      socket.on('join user', function(data){
        if (data.uid != userId) {
           $("#userjoin").text(data.uname + " se ha unido!").show().fadeOut(5000);
        }
      });

但为了完成这项工作，我必须刷新聊天页面。我注意到用户第一次进入聊天页面时，它没有以下文件：

  

https://myherokuappurl.herokuapp.com/socket.io/?EIO=3&transport=polling&t=1xxxxxx-0

或在我的本地机器上

  

http://localhost:8080/socket.io/?EIO=3&transport=polling&t=1xxxxxx-0

所以聊天没有发送消息，而是当你按回车发送消息时，页面刷新，这次我有以下文件，一切都很好。

  

https://myherokuappurl.herokuapp.com/socket.io/?EIO=3&transport=polling&t=1xxxxxx-0

或在我的本地机器上

  

http://localhost:8080/socket.io/?EIO=3&transport=polling&t=1xxxxxx-0

这可能是什么问题，因为这种行为发生在我的localmachine和production。

提前感谢您的帮助。

Answer 1

虽然我认为Bradgnar可能是正确的，但您可能还会遇到加载问题：第一次用户尚未加载cdn资源。但是在进行提交时和页面刷新后，文件会立即加载。如果这是问题，则不执行io.connect命令，因为io尚不存在。将任何实际初始化移至document.ready方法。

Answer 2

我认为问题在于，在您的客户端代码中，您将套接字包装在ajax事件中。您应该只使用事件来发送带有套接字的消息。

正在发生的事情是，在表单提交成功时，您发出的事件是向服务器发送消息。所有这些都在编写时正常工作，但数据流是错误的，因为您不应该进行表单提交。 This post from David Walsh有一个简单的示例和一个可下载的示例拉链，您可以查看/可能正常工作。