在我的服务器上，我可以使用 socket.io 很好地运行我的节点服务器。但是，当我在 localhost 上尝试几乎完全相同的代码时，我无法让它工作。
客户端.js
$(function() {
/* Check for a <canvas> */
if (! ("getContext" in document.createElement("canvas"))) {
alert("Sorry, it looks like your browser does not support canvas!");
return false;
}
/* The URL of your web server and the port */
//var url = "http://57o9.org:8081";
var url = "localhost:8081";
var doc = $(document);
var win = $(window);
var canvas = $("#canvas");
var ctx = canvas[0].getContext("2d");
/* Generate an unique ID based on time */
var id = Math.round($.now() * Math.random());
var drawing = false;
var clients = {};
var cursors = {};
var socket = io.connect(url);
socket.on("moving", function(data) {
/* Create a new cursor for new users */
if (! (data.id in clients)) {
cursors[data.id] = $("<div class=\"cursor\">").appendTo("#cursors");
}
/* Update mouse pointer data */
cursors[data.id].css({
"left" : data.x,
"top" : data.y
});
/* Is the user drawing? */
if (data.drawing && clients[data.id]) {
/* Draw a line on the canvas. clients[data.id] holds
the previous position of this user"s mouse pointer */
drawLine(clients[data.id].x, clients[data.id].y, data.x, data.y);
}
/* Save the current client state */
clients[data.id] = data;
clients[data.id].updated = $.now();
});
var prev = {};
canvas.on("mousedown", function(e) {
e.preventDefault();
drawing = true;
prev.x = e.pageX;
prev.y = e.pageY;
});
doc.bind("mouseup mouseleave", function() {
drawing = false;
});
var lastEmit = $.now();
doc.on("mousemove",function(e) {
if ($.now() - lastEmit > 30) {
socket.emit("mousemove", {
"x": e.pageX,
"y": e.pageY,
"drawing": drawing,
"id": id
});
lastEmit = $.now();
}
/* Draw a line for the current user"s movement */
if (drawing) {
drawLine(prev.x, prev.y, e.pageX, e.pageY);
prev.x = e.pageX;
prev.y = e.pageY;
}
});
/* Remove inactive clients after 10 seconds of inactivity */
setInterval(function() {
for (ident in clients) {
if ($.now() - clients[ident].updated > 10000) {
cursors[ident].remove();
delete clients[ident];
delete cursors[ident];
}
}
}, 10000);
function drawLine(fromx, fromy, tox, toy) {
fromx -= canvas[0].offsetLeft;
tox -= canvas[0].offsetLeft;
fromy -= canvas[0].offsetTop;
toy -= canvas[0].offsetTop;
ctx.moveTo(fromx, fromy);
ctx.lineTo(tox, toy);
ctx.stroke();
}
});
服务器.js
/* Include libraries */
var app = require('http').createServer(handler);
var io = require('socket.io').listen(app);
io.set("log level", 1); // Disable socket.io logging
var nodeStatic = require('node-static');
/* This will make all the files in the current folder accessible from the web */
var fileServer = new nodeStatic.Server("./");
/* Set up server port */
app.listen(8081);
/* Check if the URL of the socket server is opened in a browser */
function handler(request, response) {
request.addListener("end", function() {
fileServer.serve(request, response); // Return the correct file
});
}
/* Listen for incoming connections from clients */
io.sockets.on("connection", function (socket) {
socket.on("mousemove", function (data) {
socket.broadcast.emit("moving", data);
});
});
这是一个基本的协作绘图程序。在我的服务器上它可以工作 - 我可以画画，其他人可以看到我画的东西，我们可以一起画画。但是，在 localhost:8081 上它不起作用。
我尝试调试 socket.io，每次我在 localhost:8081 上打开一个新页面时，我得到的唯一结果就是以下行。
调试 - 提供静态内容 /socket.io.js
我当前的目录如下所示：
node_modules js index.html assets
在 Firefox Aurora 上，Web 控制台没有给出任何错误，但在 Chromium 上我得到这个错误：
Failed to load resource http://0.0.31.145:8081/socket.io/1/?t=1349017485579
我在项目目录上和项目目录上都安装了 socket.io ~/node_modules/。我正在运行节点服务器node js/server.js。
有任何想法吗？先感谢您。