Donnez à Pi Agent les Outils pour Explorer et Interagir avec le Web via Bright Data Web MCP

Dans cet article de blog, vous apprendrez :

• Ce qu’est Pi et ce qu’il apporte en tant que solution d’agent CLI.
• Pourquoi l’étendre avec des outils d’accès web le rend bien plus puissant.
• Comment activer ces fonctionnalités dans Pi Agent grâce à l’intégration Bright Data Web MCP.

Plongeons dans le vif du sujet !

Qu’est-ce que Pi ?

Pi, également connu sous le nom de Pi Agent ou Pi Coding Agent, est un agent CLI extensible. Son objectif est de vous aider à exécuter des workflows de codage pilotés par l’IA directement dans le terminal.

Contrairement à d’autres agents CLI qui vous enferment dans des fonctionnalités fixes comme les modes de planification ou les sous-agents, Pi reste léger dans son cœur. Il vous permet plutôt de tout étendre via des extensions TypeScript, des compétences, des modèles de prompts et des plugins.

Ce qui rend Pi spécial, c’est sa flexibilité : vous pouvez façonner son comportement, ses outils et même son interface. Il prend en charge plusieurs fournisseurs de LLM, des arborescences de sessions et des primitives de personnalisation qui en font davantage un runtime d’agent programmable qu’un assistant CLI fixe.

Cette approche minimaliste des agents CLI a été largement appréciée par la communauté, le projet atteignant plus de 63 000 étoiles sur GitHub. Il a également dépassé 1,7 million de téléchargements hebdomadaires sur npm.

Fonctionnalités Principales

Les capacités clés offertes par Pi Agent sont :

• Modèle d’extensibilité complet : Modifiez presque chaque couche (par ex., outils, gestion de l’historique, compaction, interface et injection de contexte) pour créer des comportements d’agent entièrement personnalisés.
• Prise en charge multi-fournisseurs LLM : Fonctionne avec OpenAI, Anthropic, Google, Azure, Bedrock et plus encore, avec une commutation facile entre les modèles en cours de session.
• Agent CLI interactif : Un agent de codage entièrement basé sur le terminal avec utilisation d’outils en temps réel, conscience du contexte et contrôle conversationnel.
• Gestion de l’arborescence de sessions : Stocke les conversations sous forme de branches, vous permettant de revenir en arrière, de bifurquer et d’explorer des chemins d’exécution alternatifs.
• Système de compétences : Chargez dynamiquement des compétences d’agent pour étendre l’agent sans alourdir la fenêtre de contexte.
• Modèles de prompts et commandes personnalisées : Définissez des prompts réutilisables déclenchables via des commandes slash pour des workflows plus rapides.
• Modes Print, RPC et SDK : Utilisez Pi dans des scripts, des services backend ou des applications intégrées via une sortie structurée ou des API programmatiques.

Pourquoi Pi Coding Agent a Besoin d’un Accès Web Fiable

Quel que soit le LLM configuré dans Pi, l’agent de codage sous-jacent fait face à une limitation commune des modèles de langage : des connaissances obsolètes. Un LLM ne peut générer des réponses qu’à partir des données statiques sur lesquelles il a été entraîné, qui représentent essentiellement un instantané du passé.

Étant donné la rapidité d’évolution du paysage technologique, cette limitation devient critique. Les modèles peuvent suggérer des patterns de codage obsolètes, s’appuyer sur des méthodes dépréciées ou manquer entièrement les nouvelles fonctionnalités.

Cela crée un goulot d’étranglement évident pour les tâches de codage et d’automatisation dans votre configuration Pi Agent. Et même lorsque vous ajoutez des outils de recherche web basiques, ceux-ci sont souvent peu fiables à grande échelle et peuvent être bloqués par les protections anti-bot utilisées sur de nombreux sites.

Imaginez maintenant Pi Coding Agent capable de récupérer de manière fiable des tutoriels, de la documentation et des guides à jour, et d’en apprendre en temps réel. Il pourrait également prendre des captures d’écran de pages web pour les analyser visuellement, interagir avec des sites et effectuer des workflows bien plus complexes directement depuis le CLI.

C’est exactement ce que rend possible le serveur Web MCP de Bright Data !

Bright Data Web MCP comme Solution

Le Bright Data Web MCP expose plus de 70 outils. En coulisses, ces outils interagissent avec les produits basés sur l’API de Bright Data.

Web MCP est disponible en [deux modes](https://github.com/brightdata/brightdata-mcp?tab=readme-ov-file#-pricing, modes) :

• Mode Rapid : Un niveau gratuit avec jusqu’à 5 000 requêtes par mois et un ensemble limité d’outils pour la recherche web, le scraping et la découverte.
• Mode Pro : Un niveau payant qui débloque tous les 70+ outils, y compris l’extraction de données structurées depuis des plateformes comme Amazon, LinkedIn, Yahoo Finance, YouTube, Zillow, Google Maps et plus de 40 autres, ainsi que des capacités complètes d’automatisation de navigateur.

Les outils Bright Data Web MCP les plus pertinents sont :

Ce qui rend Bright Data unique, c’est son réseau mondial de plus de 400 millions d’IPs résidentielles dans 195 pays. Cette infrastructure est le fondement de tous ses produits, conçue pour offrir une fiabilité de niveau entreprise avec prise en charge de la concurrence illimitée, une scalabilité massive et une disponibilité garantie par SLA à 99,99 %.

Comment Configurer Bright Data Web MCP dans Pi Agent

Dans cette section tutoriel étape par étape, vous serez guidé à travers la configuration de l’intégration Bright Data Web MCP dans Pi Agent. Ainsi, l’agent de codage sous-jacent accédera aux capacités de découverte web, de scraping et d’automatisation de navigateur.

Suivez les instructions ci-dessous !

Prérequis

Pour suivre cette section, assurez-vous d’avoir :

• Node.js installé localement (la dernière version LTS est recommandée).
• Une clé API de l’un des nombreux fournisseurs LLM pris en charge par Pi Agent (nous utiliserons une clé API OpenAI dans ce guide).
• Un compte Bright Data avec une clé API. Suivez le guide officiel pour générer une clé API Bright Data.

Bien que non strictement requis, il est également utile de connaître le fonctionnement du MCP et les outils Bright Data Web MCP.

Étape #1 : Installer Pi

Installez Pi via npm en exécutant la commande suivante :

npm install -g, ignore-scripts @earendil-works/pi-coding-agent

Cela installe le package @earendil-works/pi-coding-agent globalement, ce qui enregistre la commande pi sur votre système.

Si vous préférez une méthode d’installation différente, comme PowerShell, l’installateur cURL, pnpm, Yarn ou Bun, consultez la documentation officielle.

Une fois l’installation terminée, lancez Pi Coding Agent avec :

pi

La première fois que vous exécutez la commande, vous devriez voir quelque chose comme ceci :

Le message retourné indique qu’aucun fournisseur d’IA n’est actuellement configuré dans Pi. À l’étape suivante, vous apprendrez comment en connecter et configurer un !

Étape #2 : Configurer un LLM

Configurez un LLM dans Pi Coding Agent en exécutant :

/login

Pi vous invitera à sélectionner une méthode d’authentification pour votre fournisseur LLM préféré. Dans ce cas, sélectionnez “Use an API key” :

Ensuite, choisissez votre fournisseur d’IA. Dans ce guide, nous utiliserons OpenAI :

Collez votre clé API OpenAI lorsque vous y êtes invité :

Si tout se passe comme prévu, Pi s’authentifiera avec OpenAI et stockera votre clé API de manière sécurisée dans sa configuration. Ensuite, il sélectionnera automatiquement un modèle par défaut pour vous (gpt-5.4 dans cet exemple).

Vous devriez alors voir un message de confirmation similaire à celui-ci :

Pour changer le modèle plus tard, exécutez :

/model

Puis sélectionnez le modèle que vous souhaitez utiliser parmi les options disponibles :

Bravo ! Pi est maintenant installé et configuré sur votre machine.

Étape #3 : Ajouter l’Extension Pi MCP Adapter

Par défaut, Pi est fourni avec une configuration minimale et n’inclut pas la prise en charge MCP par défaut. Pour activer l’intégration MCP, installez l’extension pi-mcp-adapter avec cette commande :

pi install npm:pi-mcp-adapter

Une fois l’extension installée, redémarrez Pi. L’extension pi-mcp-adapter attend un fichier de configuration MCP situé dans :

• .mcp.json dans votre répertoire de projet, ou
• ~/.config/mcp/mcp.json (%USERPROFILE%/.config/mcp/mcp.json sur Windows).

Ce fichier contient la configuration de vos serveurs MCP. Vous pouvez créer le fichier de configuration manuellement, ou laisser Pi le générer pour vous en exécutant :

/mcp setup

Puis sélectionnez l’option “Scaffold project .mcp.json” :

Pi créera un fichier .mcp.json dans votre répertoire de projet. Ouvrez-le, et vous verrez :

{
  "mcpServers": {}
}

Parfait ! Pi Coding Agent peut maintenant agir en tant que client MCP et exposer les outils MCP à l’agent IA sous-jacent.

Étape #4 : Démarrer avec Web MCP de Bright Data

Avant de connecter le Web MCP de Bright Data à Pi Agent, vérifiez que le serveur MCP fonctionne correctement sur votre machine. Pour plus de détails, consultez la documentation Web MCP.

Commencez par installer Web MCP globalement avec :

npm install -g @brightdata/mcp

Sur Linux, macOS ou WSL, démarrez le serveur Bright Data Web MCP avec :

API_TOKEN="<YOUR_BRIGHT_DATA_API>" npx -y @brightdata/mcp

Alternativement, dans PowerShell :

$Env:API_TOKEN="<YOUR_BRIGHT_DATA_API>"; npx -y @brightdata/mcp

Remplacez <YOUR_BRIGHT_DATA_API> par votre clé API Bright Data. Cette commande définit la variable d’environnement API_TOKEN requise et lance le serveur Web MCP localement via le package @brightdata/mcp.

Si tout est correctement configuré, vous devriez voir une sortie similaire à la suivante :

Lors du premier démarrage, le package @brightdata/mcp crée automatiquement deux APIs dans votre compte Bright Data :

• mcp_unlocker : Utilisé pour accéder à l’API Web Unlocker de Bright Data (et à l’API SERP).
• mcp_browser : Utilisé pour interagir avec l’API Browser de Bright Data.

Ensemble, ces APIs alimentent les 70+ outils disponibles via Web MCP. Si nécessaire, vous pouvez également définir des noms d’API personnalisés, comme décrit dans le dépôt officiel.

Pour confirmer que les APIs ont été créées, accédez à la page “Web Access > Web Access API” dans le panneau de contrôle Bright Data. Vous devriez trouver les deux APIs listées dans le tableau “My APIs” :

Gardez à l’esprit que le niveau gratuit de Web MCP (mode Rapid) ne donne accès qu’à un sous-ensemble d’outils.

Pour débloquer l’ensemble complet de 70+ outils, activez le mode Pro en définissant la variable d’environnement PRO_MODE="true" :

API_TOKEN="<YOUR_BRIGHT_DATA_API>" PRO_MODE="true" npx -y @brightdata/mcp

Ou, sur Windows :

$Env:API_TOKEN="<YOUR_BRIGHT_DATA_API>"; $Env:PRO_MODE="true"; npx -y @brightdata/mcp

Remarque : Le mode Pro n’est pas inclus dans le niveau gratuit et [entraîne des frais supplémentaires](https://github.com/brightdata/brightdata-mcp?tab=readme-ov-file#-pricing, modes).

Excellent ! Vous avez confirmé que Bright Data Web MCP fonctionne sur votre machine. À l’étape suivante, vous le connecterez à Pi Agent.

Étape #5 : Configurer le Web MCP dans Pi Agent

Pour configurer l’intégration Bright Data Web MCP dans Pi, ajoutez la configuration suivante à votre fichier .mcp.json (ou ~/.config/mcp/mcp.json) :

{
  "mcpServers": {
    "bright-data-web-mcp": {
      "command": "npx",
      "args": ["-y", "@brightdata/mcp"],
      "env": {
        "API_TOKEN": "<YOUR_BRIGHT_DATA_API_KEY>",
        "PRO_MODE": "true"
      }
    }
  }
}

Au démarrage, l’extension pi-mcp-adapter lira le fichier. Ensuite, elle démarrera le serveur Web MCP local en exécutant la commande npx -y @brightdata/mcp tout en définissant ces variables d’environnement :

• API_TOKEN (requis) : Votre clé API Bright Data.
• PRO_MODE (optionnel) : Définissez-le à true pour activer les fonctionnalités Pro. Définissez-le à false ou supprimez-le entièrement pour exécuter Web MCP en mode Rapid (gratuit).

Désormais, Pi se connectera à une instance locale de Web MCP. Parfait !

Étape #6 : Vérifier l’Intégration Web MCP

Vérifiez que les outils exposés par Web MCP sont disponibles en redémarrant Pi et en exécutant :

/mcp tools

Si vous avez configuré Web MCP en mode Pro, vous devriez voir la liste complète des outils disponibles :

Notez que la liste inclut tous les 70+ outils. Si vous utilisez le mode Rapid, seuls les outils inclus dans le niveau gratuit apparaîtront. Cela confirme que Pi peut se connecter avec succès à votre instance locale de Web MCP et accéder aux outils qu’il expose.

Excellent ! Votre intégration Pi Agent + Bright Data Web MCP est maintenant entièrement configurée. Il ne reste plus qu’à la voir en action.

Étape #7 : Tester l’Agent IA Amélioré

Supposons que vous souhaitiez créer un site e-commerce et avez besoin d’inspiration pour son design. Une bonne approche consiste à commencer par une maquette basée sur une boutique en ligne réussie.

Par exemple, vous pouvez demander à votre agent IA de visiter une page de catégorie de produits Nike, de capturer une capture d’écran, puis de générer une maquette HTML/CSS statique inspirée de la mise en page et des patterns de design de la page.

Pour y parvenir, rédigez le prompt suivant :

Search online for the Nike men's shoes & sneakers page. Open the page and take a full viewport screenshot from a US IP. Then, create a mock e-commerce webpage using plain HTML and CSS that replicates the same visual style, layout structure, and overall design patterns shown in the screenshot. Do not copy brand assets or proprietary text,only reproduce general layout, spacing, and styling.

C’est un excellent test des capacités web ajoutées via Web MCP, car il implique la recherche web et l’automatisation de navigateur. Ces capacités sont fournies par Bright Data Web MCP (en mode Pro).

Remarque : Le prompt demande explicitement une adresse IP américaine pour éviter les bannières de cookies RGPD de l’UE, qui peuvent limiter la vue sur la capture d’écran de la page et rendre plus difficile l’analyse correcte de la structure de la page par l’agent IA.

Ouvrez Pi et exécutez le prompt. L’exécution devrait ressembler à ceci :

Voici ce que Pi Coding Agent a fait en coulisses :

1. Utilisé l’outil Web MCP search_engine pour localiser la page Nike “Men’s Shoes & Sneakers” via une requête de recherche Google basée aux États-Unis. En coulisses, cette requête est alimentée par l’API SERP de Bright Data.
2. Ouvert la page en utilisant l’outil Web MCP scraping_browser_navigate avec une géolocalisation américaine. Cette capacité est fournie par l’API Browser de Bright Data.
3. Vérifié que la page s’est chargée avec succès et confirmé le titre et l’URL de la page.
4. Capturé une capture d’écran de la page en utilisant l’outil Web MCP scraping_browser_screenshot.
5. Analysé la capture d’écran pour comprendre la mise en page, la structure et les patterns de design du site.
6. Planifié une maquette e-commerce neutre en termes de marque inspirée de la page originale, en évitant l’utilisation d’actifs et de branding propriétaires.
7. Conçu une structure de page responsive avec une barre utilitaire, un menu de navigation, une bannière promotionnelle, une barre latérale de filtres et une grille de produits.
8. Généré un fichier src/index.html autonome en HTML et CSS purs.

Ce workflow illustre la puissance des agents dotés de Web MCP. Un LLM seul ne peut pas effectuer ces tâches car il n’a pas d’accès direct aux moteurs de recherche et aux navigateurs web dans le cloud. De plus, des sites comme Nike.com utilisent des systèmes anti-bot sophistiqués qui bloquent le trafic automatisé.

Un autre avantage majeur de Web MCP est qu’il est construit sur l’infrastructure Proxy de Bright Data. Cela permet à l’agent de router les requêtes via des pays spécifiques et même des localisations au niveau des villes. En conséquence, l’agent peut accéder et analyser des versions régionales de sites web avec une bien meilleure fiabilité.

Fantastique ! Examinons maintenant le résultat généré.

Étape #8 : Analyser les Résultats

Une fois que l’agent a terminé la tâche, la structure de votre projet devrait ressembler à ceci :

├── .mcp.json
└── src/
    └── index.html

Ouvrez le fichier généré src/index.html dans votre navigateur, et vous verrez un résultat similaire à celui-ci :

Comparez-le à la page originale Nike “Men’s Shoes & Sneakers” utilisée comme inspiration :

Remarquez comment la page générée correspond étroitement à la mise en page, l’espacement, la structure de navigation, la grille de produits et la hiérarchie visuelle générale de l’original, tout en évitant l’utilisation du branding Nike, du contenu propriétaire et des actifs protégés par droits d’auteur.

Et voilà ! Cet exemple simple démontre à quel point Pi Agent devient plus capable lorsqu’il est connecté à Bright Data Web MCP.

En combinant la recherche web, le scraping et l’automatisation de navigateur avec la génération de code alimentée par l’IA, l’agent peut accomplir des workflows complexes qui seraient impossibles pour un LLM standard.

C’est maintenant à votre tour d’expérimenter. Essayez différents prompts et explorez les nombreux cas d’usage rendus possibles par les 70+ outils disponibles via Web MCP !

Conclusion

Dans cet article de blog, vous avez appris ce qu’est Pi et les capacités qu’il offre. En détail, vous avez vu comment l’étendre en l’intégrant avec le Web MCP de Bright Data.

Cette intégration donne à Pi Agent les outils nécessaires pour gérer des scénarios de recherche web, de découverte, de scraping et d’automatisation de navigateur. Ces capacités l’aident à gérer des workflows d’automatisation et de codage plus complexes. Explorez la gamme complète des services web pour l’IA dans l’écosystème de Bright Data.

Inscrivez-vous dès aujourd’hui pour un compte Bright Data et commencez à explorer nos outils web prêts pour l’IA !