Phaser3 多人服务器/客户端游戏中的碰撞处理答案

【问题标题】：Collision handling in Phaser3 multiplayer server/client gamePhaser3 多人服务器/客户端游戏中的碰撞处理
【发布时间】：2021-03-25 08:56:22
【问题描述】：

我有一个关于如何在 Phaser3 多人游戏中处理物理的问题。

我有一个客户端，我要在其中加载带有图层的瓦片地图。
我有一个服务器来处理所有游戏物理。

我在尝试处理碰撞时遇到问题，因为服务器的 game.js 脚本包含物理所在的配置：

const config = {
type: Phaser.HEADLESS,
parent: 'phaser-example',
width: 800,
height: 600,
autoFocus: false,
physics: {
    default: 'arcade',
    arcade: {
        debug: false,
        gravity: { y: 0 }
    }
},
scene: {
    preload: preload,
    create: create,
    update: update
}};
.........
function create() {

const self = this;
this.players = this.physics.add.group();

this.scores = {
    blue: 0,
    red: 0
};

this.star = this.physics.add.image(randomPosition(700), randomPosition(500), 'star');

this.physics.add.collider(this.players);.......

另一方面，我在客户端添加了 tilemap：

function preload() {
this.load.tilemapTiledJSON('map1', 'assets/maps/map1/level1.json');
this.load.image('background', 'assets/maps/map1/background.png');
this.load.image('tiles', 'assets/maps/map1/platformPack_tilesheet.png');

this.load.image('ship', 'assets/spaceShips_001.png');
this.load.image('otherPlayer', 'assets/enemyBlack5.png');
this.load.image('star', 'assets/star_gold.png');
}

function create() {

const backgroundImage = this.add.image(0, 0,'background').setOrigin(0, 0);
backgroundImage.setScale(2, 0.8);

const map = this.make.tilemap({key:'map1'});

const tileset = map.addTilesetImage('platformPack_tilesheet', 'tiles');

const platforms = map.createStaticLayer('Platforms', tileset, 0, 200);
map.setCollisionByExclusion(-1, true);............

问题是我不知道怎么用

physics.add.collider(this.players, this.platforms);

处理碰撞，因为我在客户端没有物理。我将不胜感激代码方面的任何帮助，或有关移相器多人游戏中物理的文章或任何想法如何实现它。

谢谢。

【问题讨论】：

标签： node.js phaser-framework multiplayer

【解决方案1】：

物理在服务器端处理。您还需要在服务器上加载 Tiled 文件并在那里制作物理逻辑。这可以给你一个提示：

import path from 'path'

import { dirname } from 'path'
import { fileURLToPath } from 'url'
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)

preload() {
   this.load.image('tiles', path.join(__dirname, '../../dist/assets/img/tilesets/tilesheet.png'))
   this.load.tilemapTiledJSON('map1', path.join(__dirname, '../../dist/assets/maps/map1.json'))
}

之后，像往常一样处理物理。尝试在github上找一个叫too-many-cooks的游戏作为例子。

【讨论】：