HTML5 Canvas, JavaScript (John Resig simple Inheritance 라이브러리를 사용하여 너무) 및 Socket.IO를 사용하여 Node.js로 간단한 멀티 플레이어를 만들려고했습니다. 내 고객 코드 :
var canvas = document.getElementById ( 'game');
var context = canvas.getContext ( '2d');
var socket = new io.Socket ( '127.0.0.1', {port : 8080});
var player = null;
var UP = 'UP',
왼쪽 = '왼쪽',
DOWN = 'DOWN',
오른쪽 = '오른쪽';
socket.connect ();
socket.on ( 'connect', 함수 () {socket.send ();
console.log ( 'Connected!');
플레이어 = 새로운 플레이어 (50, 50);
});
socket.on ( '메시지', 함수 (msg) {
if (msg == 'UP') {
player.moveUP ();
} 그렇지 않으면 if (msg == 'LEFT') {
player.moveLEFT ();
} 그렇지 않으면 if (msg == 'DOWN') {
player.moveDOWN ();
} 그렇지 않으면 if (msg == 'RIGHT') {
player.moveRIGHT ();
} else {
}
});
socket.on ( '연결 끊기', 함수 () {
console.log ( '연결 끊김!');
});
var Player = Class.extend ({
init : 함수 (x, y) {
this.x = x;
this.y = y;
},
setX : 함수 (x) {
this.x = x;
},
getX : 함수 () {
this.x를 반환;
},
setY : 함수 (y) {
this.y = y;
},
getY : 함수 () {
이것을 돌려줍니다 .y;
},
무승부 : function () {
context.clearRect (0, 0, 350, 150);
context.fillRect (this.x, this.y, 15, 15);
},
이동 : 함수 () {
this.x + = 1;
this.y + = 1;
},
moveUP : 함수 () {
this.y--;
},
moveLEFT : 함수 () {
this.x--;
},
moveDOWN : 함수 () {
this.y ++;
},
moveRIGHT : 함수 () {
this.x ++;
}
});
function checkKeyCode (event) {
var keyCode;
if (event == null) {
keyCode = window.event.keyCode;
} else {
keyCode = event.keyCode;
}
스위치 (키 코드) {
사례 38 : // UP
player.moveUP ();
socket.send (UP);
단절;
사례 37 : // 왼쪽
player.moveLEFT ();
socket.send (LEFT);
단절;
사례 40 : // DOWN
player.moveDOWN ();
socket.send (DOWN);
단절;
사례 39 : // RIGHT
player.moveRIGHT ();
socket.send (RIGHT);
단절;
기본:
단절;
}
}
함수 update () {
player.draw ();
}
var FPS = 30;
setInterval (function () {
최신 정보();
player.draw ();
}, 1000 / FPS);
함수 init () {
document.onkeydown = checkKeyCode;
}
init ();
그리고 서버 코드 :
var http = require ( 'http'),
io = require ( 'socket.io'),
buffer = new Array (),
서버 = http.createServer (function (req, res) {
res.writeHead (200, { 'Content-Type': 'text / html'});
res.end ( '안녕하세요 세계
');
});
server.listen (8080);
var socket = io.listen (서버);
socket.on ( '연결', 함수 (클라이언트) {
client.on ( '메시지', 함수 (메시지) {
console.log (메시지);
client.broadcast (메시지);
})
client.on ( '연결 끊기', 함수 () {
})
});
두 클라이언트를 실행하면 첫 번째 클라이언트가있는 두 번째 클라이언트 Rect를 이동할 수 있고 두 번째 클라이언트가 첫 번째 클라이언트를 rect로 이동할 수 있으며 세 번째 클라이언트와 같은 것이 첫 번째와 두 번째 클라이언트 rect를 이동할 수 있습니다.
실제 멀티 플레이어를 만드는 방법에 대해 질문이 있습니까? 다음과 같이하십시오 : 세 개의 클라이언트를 열고 첫 번째 클라이언트는 rect1, 두 번째 rect2 및 마지막 rect3을 얻습니다. 첫 번째 클라이언트는 rect1 만 이동할 수 있고 클라이언트 세 번째는 rect3 만 이동할 수 있습니다.
누구든지 아이디어가 있습니까? Google에서 검색했지만 답변을 찾지 못했습니다.
영어로 죄송합니다. 감사합니다.