Node.js - socket.io 网络应用

Question

我创建了一个基本的 node.js 服务器程序并使用 socket.io 从客户端传递一些字段数据（见下文）。很高兴，因为我是这个行业的新手。我喜欢这种 node-express-socket.io 方法，因为它全部是 Javascript，并且显然可以被大多数浏览器（包括移动设备）使用。问题是我有点摸索，并没有完全理解我创造了什么！两个问题...

1) 我需要使用“//ajax.googleapis.com...jquery...”吗？这很烦人，因为浏览器需要有互联网连接才能工作。是否有另一种无需互联网连接即可访问 html 文档元素的方法？

2) "app.use(express.static...." 行是做什么的？"app.get..." 函数​​似乎需要它才能工作。

如果还有其他关于我的代码的通用 cmets，请告诉我！

干杯，

柯布斯

客户端代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
    var socket = io.connect(document.location.protocol+'//'+document.location.host);
    function clicked(){
        $(function(){
            var makeInput=$('.app').find('#make').val();
            var modelInput=$('.app').find('#model').val();
            socket.emit('make', makeInput);
            socket.emit('model', modelInput);
        });     
    };
</script>

服务器端代码：

var express = require('express');
var http = require('http');
var socketio = require('socket.io');

var app = express();
var server = http.createServer(app);
var io = socketio.listen(server);

app.use(express.static(__dirname));

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

io.sockets.on('connection', function (socket) {
  socket.on('make', function (make) {
    socket.on('model',function (model){
          console.log('recieved message:', make+','+model);  
      });
  });
});
server.listen(8000);

Answer 1

1) 由于您已经设置了一个静态 Web 服务器（参见答案 2），您可以简单地下载 jquery 源并从那里提供 .js 文件。

2) "app.use(express.static...." 配置静态网络服务器并将 http 根目录设置为 node.js 脚本所在的目录，如 __dirname 变量所示。对于更多详细信息，请参阅app.use API reference。

因此，我建议您将app.use 更改为：

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

并将所有静态文件（包括 jquery 文件）放在 public 子目录下。

此外，您的服务器端代码依赖于 make 和 model 的序列，应该更改。例如，如果您将发出顺序切换为model 然后make，您应该看到您的服务器的console.log 将从上一次调用中获取make。

请尝试以下方法：

// On server:
socket.on('info', function (info) {
    console.log('recieved message:', info.make+','+info.model);  
});

// On client:
socket.emit('info', { make: makeInput, model: modelInput })

Answer 2

1) 如果您更喜欢，您也可以从您的服务器上提供 jQuery 库。你应该把它放在你项目的 public/vendor 或 public/js 文件夹中。

2) 这是来自Express 框架的中间件调用，它依次使用连接中间件堆栈。阅读此here。