Saya mencoba membuat Multi-player sederhana dengan HTML5 Canvas, JavaScript (juga menggunakan John Resig library Inheritance sederhana) dan Node.js dengan Socket.IO. Kode klien saya:
var canvas = document.getElementById ('game');
var context = canvas.getContext ('2d');
var socket = io.Socket baru ('127.0.0.1', {port: 8080});
pemain var = nol;
var UP = 'UP',
KIRI = 'KIRI',
BAWAH = 'BAWAH',
KANAN = 'KANAN';
socket.connect ();
socket.on ('connect', function () {socket.send ();
console.log ('Terhubung!');
pemain = Pemain baru (50, 50);
});
socket.on ('message', function (msg) {
if (msg == 'UP') {
player.moveUP ();
} lain jika (Pesan == 'KIRI') {
player.moveLEFT ();
} lain jika (Pesan == 'BAWAH') {
player.moveDOWN ();
} lain jika (Pesan == 'KANAN') {
player.moveRIGHT ();
} lain {
}
});
socket.on ('putuskan', fungsi () {
console.log ('Terputus!');
});
var Player = Class.extend ({
init: function (x, y) {
this.x = x;
this.y = y;
},
setX: function (x) {
this.x = x;
},
getX: function () {
kembalikan this.x;
},
setY: function (y) {
this.y = y;
},
getY: function () {
kembalikan ini.
},
draw: function () {
context.clearRect (0, 0, 350, 150);
context.fillRect (this.x, this.y, 15, 15);
},
move: function () {
this.x + = 1;
this.y + = 1;
},
moveUP: function () {
ini.y--;
},
moveLEFT: function () {
this.x--;
},
moveDOWN: function () {
this.y ++;
},
moveRIGHT: function () {
this.x ++;
}
});
function checkKeyCode (event) {
var keyCode;
if (event == null) {
keyCode = window.event.keyCode;
} lain {
keyCode = event.keyCode;
}
switch (keyCode) {
case 38: // UP
player.moveUP ();
socket.send (UP);
istirahat;
kasus 37: // KIRI
player.moveLEFT ();
socket.send (LEFT);
istirahat;
case 40: // BAWAH
player.moveDOWN ();
socket.send (DOWN);
istirahat;
kasus 39: // KANAN
player.moveRIGHT ();
socket.send (RIGHT);
istirahat;
default:
istirahat;
}
}
pembaruan fungsi () {
player.draw ();
}
var FPS = 30;
setInterval (function () {
memperbarui();
player.draw ();
}, 1000 / FPS);
function init () {
document.onkeydown = checkKeyCode;
}
init ();
Dan kode server:
var http = membutuhkan ('http'),
io = membutuhkan ('socket.io'),
buffer = new Array (),
server = http.createServer (fungsi (req, res) {
res.writeHead (200, {'Type-Type': 'text / html'});
kirim ulang ('Halo Dunia
');
});
server.listen (8080);
var socket = io.listen (server);
socket.on ('koneksi', fungsi (klien) {
client.on ('message', function (message) {
console.log (pesan);
client.broadcast (pesan);
})
client.on ('putuskan', fungsi () {
})
});
Dan ketika saya menjalankan dua klien, saya dengan klien pertama dapat memindahkan klien kedua Rect dan dengan klien kedua memindahkan klien klien pertama dan sesuatu seperti dengan klien ketiga dapat memindahkan klien klien pertama dan kedua.
Saya punya pertanyaan bagaimana cara membuat Multi-Player nyata? sesuatu seperti: Buka tiga klien dan klien pertama mendapatkan rect1, rect2 kedua dan rect3 terakhir. Klien pertama hanya bisa bergerak rect1, klien ketiga hanya bisa bergerak rect3.
Mungkin ada yang punya ide? Saya mencari di Google tetapi tidak menemukan jawaban.
Maaf untuk bahasa inggris saya, terima kasih.