Map Blueprint

Hébergez Map Blueprint sur un serveur cloud

Mettez votre instance sur un serveur toujours allumé, un ordinateur qui tourne dans un centre de données 24h/24, pour que vos coéquipiers distants puissent y accéder de n'importe où, avec votre propre adresse web et un HTTPS gratuit (le cadenas qui chiffre la connexion). Ce guide utilise le niveau Toujours Gratuit d'Oracle Cloud, qui peut faire tourner Map Blueprint sans coût mensuel, mais les mêmes étapes fonctionnent sur n'importe quel serveur cloud Ubuntu.

Ce que vous obtiendrez au final : un petit serveur Linux faisant tourner Map Blueprint en continu, accessible à une adresse du type https://maps.yourdomain.com, protégé par le mot de passe de votre équipe, et se redémarrant automatiquement après les redémarrages. Prévoyez environ 20 à 30 minutes. Partout où vous voyez YOUR_… ci-dessous, remplacez-le par votre propre valeur.

Vous préférez simplement le lancer sur votre propre portable ? Consultez le guide d'hébergement local.

Quelques mots que vous rencontrerez : un serveur est un ordinateur qui tourne en permanence pour que d'autres puissent se connecter ; SSH est une manière sécurisée de taper des commandes sur cet ordinateur distant depuis le vôtre ; un domaine est votre adresse web (comme yourdomain.com) ; DNS est le carnet d'adresses d'internet qui fait pointer un domaine vers un serveur ; HTTPS est la version chiffrée et cadenassée d'une adresse web ; un reverse proxy et un tunnel sont deux façons de placer HTTPS devant l'app. Ne vous inquiétez pas, chaque étape ci-dessous vous dit exactement quoi faire.

Étape 1, Créez un serveur gratuit

  1. Inscrivez-vous sur Oracle Cloud Free Tier et connectez-vous à la console (le site web d'Oracle pour gérer vos serveurs).
  2. Allez dans Compute → Instances → Create instance. Une « instance » est simplement le mot d'Oracle pour un serveur.
  3. Choisissez une forme éligible au niveau Toujours Gratuit (la taille du serveur, « shape » est le mot d'Oracle pour cela). L'une ou l'autre convient : VM.Standard.E2.1.Micro ou une forme Arm Ampere (qui a plus de mémoire). Gardez l'image Ubuntu par défaut, Ubuntu est la version de Linux utilisée dans ce guide.
  4. Sous Add SSH keys, choisissez Generate a key pair for me et téléchargez la clé privée, ce petit fichier est ce qui prouve que c'est bien vous lors de la connexion, alors gardez-le dans un endroit sûr. (Vous avez déjà votre propre clé ? Collez plutôt sa moitié publique.)
  5. Cliquez sur Create. Quand le serveur tourne, copiez son adresse IP publique (le numéro du serveur sur internet), ce guide l'appelle YOUR_SERVER_IP.

Étape 2, Ouvrez le pare-feu

Un pare-feu bloque les connexions réseau inattendues. Oracle bloque le trafic web entrant par défaut, vous devez donc l'autoriser sur les deux ports web standards, 80 (web simple) et 443 (web sécurisé) :

  1. Ouvrez votre instance → cliquez sur son Virtual Cloud Network / sous-réseau → Security Lists → la liste par défaut. (C'est le pare-feu d'Oracle.)
  2. Ajoutez des Ingress Rules (« ingress » signifie simplement entrant) qui autorisent le TCP depuis 0.0.0.0/0 (c'est-à-dire « depuis n'importe où ») vers les ports 80 et 443.
Ubuntu sur Oracle possède aussi son propre pare-feu local. Après vous être connecté à l'étape 3, autorisez les deux mêmes ports en collant ces trois lignes (chaque ligne est une commande ; la troisième enregistre la règle pour qu'elle survive aux redémarrages) : 
sudo iptables -I INPUT 6 -m state --state NEW -p tcp --dport 80 -j ACCEPT
sudo iptables -I INPUT 6 -m state --state NEW -p tcp --dport 443 -j ACCEPT
sudo netfilter-persistent save
Si vous utilisez l'option Cloudflare Tunnel à l'étape 5, vous pouvez complètement éviter d'ouvrir les ports 80/443.

Étape 3, Connectez-vous au serveur

Vous allez maintenant vous connecter au serveur et taper des commandes dessus depuis votre propre ordinateur, à l'aide de SSH. Ouvrez un terminal (sous Windows, utilisez PowerShell, il inclut déjà ssh) et exécutez ceci, en pointant -i vers le fichier de clé privée que vous avez téléchargé :

ssh -i /path/to/YOUR_PRIVATE_KEY ubuntu@YOUR_SERVER_IP

Sur Mac ou Linux, si vous obtenez une erreur « permissions are too open » à propos de la clé, exécutez d'abord chmod 600 /path/to/YOUR_PRIVATE_KEY, cela restreint le fichier pour que vous seul puissiez le lire, ce que SSH exige.

Une fois connecté (votre invite de commande affiche désormais le serveur), installez les dernières mises à jour système :

sudo apt update && sudo apt upgrade -y

sudo signifie « exécuter ceci en tant qu'administrateur » ; apt est l'installateur d'applications intégré d'Ubuntu.

Étape 4, Envoyez et lancez Map Blueprint

Il n'y a rien à installer sur le serveur, pas de Docker, pas de Node, pas de .env. C'est un programme autonome unique. Depuis votre propre ordinateur (une nouvelle fenêtre de terminal, pas la session SSH), exécutez ceci depuis le dossier où vous avez décompressé le téléchargement pour copier le programme Linux vers le serveur. scp signifie « copie sécurisée », il envoie un fichier via la même connexion SSH sécurisée :

scp -i /path/to/YOUR_PRIVATE_KEY ./map-blueprint-linux ubuntu@YOUR_SERVER_IP:~/

De retour dans la session SSH, rendez le programme exécutable et démarrez-le. HOST=0.0.0.0 lui indique d'accepter les connexions de l'extérieur, pour que l'étape HTTPS suivante puisse l'atteindre :

chmod +x ~/map-blueprint-linux
HOST=0.0.0.0 ~/map-blueprint-linux

Il écoute maintenant sur le port 8080. Vous définirez le mot de passe de votre équipe depuis le navigateur une fois HTTPS en place (étape suivante). Pour l'instant, appuyez sur Ctrl-C pour l'arrêter, l'étape 6 le transforme en un service qui tourne 24h/24.

config.json et vos cartes data/ sont créés juste à côté du programme dans votre dossier personnel (~/). Tous les réglages se trouvent sur la page Réglages intégrée à l'app, il n'y a aucun fichier à modifier.

Étape 5, Ajoutez votre domaine et un HTTPS gratuit

L'app parle le HTTP simple et est conçue pour se placer derrière quelque chose qui ajoute HTTPS (le cadenas chiffré). Choisissez l'une de ces deux approches, l'option A est la plus facile à sécuriser.

Option A, Cloudflare Tunnel (aucun port ouvert, la plus facile à sécuriser)

Un tunnel connecte votre serveur vers Cloudflare, pour que les visiteurs atteignent l'app via Cloudflare sans qu'aucun port ne soit ouvert sur votre serveur.

  1. Ajoutez votre domaine à un compte Cloudflare gratuit.
  2. Sur le serveur, installez cloudflared (l'outil de tunnel de Cloudflare) et connectez-vous : 
    curl -fsSL https://pkg.cloudflare.com/install.sh | sudo bash
sudo apt install -y cloudflared
cloudflared tunnel login
  3. Créez un tunnel et faites pointer l'adresse web de votre choix vers le port local de l'app : 
    cloudflared tunnel create mapblueprint
cloudflared tunnel route dns mapblueprint maps.YOURDOMAIN.com
  4. Indiquez au tunnel d'envoyer le trafic vers http://localhost:8080 dans sa configuration, puis installez-le comme service en arrière-plan pour qu'il tourne toujours : 
    sudo cloudflared service install

Cloudflare crée et renouvelle le certificat HTTPS pour vous automatiquement, et rien sur votre serveur n'est exposé directement, vous pouvez laisser les ports 80/443 fermés.

Option B, Reverse proxy Caddy (certificat automatique)

Caddy est un petit serveur web qui se place devant l'app, ajoute HTTPS, et y redirige les visiteurs, c'est ce que fait un reverse proxy.

  1. Faites pointer un enregistrement A DNS pour maps.YOURDOMAIN.com vers YOUR_SERVER_IP. (Un « enregistrement A » est l'entrée DNS qui associe un nom à l'IP d'un serveur, définissez-le chez votre bureau d'enregistrement de domaine ou votre fournisseur DNS.)
  2. Installez Caddy sur le serveur.
  3. Mettez ceci dans le fichier /etc/caddy/Caddyfile (il indique à Caddy : sers cette adresse, et redirige les visiteurs vers l'app sur le port 8080) : 
    maps.YOURDOMAIN.com {
    reverse_proxy localhost:8080
}
  4. Rechargez Caddy pour qu'il prenne en compte le changement : 
    sudo systemctl reload caddy

Caddy récupère et renouvelle automatiquement un certificat Let's Encrypt gratuit pour vous. Cette option nécessite que les ports 80 et 443 soient ouverts (étape 2).

Map Blueprint marque automatiquement son cookie de connexion comme Secure dès que les requêtes arrivent via HTTPS (il lit l'en-tête X-Forwarded-Proto que les deux options ci-dessus définissent), donc les connexions sont protégées sans configuration supplémentaire.

Rendez-vous sur https://maps.YOURDOMAIN.com, vous devriez voir la page de connexion. Connectez-vous et partagez ce lien avec votre équipe.

Facultatif, verrouillez-le avec Cloudflare Zero Trust

Vous voulez un second verrou, plus solide ? Le « Access » de Cloudflare Zero Trust place un écran de connexion devant votre app, pour que les inconnus n'atteignent même jamais Map Blueprint, Cloudflare vérifie d'abord qui vous êtes. Cela fonctionne le mieux avec l'Option A (le Cloudflare Tunnel) ci-dessus, et vous permet d'accorder l'accès personne par personne par e-mail au lieu de partager un seul mot de passe. C'est gratuit pour les petites équipes.

  1. Dans le tableau de bord Cloudflare, ouvrez Zero Trust (configurez le plan gratuit si c'est votre première fois).
  2. Allez dans Access → Applications → Add an application → Self-hosted.
  3. Définissez le domaine de l'application sur la même adresse web que celle servie par le tunnel (maps.YOURDOMAIN.com).
  4. Ajoutez une politique d'accès qui autorise seulement les adresses e-mail de vos coéquipiers (ou tout un domaine d'e-mail comme @yourstudio.com), puis enregistrez.
  5. Désormais, visiter le site affiche une connexion Cloudflare qui envoie par e-mail un code PIN à usage unique (ou utilise la connexion Google / GitHub). Seules les personnes approuvées accèdent à l'app.

C'est le même type de barrière d'identité que les créateurs de Map Blueprint utilisent sur leur propre carte interne. Même si quelqu'un découvre votre URL, il ne peut pas charger l'app sans passer le contrôle d'identité, idéal pour une carte de studio privée.

Étape 6, Maintenez-le en marche après les redémarrages

Enfin, transformez l'app en service pour qu'elle démarre au boot et se redémarre d'elle-même si elle s'arrête un jour. (Un « service » est un programme que Linux surveille en arrière-plan.) Enregistrez le texte ci-dessous dans le fichier /etc/systemd/system/map-blueprint.service :

[Unit]
Description=Map Blueprint
After=network.target

[Service]
WorkingDirectory=/home/ubuntu
Environment=HOST=0.0.0.0
ExecStart=/home/ubuntu/map-blueprint-linux
Restart=always
User=ubuntu

[Install]
WantedBy=multi-user.target

Puis activez-le, rechargez la liste des services, activez-le et démarrez-le, et vérifiez qu'il tourne :

sudo systemctl daemon-reload
sudo systemctl enable --now map-blueprint.service
sudo systemctl status map-blueprint.service

WorkingDirectory=/home/ubuntu garde config.json et vos cartes data/ dans le dossier personnel, à côté du programme. Maintenant, ouvrez https://maps.YOURDOMAIN.com, complétez l'écran de Configuration du premier lancement, et définissez tout de suite le mot de passe de votre équipe. (Vous préférez le définir à l'avance ? Ajoutez Environment=APP_PASSWORD=YOUR_PASSWORD au fichier de service.)

Liste de contrôle de sécurité

Mise à jour vers une nouvelle version

Quand vous obtenez un programme mis à jour, arrêtez le service, remplacez le fichier du programme, et redémarrez-le, vos cartes config.json et data/ restent intactes. Envoyez le nouveau map-blueprint-linux depuis votre ordinateur (avec scp, comme à l'étape 4), puis sur le serveur exécutez :

sudo systemctl stop map-blueprint.service
chmod +x ~/map-blueprint-linux
sudo systemctl start map-blueprint.service