0
내 서버에서 socket.io를 사용하여 노드 서버를 정상적으로 실행할 수 있습니다. 그러나 localhost에서 똑같은 코드를 거의 시도해도 제대로 작동하지 않습니다.localhost (및 socket.io)의 Node.js
client.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();
}
});
server.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
는, 웹 콘솔에 오류를 제공하지 않지만, 크롬 I에 이 오류가 발생합니다 :
Failed to load resource http://0.0.31.145:8081/socket.io/1/?t=1349017485579
~/node_modules/ 및 프로젝트 디렉토리에 모두 socket.io가 설치되어 있습니다. 노드 서버를 node js/server.js과 함께 실행 중입니다.
아이디어가 있으십니까? 미리 감사드립니다.