detachbox
PagesURL d’aperçu

URL d’aperçu

Ouvrez dans votre navigateur ce que l’agent a construit, vérifiez-le sur votre téléphone ou envoyez-le à un client. Chaque serveur qu’un terminal fait tourner sur 0.0.0.0 reçoit pour cela sa propre adresse HTTPS : https://<port>-<terminal ID>.detachbox.dev. Les liens sont privés au départ, et vous rendez un port public quand vous voulez le partager. Les aperçus appartiennent à leur terminal : ils survivent à un redémarrage du terminal et prennent fin quand vous le terminez.

Fichiers et aperçus d’un terminal sur shipyard. Ports 3000 et 8080 à leur propre adresse HTTPS sur detachbox.dev, port 3000 public. Un rapport de couverture partagé, ouvert 3 fois, avec Révoquer.

Ouvrir un serveur de dev dans votre navigateur

  1. Démarrez le serveur sur 0.0.0.0, sur n’importe quel port de 1024 à 65535.
  2. Dans la barre du terminal, choisissez Fichiers et aperçus. Aperçus liste le port avec son lien.
npm run dev -- --host 0.0.0.0
python3 -m http.server 3000 --bind 0.0.0.0

HTTPS, les websockets et le rechargement à chaud fonctionnent à travers l’aperçu. Deux terminaux peuvent faire tourner des serveurs sur le même port : chacun répond à l’adresse de son propre terminal. Le fichier AGENTS.md partagé apprend aux agents la règle du 0.0.0.0, pour qu’ils vous donnent le lien dès qu’un serveur tourne.

Votre serveur de dev n’a besoin d’aucun réglage d’hôte

Votre serveur voit chaque requête comme si elle venait d’un navigateur sur le même ordinateur : l’hôte est localhost:<port>, et l’origine comme le référent concordent avec lui. Les allowedHosts de Vite, le config.hosts de Rails, les ALLOWED_HOSTS de Django et les origines de dev de Next.js l’acceptent tel quel.

Les server-sent events et les autres réponses en flux passent au fil de l’eau, et une requête peut porter jusqu’à 100 MiB, de quoi envoyer des fichiers à votre app.

Voir ce que sert un terminal

Le panneau Aperçus de la page Fichiers et aperçus d’un terminal liste chaque port en écoute avec le programme qui le sert, son lien, un bouton de copie, un bouton d’ouverture et un QR code. Il vérifie les ports toutes les 10 secondes.

  • Un serveur sur localhost ou 127.0.0.1 reçoit un avertissement et un lien barré : l’aperçu ne peut pas l’atteindre, alors relancez-le sur 0.0.0.0.
  • Un port public où plus rien n’écoute reste listé : son lien répond dès qu’un serveur redémarre sur ce port.
  • Tant que rien n’écoute, le panneau propose des commandes pour démarrer un serveur sur 0.0.0.0, chacune avec un bouton de copie.

Obtenir le lien depuis le terminal

detachbox-preview 3000 affiche l’adresse d’aperçu du port 3000, et detachbox-preview 3000 /admin y ajoute un chemin. La commande prévient quand le serveur n’écoute que sur localhost ou que rien n’écoute encore. detachbox-open http://localhost:3000 ouvre la même adresse dans votre navigateur.

Qui peut ouvrir un aperçu

Les liens sont privés au départ. Vous seul, connecté au tableau de bord, pouvez les ouvrir.

  • La première visite passe par my.detachbox.com pour vérifier que c’est bien vous. L’aperçu reste ensuite ouvert dans ce navigateur pendant 12 heures.
  • Chaque port a son propre laissez-passer. Ouvrir un port n’en ouvre jamais un autre.
  • Un aperçu privé ne répond qu’à ses propres pages. Un autre site ne peut ni l’interroger, ni ouvrir son websocket, ni l’encadrer pour détourner vos clics.
  • Les moteurs de recherche sont priés de n’indexer aucun aperçu, public ou privé.

Ouvrir un aperçu sur votre téléphone

Scannez le QR code du port sur Fichiers et aperçus avec l’appareil photo du téléphone. Un port privé fait d’abord se connecter le téléphone à detachbox, puis ouvre la page. Un port public s’ouvre pour quiconque scanne le code.

Partager un aperçu avec un client

  1. Sur la page Fichiers et aperçus du terminal, trouvez le port sous Aperçus.
  2. Sous Qui peut ouvrir le port 3000, choisissez Public.
  3. Lisez l’avertissement de Rendre le port 3000 public ? et choisissez Rendre public.
  4. Copiez le lien, ou laissez votre client scanner le QR code, et envoyez-le.

Toute personne qui a le lien voit désormais ce que sert le port, sans connexion, y compris quiconque le copie depuis une messagerie, une capture d’écran ou l’historique du navigateur. Rendez le port privé à nouveau quand vous voulez, et le lien se ferme aussitôt pour tous les autres. Une page déjà ouverte chez quelqu’un garde sa connexion en direct jusqu’à ce qu’elle se recharge.

Un terminal peut avoir jusqu’à 20 ports publics. Un port public le reste à travers un redémarrage du terminal.

Quand un aperçu ne s’ouvre pas

La page indiqueQue faire
Cet aperçu est privéIl appartient à un autre compte detachbox. Si le terminal est à vous, choisissez Se connecter avec un autre compte
Ce terminal est terminéOuvrez un nouveau terminal et relancez le serveur pour obtenir un nouveau lien
Ce lien d’aperçu est casséRouvrez le lien depuis Fichiers et aperçus du terminal
L’aperçu ne s’est pas ouvertChoisissez Réessayer ; si l’échec persiste, écrivez au support avec l’identifiant de requête affiché

Un lien qui s’ouvre mais montre une erreur de votre serveur, c’est la réponse de votre serveur : lisez son journal dans le terminal.

Atteindre une base de données ou un autre port TCP

Les URL d’aperçu transportent du HTTP. Lancez les clients de base de données dans le terminal, à côté de la base : psql, redis-cli, sqlite3 et le client MariaDB sont installés. Gardez les données de la base dans un bind mount sous le dossier du projet, et elles survivent au terminal.