MCP : brancher Claude sur tes outilsLeçon 2 sur 8 · Introduction · 6 min
Ce que Claude fait dans mon navigateur connecté
Gratuite
Un cas réel : Claude capture les pages privées de sites où je suis connecté, dans mon propre navigateur, grâce à un serveur MCP. Ce que ça permet, les règles que je lui donne, et la limite que j'ai touchée.
Le problème : toujours le même écran
Pour ma chaîne, je fais des vidéos courtes qui présentent des sites : Lank.li, Kamaradar, et quelques autres. Leur fabrication est racontée dans la formation Ma chaîne de vidéos pilotée par Claude Code. Les premières versions montraient surtout la page d'accueil. Mon retour, noté tel quel dans le rapport de production : « même écran partout / pas connecté ».
Le vrai intérêt de ces sites est derrière la connexion. Un tableau de bord de statistiques, une page de profil, un calculateur de prix. Un navigateur automatisé classique arrive sur ces pages sans session. Il ne voit que le formulaire de connexion.
La solution : Claude dans mon propre navigateur
Claude Code sait piloter ton navigateur grâce à l'extension Claude in Chrome. Pour Claude Code, cette extension est un serveur MCP comme les autres : elle s'appelle claude-in-chrome dans /mcp, et tu peux y lister ses outils.
La différence avec un navigateur automatisé est énorme. Claude ouvre de nouveaux onglets dans ton navigateur à toi, avec tes sessions. D'après la documentation officielle, il peut donc accéder à tous les sites où tu es déjà connecté. Et tu le vois travailler en direct, dans une fenêtre visible.
L'installer
D'après la documentation officielle, il te faut :
- Google Chrome ou Microsoft Edge, ou un autre navigateur basé sur Chromium comme Brave, Arc, Vivaldi ou Opera ;
- l'extension Claude in Chrome, en version 1.0.36 ou plus, depuis le Chrome Web Store ;
- un abonnement Anthropic direct (Pro, Max, Team ou Enterprise), et une connexion à Claude Code par
/login. Avec une clé d'API, l'intégration reste coupée ; - Claude Code lancé hors de WSL, le Linux intégré à Windows : l'extension n'y fonctionne pas.
Ensuite, tu lances Claude Code avec une option :
claude --chromeLa première fois, une fenêtre explique le fonctionnement et les permissions par site : valide avec Entrée. Dans la session, /chrome affiche l'état de la connexion. Tout va bien quand il indique « Status: Enabled » et « Extension: Installed ». Le même menu permet de l'activer par défaut, pour ne plus taper l'option. Si l'extension n'est pas détectée au premier essai, redémarre Chrome.
Ce que Claude a capturé
Pour les promos Kamaradar, j'ai exigé trois angles différents, tous sur des pages où il faut être connecté :
- la page Prix du marché : la fenêtre où l'on saisit un prix, les équipements recalculés, le classement des contributeurs ;
- l'optimiseur de métiers : le Sculpteur, du niveau 1 à 200 ;
- la rentabilité du brisage : la carte de l'objet le plus rentable à briser, avec le coût et le bénéfice net.
Pour Lank.li, deux écrans connectés : le tableau de bord des statistiques et la page de profil.
Claude a fait ces captures avec l'outil computer du serveur : l'action zoom prend un rectangle précis de la page, et l'option save_to_disk enregistre l'image dans un fichier. Un petit script Python de ma chaîne arrondit ensuite les coins et prépare chaque bloc pour la vidéo.
Chargement du schéma…
Les règles que je lui donne
Un navigateur connecté, c'est ta vie privée à l'écran. Mes règles tiennent en trois lignes.
- Jamais la barre du haut ni le menu : ils affichent mon nom, mon avatar et mon e-mail. Claude ne capture que les blocs de contenu.
- La connexion, c'est moi : dès qu'une page demande de se connecter, Claude me le dit et je m'en occupe. La documentation officielle prévoit ce cas : face à une page de connexion ou à un CAPTCHA, Claude s'arrête et te demande de le gérer toi-même.
- Des écrans différents à chaque vidéo : c'était tout l'intérêt de passer par mon compte.
La limite que j'ai touchée
Dans ma chaîne de production, ces captures sont restées des images fixes. Les scènes Kamaradar sont donc des blocs zoomés, sans curseur qui bouge.
Pour de vraies scènes de navigation filmées, avec des clics calés sur la voix, je suis passé par autre chose : des scripts Playwright. Un premier script ouvre un navigateur à part, où je me connecte moi-même. Les scripts de capture réutilisent ensuite cette session, font les clics prévus et notent chacun avec son instant exact.
Voilà la leçon que j'en tire. Le serveur MCP est parfait pour explorer et agir une fois, dans ton vrai contexte. Un script est meilleur pour ce qui doit se refaire à l'identique, vidéo après vidéo.
Ce que l'extension sait faire d'autre
La documentation officielle liste d'autres usages, tous utiles à un développeur web :
- lire les erreurs de la console et l'état du DOM, puis corriger le code qui les provoque ;
- tester un formulaire sur ton serveur local et vérifier les messages d'erreur ;
- remplir un formulaire web à partir d'un fichier CSV, ligne par ligne ;
- joindre un fichier de ta machine dans un champ d'envoi, jusqu'à 10 Mo. Depuis la version 2.1.293, Claude refuse d'envoyer un fichier comme
.env, une clé.pemou le contenu de.ssh; - extraire des données d'une page et les enregistrer en CSV ;
- enregistrer une session en GIF animé pour la montrer.
Par exemple, sur le site que tu lis en ce moment, en local :
Ouvre http://localhost:3200 et lis la console : y a-t-il des erreurs au chargement de la page d'accueil ?Les autres outils branchés
Le navigateur n'est qu'un serveur parmi d'autres. D'après la documentation de Figma, son serveur MCP lit le contexte d'une maquette (composants, variables, mise en page) et génère du code à partir des cadres sélectionnés. Mes connecteurs claude.ai donnent accès à Gmail, Google Agenda, Google Drive et Notion.
Chaque serveur ajoute des outils. Claude choisit lequel appeler selon ta demande, et chaque appel porte le nom de son serveur.
Ce que la suite t'apporte
Tu as vu le résultat. La suite de la formation te donne la méthode :
- brancher un serveur en une commande, en HTTP ou en local, et diagnostiquer celui qui ne répond pas ;
- choisir la portée de chaque serveur, et partager un
.mcp.jsonavec ton équipe sans y laisser de clé ; - installer les serveurs qui servent vraiment : navigateur, GitHub, Figma, documentation ;
- régler les permissions, pour qu'un serveur ne fasse que ce que tu autorises ;
- écrire ton propre serveur en TypeScript, le tester, puis le brancher ;
- comprendre pourquoi ma chaîne publie ses vidéos par un script et pas par un serveur MCP.
Envie de la suite ?
La leçon 3 et toute la suite font partie de l’accès complet.
Paiement sécurisé par Stripe. Pas de compte à créer avant. Déjà abonné ? Me connecter