socket / node / express的基本聊天应用程序 - 没有打印出来

时间:2016-04-09 01:36:19

标签: node.js sockets express socket.io

我只是想用socket.io和node做一个非常基本的聊天应用程序。我无法看到任何内容被打印到我的屏幕上,并且找不到任何错误。感谢帮助!

感谢。

app.js

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

server.listen(3000);
console.log('Server running...');

app.get('/', function(req, res){

    res.sendFile(__dirname + '/index.html');

});

io.sockets.on('connection', function(socket){
    socket.on('send-message', function(data){
        io.sockets.emit('new message', data);
    });
});

的index.html

<html>
<title>Chat Test</title>

<style> #chat{
height: 500px;
}
</style>
<head>
<body>

<div id = "chat"></div>

<form id = "send-message">
    <input size = "35" id = "message"></input>
    <input type = "submit"></input>
    </form>

    <script src ="https://code.jquery.com/jquery-latest.min.js"></script>
    <script src ="/socket.io/socket.io.js"></script>

    <script>

    JQuery(function($){

        var socket = io.connect();

        var $messageForm = $('#send-message');
        var $messageBox = $('#message');
        var $chat = $('#chat');

        $messageForm.submit(function(e){

        e.preventDefault();
        socket.emit('send-message', $messageBox.val());
        $messageBox.val('');

        });

        socket.on('new message', function(data){
        $chat.append(data + "<br/>");
        });
    });

    </script>
</body>
</head>
</html>

1 个答案:

答案 0 :(得分:2)

使用jQuery时,您必须拼写jQuery,而不是JQuery或者您可以使用内置别名$

这应该在浏览器的调试控制台中显示错误,您应该学会查找自己的错误。

jQuery(function($){

    var socket = io.connect();

    var $messageForm = $('#send-message');
    var $messageBox = $('#message');
    var $chat = $('#chat');

    $messageForm.submit(function(e){

        e.preventDefault();
        socket.emit('send-message', $messageBox.val());
        $messageBox.val('');

    });

    socket.on('new message', function(data){
        $chat.append(data + "<br/>");
    });
});

修复此问题然后运行代码并访问http://localhost:3000后,您的应用就可以正常使用了。表格中提交的任何内容都将广播给所有连接的客户。