关于socket.emit()的用法
发布于 11 年前 作者 ggaaooppeenngg 27680 次浏览 最后一次编辑是 8 年前

我在《nodejs入门经典》看到一段代码 ##//HTML

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Socket.io Express Example</title>
  </head>
  <body>
    <h1>Socket.io Express Example</h1>
    <form id="set-nickname">
      <label for="nickname">Nickname:</label>
      <input type="text" id="nickname" />
      <input type="submit" />
    </form>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script>
      var socket = io.connect();
      jQuery(function ($) { 
        var nickName = $('#nickname');
        var setNicknameForm = $('#set-nickname');
        setNicknameForm.submit(function(event) {
          event.preventDefault(); 
          socket.emit('nickname', nickName.val(), function (data) {
            if (data) {
              console.log('Nickname set successfully');
              setNicknameForm.hide();
            } else {
              setNicknameForm.prepend('<p>Sorry - that nickname is already taken.');
            }
          });
        });
      });
    </script>
  </body>
</html>

##//app.js

var app = require('express').createServer(),
    io = require('socket.io').listen(app),
    nicknames = [];

app.listen(3000);

app.get('/', function (req, res) {
  res.sendfile(__dirname + '/index.html');
});

io.sockets.on('connection', function (socket) {
  socket.on('nickname', function (data, callback) {
    if (nicknames.indexOf(data) != -1) { 
      callback(false);
    } else {
      callback(true);
      nicknames.push(data);
      socket.nickname = data;
      console.log('Nicknames are ' + nicknames);
    }
  });
  socket.on('disconnect', function () {
    if (!socket.nickname) return;
    if (nicknames.indexOf(socket.nickname) > -1) {
      nicknames.splice(nicknames.indexOf(socket.nickname), 1);
    }
    console.log('Nicknames are ' + nicknames);
  });
});

###在HTML中

socket.emit('nickname', nickName.val(), function (data) {
            if (data) {
              console.log('Nickname set successfully');
              setNicknameForm.hide();
            } else {
              setNicknameForm.prepend('<p>Sorry - that nickname is already taken.');
            }

第三个参数是不是向服务器传了一个参数？

###在app.js中

socket.on('nickname', function (data, callback) {
    if (nicknames.indexOf(data) != -1) { 
      callback(false);
    } else {
      callback(true);
      nicknames.push(data);
      socket.nickname = data;
      console.log('Nicknames are ' + nicknames);
    }

给传进的函数给上参数，但是这个函数不是应该在服务器端执行的么？ 为什么用的是DOM的方法，在客户端执行了呢？ 这个callback是怎么回事？

4 回复

app.js中的callback(true)对应的就是html中的function (data)，你可以把app.js中的callback(true)改为callback({name: ‘xiaoshan’}); html的function (data)中打印data.name，输出的就是xiaoshan

那为什么不把name这个参数传回去，而要在服务器调用这个函数呢？

  socket.on('nickname', function (data, callback) {
    if (nicknames.indexOf(data) != -1) { 
      callback(false);
    } else {
      callback(true);
      nicknames.push(data);
      socket.nickname = data;
      console.log('Nicknames are ' + nicknames);
    }
  });

是上边的代码在起作用, 看了半天才找到原来官网上有给例子的

Sending and getting data (acknowledgements). – http://socket.io/#how-to-use

@ggaaooppeenngg 这是个回调，至于是返回true或false，或者其他数据，完全由你控制。比如你需要在提交成功时返回一个只有服务端才能拿到的数据，那这个方法就很有用了

回到顶部