Une page web dans le jeu

FiveM embarque un navigateur. Une ressource peut afficher une page web par-dessus le jeu : menus, inventaires, téléphones, guichets. On l'appelle l'interface NUI. Elle s'écrit en HTML, CSS et JavaScript, exactement comme un site ; le script Lua côté client la pilote.

Déclarer la page

Dans le fxmanifest.lua de la ressource :

ui_page 'html/index.html'

files {
    'html/index.html',
    'html/style.css',
    'html/script.js',
}

Du jeu vers la page : SendNUIMessage

SendNUIMessage({ action = 'ouvrir', solde = 250 })

La table Lua arrive dans la page sous forme d'objet JavaScript, par l'événement message de window :

window.addEventListener("message", (e) => {
    if (e.data.action === "ouvrir") { ... }
});

Le champ action n'a rien d'obligatoire : c'est une convention qui permet à la page de savoir quoi faire du message.

De la page vers le jeu : fetch et RegisterNUICallback

La page envoie une requête à une adresse spéciale, formée du nom de la ressource :

fetch(`https://${GetParentResourceName()}/fermer`, {
    method: "POST",
    body: JSON.stringify({}),
});

GetParentResourceName() donne ce nom : ne jamais l'écrire en dur, la ressource peut être renommée par l'administrateur du serveur.

Côté Lua, le rappel du même nom la reçoit :

RegisterNUICallback('fermer', function(data, cb)
    SetNuiFocus(false, false)
    cb('ok')
end)

data contient le corps envoyé par la page ; cb renvoie la réponse, que la page lit avec await reponse.json(). Toujours appeler cb : sans réponse, la requête de la page reste en attente.

Le focus

SetNuiFocus(true, true)    -- clavier, souris : la page peut être utilisée
SetNuiFocus(false, false)  -- le joueur reprend la main sur le jeu

Oublier de rendre le focus est le bug NUI le plus courant : l'interface est fermée, mais le joueur ne peut plus bouger.

La règle de sécurité

Tout ce qui vient de la page vient du joueur : il peut ouvrir les outils de développement du navigateur du jeu et envoyer n'importe quoi à vos rappels. Le client vérifie pour aider le joueur (un message d'erreur clair) ; le serveur vérifie pour protéger le serveur -- le parcours Sécurité FiveM le détaille.