node.js socket.io简单聊天

时间:2011-07-25 14:55:14

标签: node.js socket.io

我开始玩node.js,而且每个人都想和我聊天。

我的想法是在端口9090中运行带有socket.io的node.js,在端口8080中运行我的客户端html。我的html客户端将独立提供。

我的服务器:

var sys = require('sys');
var express = require('express');
var io = require('socket.io');

var app = express.createServer();

app.listen(8080);

var socket = io.listen(app);

socket.on('connection', function (client) {
    client.on('message', function (msg) {
        socket.broadcast(msg);
    });
    client.on('disconnect', function () {
    });
});

我的客户:

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script src="http://cdn.socket.io/stable/socket.io.js"></script>
        <script>
            $(document).ready(function () {
                var socket = new io.Socket("localhost", {port: 8080});

                socket.on('connect', function () {
                    socket.send('A client connected.');
                });
                socket.on('message', function (message) {
                    $('div#messages').append($('<p>'), message);
                });
                socket.on('disconnect', function () {
                    console.log('disconnected');
                });
                socket.connect();

                $('input').keydown(function (event) {
                    if(event.keyCode === 13) {
                        socket.send($('input').val());
                        $('input').val('');
                    }
                });
            });
        </script>
    </head>
    <body>
        <input type="text" style="width: 300px;" />
        <div id="messages" style="border:solid 1px #000;">&nbsp;</div>
    </body>
</html>

我使用node.js v0.4.10在ubuntu 11.04中运行。

服务器工作正常,但客户端无法连接,在google Chrome上的console.log中我收到此消息: XMLHttpRequest无法加载http://localhost:8080/socket.io/xhr-polling//1311465961485。 Access-Control-Allow-Origin不允许原点http://localhost

server.js位于/ var / www / cliente / chat / public中的文件夹中。

有什么问题?

3 个答案:

答案 0 :(得分:5)

您的客户端代码实际上并未根据需要从端口8080提供。

var sys = require('sys');
var express = require('express');
var io = require('socket.io');

var app = express.createServer();
app.listen(8080);
app.use(express.static(__dirname));

app.get('/', function(req, res){
    res.render('index.html', { title: 'Chat' });
});

var socket = io.listen(app);

socket.on('connection', function (client) {
    client.on('message', function (msg) {
        socket.broadcast(msg);
    });
    client.on('disconnect', function () {
    });
});

这应该可以修复Access-Control-Allow-Origin错误。执行node server.js并连接到http://localhost:8080。还有一些补充说明:

  1. 确保已安装socket.io 0.6.x,因为这是您在html文件中的内容。 0.7.x向后兼容。

  2. 使用此配置,您将在为您的页面提供服务的同一端口上运行socket.io(而不是9090)。

答案 1 :(得分:3)

当我将客户更新为:

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script src="http://localhost:8080/socket.io/socket.io.js"></script>
        <script>
                var socket = io.connect("http://localhost", {port: 8080});

        socket.on('connect', function () {
                    socket.send('A client connected.');
                });

                socket.on('message', function (msg) {
                    $('div#messages').append($('<p>'), msg);
                });

                socket.on('disconnect', function () {
            console.log('disconnected');
                });

        $(document).ready(function(){
                $('#btn_send').click(function (event) {
                    socket.send($('#txt_msg').val());
                    $('#txt_msg').val('');
            });
                });
        </script>
    </head>
    <body>
        <input type="text" id="txt_msg" style="width: 300px;" /><input type="button" id="btn_send" value="send" />  
        <div id="messages" style="border:solid 1px #000;">&nbsp;</div>
    </body>
</html>

一切正常。

我使用的是版本0.7的socket.io问题:https://github.com/LearnBoost/Socket.IO/wiki/Migrating-0.6-to-0.7

答案 2 :(得分:0)

您不能向与当前页面不在同一主机名和端口上的URL发出AJAX请求。这是所有网络浏览器的安全限制。