Руководства

Мультиплеер с приглашениями

Копировать страницу

Комната для двух игроков. Создайте ее на вашем сервере, пригласите друга в нее с помощью выборщика друзей Lia или ссылки, и приведите обоих игроков в одну комнату.

Идея: у комнаты есть идентификатор, и этот идентификатор входит в приглашение's startParam. Кто-либо, открывший приглашение, открывает ваше приложение с этим startParam, и ваша страница присоединяется к ним в комнате. Lia'свое Lia XO работает так.

#1. Создайте комнату на вашем сервере

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 });
});

Идентификаторы комнат должны соответствовать startParam: 1 до 64 букв, цифр, _ и -.

#2. Пригласите друга

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));
}

Каждому приглашенному другу достается карточка в их Lia чате. Lia позволяет людям приглашать только своих друзей, и только друзей, которые могут открыть ваше приложение (пока оно'в тесте, только ваши тестировщики).

#3. Приземлитесь в комнате

Прочтите startParam, когда ваше приложение открывается, и слушайте, когда оно приходит'открыто (человек нажимает на второй приглашение):

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");
  }
}

startParam — это только подсказка: любой может создать ссылку с любым startParam, поэтому ваш сервер решает, существует ли комната и может ли игрок присоединиться.

#4. Играть вживую

Подключите обоих игроков к вашему серверу (обычно это WebSocket), и проверьте каждого игрока'сессия перед тем, как присоединиться к комнате. Пока игра идет:

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. Ваш ход, по уведомлению

Когда это'кто-то'ход и они'вы покинули приложение, а уведомление с комнатой как его startParam возвращает их прямо обратно:

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

#Публичные таблицы

Приглашения для друзей. Чтобы позволить любому на Lia присоединиться, также укажите комнату в lobby пока оно ждет:

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)}`);

В вашей странице покажите открытые таблицы и разместите людей, которые выбрали вашу таблицу в Lia'свое лобби (они приходят с 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);
}

Странники могут't чат через Lia, блокировки соблюдаются, и игроки могут отчет друг друга.

#Известные лимиты

Один человек может пригласить 20 друзей в ваше приложение в день, поэтому приглашения остаются тем, что люди приветствуют в своих чатах.
Хост может иметь 3 открытых публичных столов в вашем приложении одновременно, и список длится не более часа.
Lia.inviteFriend() ответы { invited }, никогда не кто был приглашен: ваш сервер узнает, кто присоединился, когда они присоединяются.

Автоматически переведено. Английский — источник истины. Читать на английском