Guias

Multiplayer com convites

Copiar página

Uma sala para dois jogadores. Crie-a no seu servidor, convide um amigo para ela com o seletor de amigos do Lia ou um link, e coloque os dois jogadores na mesma sala.

A ideia: um quarto tem um id, e o id vai no convite's startParam. Quem abre o convite abre seu app com aquele startParam, e sua página se junta a eles ao quarto. Lia'seu próprio Lia XO funciona assim.

#1. Crie um quarto no seu servidor

server.js

app.post("/api/rooms", async (req, res) => {
  const playerId = await playerFrom(req.body.session); // see Verify on your server
  if (!playerId) return res.status(401).end();
  const room = "room-" + crypto.randomUUID().replace(/-/g, "").slice(0, 10);
  await db.createRoom(room, { host: playerId, players: [playerId] });
  res.json({ room });
});

app.post("/api/rooms/join", async (req, res) => {
  const playerId = await playerFrom(req.body.session);
  if (!playerId) return res.status(401).end();
  const room = await db.room(req.body.room);
  if (!room) return res.status(404).json({ error: "no_room" });
  if (room.players.length >= 2 && !room.players.includes(playerId)) return res.status(409).json({ error: "full" });
  await db.addPlayer(req.body.room, playerId);
  res.json({ room: req.body.room });
});

IDs de sala devem seguir um startParam: 1 a 64 de letras, dígitos, _ e -.

#2. Convide um amigo

game.js

async function playWithAFriend() {
  const { room } = await api("/api/rooms", {});
  showWaiting(room);
  const { invited } = await Lia.inviteFriend({ startParam: room });
  if (!invited) Lia.toast("Share the link to invite someone");
}

// Or a link to send anywhere: opens your app in Lia, or the App Store without it.
async function shareRoom(room) {
  await Lia.share("Play with me: " + Lia.inviteLink(room));
}

Cada amigo escolhido recebe um cartão no chat Lia deles. Lia só permite que as pessoas convidem seus amigos, e apenas amigos que conseguem abrir seu aplicativo (enquanto ele's no teste, apenas seus testadores).

#3. Aterrissar no quarto

Leia o startParam quando seu app abrir, e ouça por um que chegue enquanto ele's aberto (a pessoa toca em um segundo convite):

function route(startParam) {
  if (startParam && startParam.startsWith("room-")) joinRoom(startParam);
}

Lia.init().then(function () {
  route(Lia.startParam);
  Lia.ready();
});
Lia.on("startParam", function (data) { route(data.startParam); });

async function joinRoom(room) {
  try {
    await api("/api/rooms/join", { room });
    openTable(room);
  } catch (error) {
    Lia.toast(error.message === "full" ? "That game is full" : "That game has ended");
  }
}

Um startParam é apenas uma dica: qualquer um pode fazer um link com qualquer startParam, então o seu servidor decide se a sala existe e o jogador pode entrar.

#4. Jogue ao vivo

Conecte ambos os jogadores ao seu servidor (um WebSocket é comum), e verifique cada jogador'sessão antes de juntá-las à sala. Enquanto um jogo está em andamento:

Lia.enableClosingConfirmation(); // "Leave the game?" if they close
Lia.disableVerticalSwipes();     // a swipe down won't close the sheet mid move
Lia.onPause(function () { socket.send(JSON.stringify({ type: "away" })); });
Lia.onResume(function () { socket.send(JSON.stringify({ type: "back" })); });

#5. Sua vez, por notificação

Quando ele'alguém's movimento e eles'você saiu do seu app, um notificação com o quarto como seu startParam os devolve diretamente:

{ "playerId": "p_3f9c0a6d1b2e4f5a6b7c", "text": "@kofi played. Your move.", "startParam": "room-a81c2e09f4" }

#Mesas públicas

Convites são para amigos. Para permitir que qualquer pessoa em Lia se junte, liste também a sala na lobby enquanto ele espera:

server.js

// When the room is made: list it (as the host, with one seat taken).
await lia("POST", "/lobby/tables", { tableId: room, hostPlayerId: playerId, seats: 2, taken: 1, title: "Quick game" });

// When someone joins from the lobby: seat them through Lia first (it refuses blocked players and full tables).
app.post("/api/rooms/sit", async (req, res) => {
  const playerId = await playerFrom(req.body.session);
  if (!playerId) return res.status(401).end();
  try {
    const { full } = await lia("POST", `/lobby/tables/${encodeURIComponent(req.body.room)}/sit`, { playerId });
    await db.addPlayer(req.body.room, playerId);
    if (full) startGame(req.body.room);
    res.json({ room: req.body.room });
  } catch (error) {
    res.status(409).json({ error: error.data?.error ?? "failed" }); // full, not_found, own_table
  }
});

// When the game starts or the room closes: take it out (safe to repeat).
await lia("DELETE", `/lobby/tables/${encodeURIComponent(room)}`);

Na sua página, mostre as tabelas abertas e sente as pessoas que escolheram sua mesa em Lia'seu próprio lobby (eles chegam com o startParam lobby-<table id>):

const { tables } = await Lia.lobby.tables();
renderTables(tables, (table) => api("/api/rooms/sit", { room: table.id }));

function route(startParam) {
  if (startParam?.startsWith("lobby-")) return api("/api/rooms/sit", { room: startParam.slice(6) }).then(openTable);
  if (startParam?.startsWith("room-")) return joinRoom(startParam);
}

Estranhos podem'não converse através do Lia, os blocos são respeitados e os jogadores podem relatório um ao outro.

#Limites a saber

Uma pessoa pode convidar 20 amigos para o seu app por dia, então os convites permanecem algo que as pessoas bem-vindas em seus chats.
Um anfitrião pode ter 3 mesas públicas abertas no seu app ao mesmo tempo, e uma lista dura no máximo uma hora.
Lia.inviteFriend() respostas { invited }, nunca quem foi convidado: seu servidor aprende quem se juntou quando eles se juntarem.

Traduzido automaticamente. O inglês é a fonte de verdade. Leia em inglês