Comment auto-héberger Excalidraw en 2026 : collaboration, TLS et périmètres des données

Si vous avez déjà essayé d’auto-héberger Excalidraw, cet état frustrant vous est probablement familier : l’interface s’affiche, mais elle se charge alors que la collaboration échoue parce que son endpoint WebSocket est incorrect. Recréer le conteneur suffit rarement à résoudre un désaccord entre les URLs, l’état et les dépendances.

Ce guide s’appuie sur un critère de réussite concret : dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré, puis reconnecter un deuxième navigateur. Chaque choix de configuration est évalué par rapport à ce critère, et non à un simple badge indiquant que le conteneur est opérationnel.

Restaurer Excalidraw sur un hôte vierge

Pour le déploiement de base d’Excalidraw, la couche de conteneurs est jetable et aucun volume de données n’est nécessaire. Le manifeste de reprise ne contient aucune donnée serveur dans l’image de base ; sauvegardez tout service de collaboration séparé. Gardez le digest de l’image, la configuration et les éventuels assets gérés séparément sous contrôle des changements.

Supprimez et recréez le service dans un environnement propre, puis vérifiez que le client se reconstruit à partir de son image épinglée et que le room service séparé restaure tout état de collaboration qu’il promet de conserver. Le guide du dépôt Git à la production constitue ici le modèle pertinent : reconstruire l’artefact et sauvegarder uniquement l’état externe qui existe réellement.

Ne qualifiez pas un répertoire de persistant tant qu’Excalidraw n’y écrit pas de données utiles. Les montages vides ou inutilisés donnent une fausse impression de sécurité et incitent les opérateurs suivants à chercher l’état au mauvais endroit.

Cartographier Excalidraw avant de toucher à Docker

Le processus HTTP d’Excalidraw écoute sur le port 80 ; gardez ce port sur le réseau applicatif et ne publiez que la route de la plateforme. L’exigence du runtime local est un room server et une couche de stockage distincts pour assurer une collaboration persistante. Gérez explicitement leur cycle de vie afin que le déplacement d’Excalidraw d’un hôte à un autre ne modifie pas silencieusement son comportement.

Formalisez ce périmètre dans un court contrat : qui est responsable de l’exigence, quel credential est utilisé, quel timeout est acceptable et comment l’échec se manifeste. Exécutez ensuite cette transaction : dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré, puis reconnecter un deuxième navigateur. Observez la diffusion des assets statiques pour l’image de base, les connexions WebSocket et l’état des rooms relevant du service de collaboration séparé pendant l’exécution, car cette charge fournit une taille de départ plus utile qu’un conteneur inactif.

Un test d’acceptation de production pour Excalidraw

Une release candidate d’Excalidraw mérite de recevoir du trafic lorsqu’elle réussit un scénario fixe : dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré, puis reconnecter un deuxième navigateur. Capturez le digest de l’image, la configuration effective non secrète, l’origine publique et les timestamps associés à ce scénario. Les données de test doivent être jetables, mais suffisamment réalistes pour emprunter le même chemin que les utilisateurs.

Exécutez ce test après avoir remplacé le runtime, puis reconstruisez le service à partir de l’image de base, qui ne contient aucune donnée serveur ; sauvegardez tout service de collaboration séparé. La reprise est validée lorsque le client se reconstruit à partir de son image épinglée et que le room service séparé restaure tout état de collaboration qu’il promet de conserver. Comparez avec la release précédente les mesures de ressources liées à la diffusion des assets statiques pour l’image de base, les connexions WebSocket et l’état des rooms relevant du service de collaboration séparé, puis analysez toute dérive significative avant la mise en production.

Enfin, provoquez cet échec contrôlé : envoyez une entrée inoffensive proche de la limite de ressource ou de format associée à ce périmètre : l’interface se charge, mais la collaboration échoue parce que son endpoint WebSocket est incorrect. Vérifiez qu’Excalidraw explique l’échec, ne détériore pas l’état existant et reprend son fonctionnement lorsque la condition valide est rétablie. Conservez un extrait de log anonymisé ainsi que le temps de reprise. Ensemble, ces vérifications couvrent le comportement, la durabilité et l’exploitabilité, et pas seulement la disponibilité du processus.

Transformer la commande locale en service inspectable

Un lancement proche de la production est volontairement banal : état nommé, port explicite et aucun secret dans l’image.

docker run -d \
  --name excalidraw \
  --restart unless-stopped \
  -p 127.0.0.1:80:80 \
  excalidraw/excalidraw:latest

Cet exemple constitue une base, et non une stack complète pour les services associés. Confirmez l’exigence locale avant toute exposition : un room server et une couche de stockage distincts pour assurer une collaboration persistante. Vérifiez les montages effectifs et le listener, puis essayez de dessiner et d’exporter un diagramme, de partager un lien de collaboration via le room service configuré et de reconnecter un deuxième navigateur. Épinglez l’image qui fonctionne avant le prochain redémarrage.

Décisions de sécurité propres à Excalidraw

Avec Excalidraw, la rotation des comptes n’est pas la tâche de hardening, car l’image standard ne possède aucun account store. Concentrez-vous sur l’hypothèse selon laquelle l’image statique seule fournirait un stockage durable des rooms partagées ; protégez les rooms de collaboration privées et n’affirmez pas qu’une collaboration durable est assurée lorsque seule l’image web d’Excalidraw est déployée.

Utilisez HTTPS, une authentification optionnelle au niveau de la plateforme et un digest d’image vérifié. Ne montez aucune donnée hôte sans rapport et limitez la charge représentée par la diffusion des assets statiques pour l’image de base, les connexions WebSocket et l’état des rooms relevant du service de collaboration séparé. Un client externe propre doit voir le build attendu, tandis qu’un client non autorisé doit être rejeté avant d’atteindre le conteneur lorsque l’accès est restreint.

Router Excalidraw sans donner une fausse impression de HTTPS

L’émission du certificat TLS ne constitue que la moitié du routage d’Excalidraw. Servez le client en HTTPS et configurez séparément les endpoints de collaboration. Acheminez le trafic en interne vers le port 80 et transmettez le scheme externe afin que les URLs générées et les cookies sécurisés restent cohérents.

Utilisez le scénario Excalidraw complet depuis un réseau propre, et pas uniquement la page racine. Une erreur 502 ou un problème de certificat peut être isolé grâce à la configuration automatique du domaine et du TLS. Si le trafic atteint le processus et que l’interface se charge, mais que la collaboration échoue parce que son endpoint WebSocket est incorrect, diagnostiquez cette condition là où elle se produit au lieu d’empiler les redirections.

Mettre à niveau Excalidraw sans deviner

L’indicateur de service utile pour Excalidraw est la réussite de « dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré et reconnecter un deuxième navigateur ». Associez ce résultat à la diffusion des assets statiques pour l’image de base, aux connexions WebSocket et à l’état des rooms relevant du service de collaboration séparé ; une page racine affichant un statut positif ne dit rien de la compatibilité des sorties ni de l’épuisement des ressources.

Avant de remplacer l’image, prenez en compte ce risque : les versions du frontend, du room server et du stockage doivent être testées ensemble, sans supposer que le client statique possède les données partagées. Testez des entrées représentatives et proches des limites sur les deux versions et conservez l’ancien digest jusqu’à la validation de la candidate. Si l’interface se charge, mais que la collaboration échoue parce que son endpoint WebSocket est incorrect, inspectez le format de la requête, le comportement du client et les logs du runtime avant de modifier les paramètres de routage ou de stockage.

Utiliser Dockup pour la couche plateforme

Un template Excalidraw en un clic doit intégrer le digest de l’image, le port 80, les paramètres de health check, le domaine et le TLS. Comme le service de base est stateless, Dockup peut le recréer directement sur le compute Dockup ou sur une machine attachée, sans faire passer un volume vide pour une sauvegarde.

Après le lancement, servez le client en HTTPS et configurez séparément les endpoints de collaboration. Dockup doit conserver les paramètres du runtime Excalidraw tandis que l’opérateur confirme l’exigence locale suivante : un room server et une couche de stockage distincts pour assurer une collaboration persistante. Vérifiez ce résultat : dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré, puis reconnecter un deuxième navigateur. Toute extension stateful ultérieure doit déclarer son propre montage, son secret et son test de restauration, sans modifier silencieusement la signification du template de base.

Foire aux questions

De quoi Excalidraw a-t-il besoin pour un déploiement en production ?

Acheminez le conteneur Excalidraw sur le port 80 via une origine HTTPS unique. L’exigence du runtime local est un room server et une couche de stockage distincts pour assurer une collaboration persistante. Ne considérez pas Excalidraw comme prêt tant que vous ne pouvez pas dessiner et exporter un diagramme, partager un lien de collaboration via le room service configuré et reconnecter un deuxième navigateur.

Quelles données Excalidraw doivent figurer dans une sauvegarde ?

L’image Excalidraw standard ne nécessite aucun montage de données applicatives. Conservez sa configuration de déploiement et sauvegardez séparément tout état connecté ; la reprise est validée lorsque le client se reconstruit à partir de son image épinglée et que le room service séparé restaure tout état de collaboration qu’il promet de conserver.

Excalidraw nécessite-t-il HTTPS derrière un reverse proxy ?

Utilisez HTTPS pour l’origine publique d’Excalidraw et conservez le port 80 sur la route interne. Appliquez correctement le paramètre Excalidraw : servez le client en HTTPS et configurez séparément les endpoints de collaboration. Pour Excalidraw, HTTPS protège les credentials ou le contenu utilisateur pendant leur transit et garantit un comportement cohérent du client dépendant de l’origine.

Comment tester une mise à niveau d’Excalidraw ?

Déployez l’image candidate d’Excalidraw à côté de la version actuelle et répétez la transaction d’acceptation avec des entrées connues. Soyez particulièrement attentif au fait que les versions du frontend, du room server et du stockage doivent être testées ensemble, sans supposer que le client statique possède les données partagées. Le conteneur standard n’effectue aucune migration de données ; conservez donc le digest précédent jusqu’à la validation des contrôles de sortie et de compatibilité.