Commencer

Démarrage rapide

Copier la page

Une application Lia fonctionnelle en quelques minutes. Hébergez une page, chargez SDK, appelez Lia.init() et Lia.ready(), et ouvrez-la dans Lia en tant que testeur.

#Ce dont vous avez besoin

Une page web sur https. N'importe quel framework, hébergé n'importe où, tant qu'il'servi via https. Lia n'ouvre que les pages https.
Un compte Lia avec un nom d'utilisateur. Les gens ont besoin d'un nom d'utilisateur pour ouvrir des applications, et vous aussi.
Votre application a été ajoutée à Lia. L'équipe Lia l'ajoute avec votre page'son adresse et vous en fait son développeur, donc vous pouvez l'ouvrir pendant qu'il's dans le document. En supprimant celle-ci (ou un parent), le bouton est masqué ou la maintien est arrêté. Les éléments situés à l'intérieur d'une Obtenir l'accès.

#1. Charger le SDK

Chargez le SDK depuis Lia, pas depuis une copie. Lia le sert afin que les correctifs atteignent toutes les applications à la fois.

index.html

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <script src="https://api.lialabs.org/sdk/lia-apps-v1.js"></script>
  <style>
    body {
      margin: 0;
      font-family: system-ui, sans-serif;
      background: var(--lia-bg-color, #fff);
      color: var(--lia-text-color, #0b0b0f);
      padding-bottom: var(--lia-safe-area-inset-bottom, 0px);
    }
  </style>
</head>
<body>
  <main id="app">Opening…</main>
  <script src="app.js"></script>
</body>
</html>

La démo SDK place un objet sur la page window.Lia. En dehors de l'application Lia, elle charge toujours, mais chaque appel échoue avec le code not_in_lia, donc vous pouvez afficher un message amical dans un navigateur normal.

#2. Dire bonjour

Appel Lia.init() d'abord. Il répond avec le joueur, un jeton de session pour votre serveur, la personne'langue et thème, et bien plus encore. Lorsque votre page est dessinée, appelez Lia.ready(): jusqu'à ce que cela arrive, Lia affiche son propre chargeur au-dessus de votre application.

app.js

Lia.init().then(
  function (me) {
    // me.player.id is this person's id in your app; me.player.name is their Lia username.
    document.getElementById("app").textContent = "Hello, @" + me.player.name;
    Lia.ready();
  },
  function (error) {
    document.getElementById("app").textContent =
      error.code === "not_in_lia" ? "Open this app inside Lia." : "Something went wrong: " + error.code;
  }
);

Si vous préférez async et await:

try {
  const me = await Lia.init();
  render(me);
  Lia.ready();
} catch (error) {
  if (error.code === "not_in_lia") showOpenInLia();
}

#3. Ouvrez-le dans Lia

Tant que votre application est en test, seule vous et les testeurs que l'équipe Lia a ajoutés peuvent la voir. Ouvrez l'application Lia, allez dans le centre d'applications et ouvrez votre application. Son en-tête indique Test à côté de votre nom, et tout ce qu'il vend coûte des $LIA fictifs.

#4. Essayez quelque chose

Quelques choses à essayer une fois init() a répondu :

// A toast in Lia's own style.
Lia.toast("Welcome in");

// A tap you can feel.
Lia.haptic("success");

// Lia's main button under your app.
Lia.mainButton.setText("Start").show().onClick(function () {
  Lia.mainButton.showProgress();
  startGame().finally(function () { Lia.mainButton.hide(); });
});

// Keep a best score and see the top 50.
Lia.submitScore(1280).then(function () { return Lia.leaderboard(); }).then(console.log);

#5. Ajoutez votre serveur

Pour tout ce qui compte (objets achetés par les gens, $LIA que vous payez), votre serveur doit vérifier ce que la page lui dit. Il reçoit un jeton de session de la page et le vérifie avec votre clé secrète :

server.js

const res = await fetch("https://api.lialabs.org/api/apps/v1/session/verify", {
  method: "POST",
  headers: { Authorization: `Bearer ${process.env.LIA_KEY}`, "Content-Type": "application/json" },
  body: JSON.stringify({ session }),
});
const { valid, playerId } = await res.json();

Vérifiez sur votre serveur le traverse étape par étape.

#Suivant

Comment les applications s'exécutent dans Lia: le cadre, les trois apparences et les règles sous lesquelles votre page s'exécute.
Vendre un article: Lia'la feuille de paiement, de bout en bout.
SDK référence: chaque méthode, propriété et événement.
La démo SDK à https://api.lialabs.org/sdk/demo essais par appel. Elle s'ouvre à l'intérieur de Lia pour les testeurs que l'équipe Lia ajoute à celle-ci.

Traduit automatiquement. L'anglais est la source de vérité. Lire en anglais