أنا أعاني حقًا في صنع الرصاص في لعبة متعددة اللاعبين أقوم بها لفصلي في علوم الكمبيوتر. أنا أستخدم socket.io ، وأرسل صفيف التعداد النقطي إلى العميل من الخادم ، ولكن عندما أحاول التكرار من خلال الصفيف الذي أرسله إلى العميل ، فإنه يظل يخبرني أنه غير محدد. هل من أحد لديه حل من أجلي؟ شكرا لك مقدما! الرمز الخاص بي أدناه:
game.js (جانب العميل):
var socket = io();
var canvas = document.getElementById('canvas');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var context = canvas.getContext('2d');
var movement = {
up: false,
down: false,
left: false,
right: false
};
var mouse = {
mouseX: undefined,
mouseY: undefined
};
document.addEventListener('keydown', function(event) {
switch (event.keyCode) {
case 65: // A
movement.left = true;
break;
case 87: // W
movement.up = true;
break;
case 68: // D
movement.right = true;
break;
case 83: // S
movement.down = true;
break;
}
});
document.addEventListener('keyup', function(event) {
switch (event.keyCode) {
case 65: // A
movement.left = false;
break;
case 87: // W
movement.up = false;
break;
case 68: // D
movement.right = false;
break;
case 83: // S
movement.down = false;
break;
}
});
document.addEventListener('click', function(event){
mouse.mouseX = event.clientX;
mouse.mouseY = event.clientY;
socket.emit('mousePos', mouse);
});
socket.emit('new player');
setInterval(function() {
socket.emit('movement', movement);
}, 1000 / 30);
socket.on('state', function(data) {
var bullets = data.p;
var players = data.b;
context.clearRect(0, 0, canvas.width, canvas.height);
for (var id in players) {
context.save();
var player = players[id];
var img = new Image();
img.src = 'https://opengameart.org/sites/default/files/spaceship.pod_.1.green_.png';
context.translate(player.x + player.width / 2, player.y + player.height / 2);
context.rotate(player.rotation * Math.PI/180);
context.drawImage(img, -player.width / 2, -player.height / 2, player.width, player.height);
context.fill();
context.restore();
}
for (var i=0; i<bullets.length; i++) {
bullet = bullets[i];
var bmg = new Image();
bmg.src= 'https://s1.piq.land/2013/02/24/K22HRK2BcpIwVYDuzwgpicei_400x400.png';
context.drawImage(bmg, bullet.x, bullet.y, bullet.width, bullet.height);
}
});
server.js (جانب الخادم):
// Dependencies.
var express = require('express');
var http = require('http');
var path = require('path');
var socketIO = require('socket.io');
var app = express();
var server = http.Server(app);
var io = socketIO(server);
app.set('port', 5000);
app.use('/static', express.static(__dirname + '/static'));
// Routing
app.get('/', function(request, response) {
response.sendFile(path.join(__dirname, 'index.html'));
});
server.listen(5000, function() {
console.log('Starting server on port 5000');
});
var players = {};
var bullets = [];
function Bullet(x, y, angle){
this.x = x;
this.y = y;
this.width = 40;
this.height = 40;
this.ang = angle;
this.speed = 15;
}
io.on('connection', function(socket) {
socket.on('new player', function() {
players[socket.id] = {
x: 300,
y: 300,
rotation: 0,
width: 70,
height: 70,
speed: 15,
health:100
};
});
socket.on('disconnect', function(){
delete players[socket.id];
});
socket.on('movement', function(data) {
var player = players[socket.id] || {};
if (data.left) {
player.rotation-=2*Math.PI;
}
if (data.up) {
player.x -= player.speed * Math.cos((player.rotation+90) * Math.PI / 180);
player.y -= player.speed * Math.sin((player.rotation+90) * Math.PI / 180);
}
if (data.right) {
player.rotation+=2*Math.PI;
}
if (data.down) {
player.x += player.speed * Math.cos((player.rotation+90) * Math.PI / 180);
player.y += player.speed * Math.sin((player.rotation+90) * Math.PI / 180);
}
});
socket.on('mousePos', function (mouse) {
bullets.push(new Bullet(players[socket.id].x, players[socket.id].y, players[socket.id].rotation));
})
});
setInterval(function() {
for (var i=0; i<bullets.length; i++) {
bullet = bullets[i];
bullet.x += bullet.speed * Math.cos((bullet.rotation+90) * Math.PI/180);
bullet.x += bullet.speed * Math.sin((bullet.rotation+90) * Math.PI/180);
}
io.sockets.emit('state', {p:players, b:bullets});
}, 1000 / 30);
هذا هو الخطأ الذي أحصل عليه في وحدة التحكم الخاصة بي:
game.js:82 Uncaught TypeError: Cannot read property 'length' of undefined
at r.<anonymous> (game.js:82)
at r.emit (index.js:83)
at r.onevent (index.js:83)
at r.onpacket (index.js:83)
at r.<anonymous> (index.js:83)
at r.emit (index.js:83)
at r.ondecoded (index.js:83)
at a.<anonymous> (index.js:83)
at a.r.emit (index.js:83)
at a.add (index.js:83)