Désactiver l'élément Bridge dans l'écran

Ce tutoriel explique comment supprimer le pont de l'écran de chargement du serveur FiveM
en créant ou en modifiant une ressource d'écran de chargement.

Prérequis

Accès au serveur FiveM avec autorisations de modification des ressources
Compréhension de base du HTML/CSS
un éditeur de texte comme Bloc-notes++ (ou le bloc-notes par défaut de Windows)

Méthode 1 : Créer une nouvelle ressource d'écran de chargement

Étape 1 : Créer une structure de ressources

loadingscreen/ ├── fxmanifest.lua ├── index.html └── style.css

Étape 2 : Configurer fxmanifest.lua

fx_version 'cerulean'
game 'gta5'

author 'YourName'
description 'Écran de chargement personnalisé - Pont désactivé'
version '1.0.0'

loadscreen 'index.html'
loadscreen_cursor 'yes'

files {
 'index.html',
 'style.css'
}

Étape 3 : Créer index.html

<!DOCTYPE html>
<html>
<head>
 <link rel="stylesheet" href="style.css">
</head>
<body>
 <div id="loading-container">
 <h1>Nom du serveur</h1>
 <div class="progress-bar">
 <div class="progress-fill"></div>
 </div>
 </div>
 
 <script>
 // Disable bridge overlay
 window.addEventListener('DOMContentLoaded', () => {
 const bridge = document.querySelector('.bridge-overlay');
 if (bridge) bridge.remove();
 });
 
 // Handle loading progress
 window.addEventListener('message', (e) => {
 if (e.data.eventName === 'loadProgress') {
 const fill = document.querySelector('.progress-fill');
 fill.style.width = e.data.loadFraction * 100 + '%';
 }
 });
 </script>
</body>
</html>

Étape 4 : Ajouter à server.cfg

assurer l'écran de chargement

Méthode 2 : Modifier l'écran de chargement existant

Étape 1 : Localiser la ressource de l'écran de chargement actuel Vérifier serveur.cfg pour les lignes commençant par assurer ou commencer contenant « chargement » ou « écran de chargement »

Étape 2 : ajouter le code de suppression du pont Insérer dans le fichier HTML existant avant de fermer </body> étiqueter:

<script>
 // Remove bridge on load
 document.addEventListener('DOMContentLoaded', function() {
 const bridgeElements = document.querySelectorAll(
 '.bridge-overlay, #bridge, [class*="bridge"]'
 );
 bridgeElements.forEach(el => el.style.display = 'none');
 });
 
 // Backup removal for dynamically loaded elements
 const observer = new MutationObserver((mutations) => {
 mutations.forEach((mutation) => {
 mutation.addedNodes.forEach((node) => {
 if (node.nodeType === 1 && 
 (node.classList?.contains('bridge-overlay') || 
 node.id === 'bridge')) {
 node.remove();
 }
 });
 });
 });
 
 observer.observe(document.body, {
 childList: true,
 subtree: true
 });
</script>

Méthode de remplacement CSS

Ajoutez au fichier CSS de votre écran de chargement :

.bridge-overlay,
#bridge,
[class*="bridge-"] {
 display: none !important;
 visibility: hidden !important;
 opacity: 0 !important;
}

Dépannage

Pont toujours visible :

Vider le cache du serveur : Supprimer cache/ dossier
Vérifier l'ordre de chargement des ressources dans serveur.cfg
Vérifiez la console du navigateur (F12) pour les erreurs JavaScript

L'écran de chargement n'apparaît pas :

Confirmer écran de chargement directive dans fxmanifest.lua
Vérifier que les chemins d'accès aux fichiers correspondent exactement (sensible à la casse)
Vérifiez la console du serveur pour les erreurs de ressources

Notes techniques

Les écrans de chargement FiveM fonctionnent dans CEF (Chromium Embedded Framework)
Élément de pont généralement injecté par les mécanismes de chargement par défaut
MutationObserver assure la suppression des éléments ajoutés dynamiquement

Incertitudes

Les noms exacts des classes d'éléments de pont peuvent varier entre les versions de FiveM
Certains frameworks personnalisés peuvent utiliser différentes implémentations de superposition

Résumé: Supprimez la superposition de pont de FiveM en créant une ressource d'écran de chargement personnalisée avec JavaScript qui cible et supprime les éléments de pont lors du chargement de la page.

Comment créer un écran de chargement personnalisé

Liste de contrôle pratique

Utilisez ce guide comme liste de vérification avant de modifier un serveur FiveM en production. Assurez-vous de la version actuelle des artefacts serveur, de la version du framework, des dépendances des ressources, des modifications de la base de données et des fichiers côté client avant d'appliquer la modification.

Sauvegardez les fichiers de configuration et les tables de base de données concernés.
Appliquez d'abord la modification sur un serveur de test.
Surveillez la console du serveur et la console F8 du client pour détecter les erreurs.
Vérifiez si la modification affecte les emplois, l'inventaire, les véhicules, les cartes, la voix, les autorisations ou les données des joueurs.
Documentez précisément le fichier, la commande ou le paramètre que vous avez modifié afin de pouvoir le rétablir rapidement.

Tests avant production

Après le premier test, connectez-vous avec un compte joueur standard et répétez le processus du point de vue du joueur. Si le sujet concerne les performances, effectuez des mesures avant et après en conservant le même nombre de joueurs, le même parcours et les mêmes ressources. Si le sujet concerne les outils d'administration ou les permissions, vérifiez les utilisateurs autorisés et ceux qui n'y sont pas autorisés.

Erreurs courantes

La plupart des problèmes rencontrés avec FiveM proviennent de dépendances manquantes, d'un cache obsolète, de noms de dossiers incorrects, d'incompatibilités de frameworks ou d'une configuration copiée depuis un autre serveur. Évitez de modifier plusieurs systèmes simultanément ; effectuez une modification, testez-la, puis poursuivez.

Ressources connexes

Pour les ressources prêtes à la production, comparez les ressources payantes dans le Boutique FiveMX. Pour accéder à des ressources gratuites, consultez Scripts FiveM gratuits et tester chaque ressource avant de l'utiliser publiquement.

Notes de déploiement de la production

Avant d'appliquer ces instructions sur un serveur FiveM en production, définissez précisément le résultat attendu. Pour la désactivation de l'élément de pont dans l'écran de chargement FiveM, vérifiez quelle ressource, quel paramètre, quelle commande ou quel processus est concerné et assurez-vous que la modification est compatible avec votre infrastructure, votre version d'artefacts et les règles de votre serveur. Déployez la modification progressivement afin de pouvoir l'annuler rapidement en cas d'erreur signalée par les joueurs.

Utilisez un serveur de test avec la même infrastructure, le même schéma de base de données, le même ordre de ressources et les mêmes dépendances clés que le serveur de production. Si le sujet abordé modifie le gameplay, les permissions, les graphismes, le doublage, les véhicules, les cartes, l'inventaire ou le comportement économique, effectuez des tests avec au moins un compte administrateur et un compte joueur. Surveillez la sortie de la console du serveur, les journaux F8 du client et le temps d'accès aux ressources tout en reproduisant exactement le parcours de jeu qui se déroulera sur le serveur de production.

Liste de contrôle de restauration

Sauvegardez le fichier de configuration précédent, le dossier de ressources et l'état de la base de données avant toute modification.
Notez la version de la ressource, le commit, la page de téléchargement ou la valeur du paramètre que vous avez testée.
Redémarrez d'abord uniquement la ressource concernée lorsque cela est possible, puis redémarrez le serveur complet si des dépendances l'exigent.
En cas d'erreur, rétablissez la ressource ou le paramètre modifié avant de tester une autre solution.

Conseils d'entretien

Revérifiez cette configuration après chaque mise à jour des artefacts FiveM, du framework ou modification importante des ressources. Une configuration fonctionnelle aujourd'hui peut devenir inutilisable suite à des mises à jour de dépendances, des modifications d'exports, des changements d'événements ou des migrations de base de données. Conservez des notes dans la documentation de votre serveur afin que les futurs administrateurs comprennent les modifications apportées, leurs raisons et comment les reproduire.

Examen en cours

Revérifiez l'option « Désactiver l'élément de pont dans l'écran de chargement FiveM » après les mises à jour majeures des artefacts, les modifications du framework ou les migrations de ressources de FiveM. Assurez-vous que le conseil est toujours d'actualité, que les sources liées restent disponibles et que les étapes d'installation correspondent toujours aux fichiers que le propriétaire du serveur téléchargera ou configurera.

Pour les serveurs publics, conservez un bref historique des modifications à côté de la documentation du serveur. Indiquez ce qui a été testé, ce qui a changé, les comptes utilisés pour la vérification et la procédure de retour en arrière. Cela facilitera la maintenance future et évitera que les anciennes notes de configuration ne deviennent obscures ou dangereuses pour les joueurs.