Question

所以现在我有一个我正在制作的游戏，每当有人连接时，我给他们的客户一个我的服务器用来区分不同角色的号码。字符是数组中的对象，因此ID为“0”的客户端将控制数组中的第一个对象。

但是，当这个人离开时，我无法决定该做什么。

server.js

// Setup basic express server
var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io')(server);
var port = process.env.PORT || 8082;

server.listen(port, function () {
  console.log('Server listening at port %d', port);
});

// Routing
app.use(express.static(__dirname + '/public'));

const speed = 5;
var hero1 = {
    x : 0,
    y : 0
}
var hero2 = {
    x : 0,
    y : 0
}
var hero3 = {
    x : 0,
    y : 0
}
var hero4 = {
    x : 0,
    y : 0
}
var hero5 = {
    x : 0,
    y : 0
}
var hero6 = {
    x : 0,
    y : 0
}
var allHeroes = [hero1, hero2, hero3, hero4, hero5, hero6];
var heroesOn = [];
function sendCoords() {
    io.sockets.emit("draw", heroesOn)
}

io.on('connection', function (socket) {
    socket.on('disconnect', function(){
        console.log(clients)
    });
    var clients = Object.keys(io.sockets.sockets)
    heroesOn.push(allHeroes[clients.length - 1]);
    console.log(clients)
    io.sockets.connected[clients[clients.length - 1]].emit("userId", clients.length - 1);
    socket.on("move", function(data) {
        if(heroesOn[data.user].x < 1) {
            data.a = false;
        } else if(data.a == true) {
            heroesOn[data.user].x = heroesOn[data.user].x - speed
        }
        if(heroesOn[data.user].y < 1) {
            data.w = false;
        } else if(data.w == true) {
            heroesOn[data.user].y = heroesOn[data.user].y - speed
        }
        if(heroesOn[data.user].y > 474) {
            data.s = false;
        } else if(data.s == true) {
            heroesOn[data.user].y = heroesOn[data.user].y + speed
        }
        if(heroesOn[data.user].x > 974) {
            data.d = false;
        } else if(data.d == true) {
            heroesOn[data.user].x = heroesOn[data.user].x + speed
        }
    })
})
setInterval(sendCoords, 1000/60)

client.js

$(function() {
    var socket = io();
    document.onkeydown = down;
    document.onkeyup = up;
    var canvas = document.querySelector('#canvas');
    var ctx = canvas.getContext('2d');
    var character = {
        user : 0,
        w : false,
        a : false,
        s : false,
        d : false
    }
    socket.on("userId", function(data) {
        console.log("got id")
        character.user = data;
    })
    function down(e) {
        socket.emit("move", character);
        if(e.keyCode == 87) {
            character.w = true;
        }
        if(e.keyCode == 65) {
            character.a = true;
        }
        if(e.keyCode == 83) {
            character.s = true;
        }
        if(e.keyCode == 68) {
            character.d = true;
        }
    }
    function up(e) {
        socket.emit("move", character);
        if(e.keyCode == 87) {
            character.w = false;
        }
        if(e.keyCode == 65) {
            character.a = false;
        }
        if(e.keyCode == 83) {
            character.s = false;
        }
        if(e.keyCode == 68) {
            character.d = false;
        }
    }
    setInterval(function() {

    }, 1000/60)
    socket.on("draw", function(data) {
        canvas.width=canvas.width;
        for(var i = 0; i < data.length; i++) {
            ctx.rect(data[i].x, data[i].y, 25, 25)
        }
        ctx.stroke();
    })

});

每当控制该英雄的客户离开时，我如何从heroesOn数组中删除英雄。

Answer 1

我会考虑使用地图（即对象）而不是数组来跟踪你的英雄。例如，当客户端连接时：

var heroesOn = {}; // key: socketid, value: hero
var counter = 0;
io.on('connection', function (socket) {
  heroesOn[socket.id] = allHeroes[counter++];
  ...continue your code...
});

当套接字断开连接时：

socket.on('disconnect', function(socket){
    delete heroesOn[socket.id];
});

套接字IO |为客户分配角色的最佳方法是什么？

1 个答案: