Giter Club home page Giter Club logo

phaser3-multiplayer-with-physics's Introduction


header
Phaser 3 - Real-Time Multiplayer example with Physics

A Real-Time Multiplayer example using Phaser 3 with Physics (MatterJS and Arcade) on a NodeJS server with Express and Socket.io

GitHub package.json version GitHub last commit


⚠️ Note

This example is using @geckos.io/phaser-on-nodejs which is very slow tedious. If you need to run Phaser's Arcade Physics on the Server, I recommend using arcade-physics. I will not update this example anymore.

Play It

This example is running on NodeJS on Heroku (Free Dyno in Europe) which causes the example sometimes to take about 1 minute to load.

  • Play it here - phaser3-multiplayer-example
    It works best if your latency is below 100ms, which should the case if you are located in Europe.

Key Features

  • The physics is entirely calculated on the Server
  • Automatically manages Rooms (new Phaser instances)
  • Physics debugging version
  • A nice Stats page

Geckos.io

Why does this game example not use geckos.io?
Well there are two reasons:

  • Geckos.io did not exist back then.
  • This example is deployed on heroku, which does not allow to forward UDP ports, geckos.io depends on.

Video

Watch it on YouTube

thumbnail

Matter Physics vs Arcade Physics

This example includes 2 different games. One with MatterJS and the other with Arcade. The MatterJS game has only one level. The Arcade one is a simple platformer game with 3 levels.

So in total, you can play 4 different levels. For each level, the server creates a new room, which creates a new Phaser instance, which are completely isolated from each other. There can be up to 4 players per room.

Structure

├── src
│   ├── client  # Contains all the code the client will need
│   ├── physics # This is for debugging the physics (Arcade and MatterJS)
│   ├── server  # Contains the code running on the NodeJS server
│   └── stats   # The stats page will show useful information about the server

How To Use

To clone and run this template, you'll need Git and Node.js (which comes with npm) installed on your computer.

You also need to install some additional packages since this example uses Node-Canvas. See here.

From your command line:

# Clone this repository
$ git clone --depth 1 https://github.com/yandeu/phaser3-multiplayer-with-physics.git phaser3-example

# Go into the repository
$ cd phaser3-example

# Install dependencies
$ npm install

# Start the local development server (on port 3000)
$ npm run dev

# To publish a production build using docker use docker:publish
# This needs docker and docker-compose to be installed on your machine
$ npm run docker:publish

Other Multiplayer Examples

Looking for a simpler multiplayer example? Take a look at Phaser 3 - Multiplayer Game Example.

License

The MIT License (MIT) 2019 - Yannick Deubel. Please have a look at the LICENSE for more details.

phaser3-multiplayer-with-physics's People

Contributors

bhgsbatista avatar dependabot[bot] avatar gamedevsam avatar yandeu avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

phaser3-multiplayer-with-physics's Issues

Weird | `npm install` failed, but `npm start` works for local server running

Hi,
Just after having cloned the repo, I tried to install node modules by npm install.
But it fails with some errors which seem to be related with typescript syntax.
However, I can execute npm start - i.e. npm run dev so that the local game server runs properly on port 3000.

image

image

I cannot understand why. Please help me!

Error when player timeout

I got this error: Error: ENOENT: no such file or directory, open 'C:\Game Dev\phaser3-multiplayer-with-physics\[email protected]\phaser-on-nodejs\lib\node:internal\process\task_queues'

it happened when player reach timeout after export const USER_KICK_TIMEOUT = 60_000 // 1 minute

Please help me fix this

I want to call API from server side, but Phaser on Nodejs not allow

I want to call API to save score from my game using phaser on nodejs:

let res = await axios.post(API_GAME_SCORE, payload,config);

and I got this error:

Error: ENOENT: no such file or directory, open ‘C:\Game Dev\RockRun\[email protected]\phaser-on-nodejs\lib\https:\api-testing.therocks.io\api\v1.0\game\score\update’

I think because of fakeXMLHttpRequest

Do you have any solution for this?

Thanks

Use Parcel instead of Webpack

Webpack configs are yet another thing we have to maintain. I think Parcel is faster, has reasonable defaults, and would make implementing hot reloading easier.

Compiled files are missing?

Thanks for sharing this code!

I couldn't run it without TypeScript.
I guess the repo should also include compiled files?

Add hot-reloading

Since we're sticking with webpack we should add hot reloading to the client, stats, and and physics webpack configs.

Server is already hot reloaded via nodemon.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.