โ† All Workshops

MudEngine Part 6: Multiplayer

Run it!

Start the fullstack dev server with dx serve. The CLI compiles both the server binary and the client WASM bundle, then starts the Axum server on http://localhost:8080.

Because the app is now a fullstack app, the server handles WebSocket upgrades, and the browser loads the same WASM bundle as before.

Serve the multiplayer app
dx serve --open
๐Ÿงช Testing multiplayer

Open two browser tabs side by side:

Tab 1 โ€” Alice

  1. Enter name: Alice
  2. Click Enter the World โ€” Alice spawns in Town Square
  3. The grid highlights Alice's cell. The sidebar shows "Alice (you) โ€” Town Square"
  4. Click โฌ† North โ€” Alice moves to Hilltop

Tab 2 โ€” Bob

  1. Enter name: Bob
  2. Click Enter the World โ€” Bob spawns in Town Square
  3. Alice's tab now shows Bob in Town Square (grid cell + sidebar)
  4. Alice's sidebar shows: Alice (you) โ€” Hilltop, Bob โ€” Town Square

Moving around

  • Bob clicks โฌ… West โ†’ Bob moves to Dark Forest
  • Alice's tab immediately shows Bob in Dark Forest
  • Alice clicks โฌ‡ South โ†’ Alice moves back to Town Square
  • Bob clicks โžก East โ†’ Bob is now in Town Square with Alice

Disconnecting

  • Close Bob's tab โ†’ Alice's tab removes Bob from the grid and sidebar after a few seconds
  • Open a third tab as Charlie โ†’ both Alice and Bob see Charlie appear

The description panel below the controls always shows the current room's name and description text for your player.

๐Ÿšฆ Troubleshooting

WebSocket doesn't connect โ†’ Check the browser dev tools console (F12). Look for WebSocket upgrade errors. Ensure dioxus-fullstack = "0.7" is in your Cargo.toml โ€” the WebSocket types are not re-exported by dioxus alone.

"use_websocket not found" โ†’ You need use dioxus_fullstack::{use_websocket, Websocket, WebSocketOptions}; in your imports.

Multiple players don't see each other โ†’ Make sure you're opening the same URL (default http://localhost:8080). Each tab counts as a separate client.

Grid doesn't show other players' positions โ†’ Check the receive loop in use_future. Each ServerMessage variant must update the players signal. If the server isn't broadcasting, check the tokio::select! arms โ€” the rx.recv() branch must forward messages correctly.

Hot-reload quirks with fullstack โ†’ Fullstack hot-reload is supported but server-side code changes may require a manual reload. If the server seems stale, stop dx serve with Ctrl+C and restart it.