Guide de l’agent utilisateur Puppeteer : configuration et modification

Dans ce guide de l’agent utilisateur Puppeteer, vous trouverez :

• Scraping web
• À quoi ressemble l’agent utilisateur par défaut dans Puppeteer
• Comment remplacer l’agent utilisateur Chrome headless par défaut
• Comment implémenter la rotation des agents utilisateurs dans Puppeteer
• Comment utiliser Puppeteer Extra pour anonymiser l’agent utilisateur

C’est parti !

Pourquoi vous devez définir un agent utilisateur personnalisé

L’en-tête User-Agent est une chaîne de caractères que le client définit pour s’identifier auprès d’un serveur lorsqu’il le contacte via une requête HTTP. Il contient généralement des informations sur la machine et/ou l’application à l’origine de la requête. Cet en-tête est défini par les navigateurs web, les clients HTTP ou tout logiciel effectuant des requêtes web.

Voici un exemple de chaîne d’agent utilisateur définie par Chrome lors de la demande de pages web :

Mozilla/5.0 (Windows NT 10.0 ; Win64 ; x64) AppleWebKit/537.36 (KHTML, comme Gecko) Chrome/127.0.0.0 Safari/537.36

La chaîne d’agent utilisateur ci-dessus se compose des éléments suivants :

• Mozilla/5.0: initialement utilisé pour indiquer la compatibilité avec les navigateurs Mozilla, ce préfixe est désormais inclus pour une compatibilité plus large.
• Windows NT 10.0 ; Win64 ; x64: indique le système d’exploitation (Windows NT 10.0), la plate-forme (Win64) et l’architecture du système (x64).
• AppleWebKit/537.36: fait référence au moteur de navigation utilisé par Chrome.
• (KHTML, comme Gecko): indique la compatibilité avec les moteurs de mise en page KHTML et Gecko.
• Chrome/127.0.0.0: spécifie le nom et la version du navigateur.
• Safari/537.36: indique la compatibilité avec Safari.

Essentiellement, la chaîne d’agent utilisateur peut révéler si la requête provient d’un navigateur connu ou d’un autre type de logiciel.

L’erreur que commettent la plupart des robots de Scraping web et des scripts d’automatisation est d’utiliser des agents utilisateurs par défaut ou non liés à un navigateur. Ces valeurs sont faciles à détecter par les mesures anti-robots conçues pour protéger les pages web. En analysant l’en-tête User-Agent, les serveurs peuvent déterminer si la requête provient d’un robot automatisé.

Pour plus de détails, consultez notre guide sur les agents utilisateurs pour le Scraping web.

Quel est l’agent utilisateur Puppeteer par défaut ?

Puppeteer automatise les tâches du navigateur en contrôlant une version spéciale d’un navigateur web réel. Par défaut, il exécute une version spécifique de Chrome, même s’il prend également en charge Firefox. Vous pourriez donc supposer que l’agent utilisateur par défaut dans Puppeteer correspondrait à celui défini par la version contrôlée de Chrome. Eh bien, ce n’est pas le cas…

La raison est que Puppeteer lance le navigateur en mode headless par défaut. Lorsque les navigateurs fonctionnent en mode headless, ils définissent généralement un agent utilisateur distinctif. Dans la version actuelle, l’agent utilisateur par défaut de Puppeteer se présente comme suit :

Mozilla/5.0 (Windows NT 10.0 ; Win64 ; x64) AppleWebKit/537.36 (KHTML, comme Gecko) HeadlessChrome/127.0.0.0 Safari/537.3

Notez la chaîne HeadlessChrome, qui identifie Chrome comme fonctionnant en mode headless. Sans surprise, la chaîne ci-dessus correspond exactement à l’agent utilisateur de la dernière version de Chrome headless.

Pour confirmer que la chaîne ci-dessus est bien l’agent utilisateur par défaut de Puppeteer, configurez un script et accédez à la page httpbin.io/user-agent. Ce point de terminaison API renvoie l’en-tête User-Agent de la requête, ce qui vous aide à découvrir l’agent utilisateur utilisé par n’importe quel navigateur ou client HTTP.

Créez un script Puppeteer, visitez la page souhaitée, récupérez la réponse API du corps et affichez-la :

import puppeteer from "puppeteer";

(async () => {

// lancer le navigateur et ouvrir une nouvelle page

const browser = await puppeteer.launch();

const page = await browser.newPage();

// se connecter à la page cible

await page.goto("https://httpbin.io/user-agent");

// extraire le texte du corps avec la réponse API

// et l'imprimer

const bodyText = await page.evaluate(() => {

return document.body.innerText;

});

console.log(bodyText);

// fermer le navigateur et libérer ses ressources

await browser.close();

})();

Pour en savoir plus sur l’API Puppeteer, consultez notre guide sur le Scraping web avec Puppeteer.

Exécutez le code Node.js ci-dessus et vous obtiendrez la chaîne suivante :

{

"user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/127.0.0.0 Safari/537.36"

}

Notez que l’agent utilisateur défini par Puppeteer correspond à la chaîne présentée précédemment.

Le problème réside dans l’identifiant HeadlessChrome, qui peut alerter les systèmes anti-bot. Ces systèmes analysent les requêtes entrantes à la recherche de modèles pouvant indiquer une activité de bot, tels que des chaînes d’agent utilisateur inhabituelles. Les requêtes suspectes sont signalées et bloquées en conséquence. C’est pourquoi il est si important de modifier la chaîne d’agent utilisateur Puppeteer par défaut !

Comment modifier l’agent utilisateur Puppeteer

La modification de l’agent utilisateur est une opération si courante et utile que Puppeteer fournit une méthode spécialement conçue à cet effet. En particulier, la classe Page expose la méthode setUserAgent(). Cela vous permet de modifier l'agent utilisateur défini par Puppeteer lorsque vous naviguez vers des pages web dans cet onglet du navigateur.

Utilisez setUserAgent() pour modifier l’agent utilisateur Puppeteer comme ci-dessous :

await page.setUserAgent("<votre_agent_utilisateur>");

Toutes les requêtes HTTP GET effectuées en appelant la méthode goto() sur la page auront désormais un en-tête User-Agent personnalisé. Gardez à l’esprit que cette modification s’applique uniquement à l’objet de page spécifique. Si vous ouvrez une nouvelle page et interagissez avec elle, Puppeteer utilisera l’agent utilisateur par défaut vu précédemment.

Pour un exemple complet, consultez l’extrait suivant :

import puppeteer from "puppeteer";

(async () => {

// lancer le navigateur et ouvrir une nouvelle page

const browser = await puppeteer.launch();

const page = await browser.newPage();

// définir un agent utilisateur personnalisé

await page.setUserAgent("Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36");

// se connecter à la page cible

await page.goto("https://httpbin.io/user-agent");

// extraire le texte du corps avec la réponse API

// et l'imprimer

const bodyText = await page.evaluate(() => {

return document.body.innerText;

});

console.log(bodyText);

// fermer le navigateur et libérer ses ressources

await browser.close();

})();

Exécutez le script ci-dessus, et cette fois, le résultat sera :

{

"user-agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36"

}

Parfait ! La chaîne de l’agent utilisateur extraite de la page correspond à l’agent utilisateur configuré dans le code. Vous savez désormais comment effectuer l’opération de changement d’agent utilisateur dans Puppeteer.

Mettre en œuvre la rotation des agents utilisateurs dans Puppeteer

Remplacer l’en-tête User-Agent d’un navigateur sans interface graphique par celui d’un navigateur avec interface graphique peut ne pas suffire pour échapper aux systèmes anti-bot. Le problème est que votre script d’automatisation du navigateur présentera des schémas qui indiquent un comportement non humain. Cela est particulièrement vrai si vous envoyez un grand nombre de requêtes avec les mêmes en-têtes à partir de la même adresse IP.

Pour minimiser le risque de détection des bots dans Puppeteer, vous devez varier autant que possible vos requêtes. Une méthode efficace consiste à définir un agent utilisateur différent pour chaque requête. Cette stratégie, appelée rotation des agents utilisateurs, vous aide à réduire le risque d’être signalé comme un bot.

Dans la section suivante du tutoriel, vous apprendrez comment mettre en œuvre la rotation des agents utilisateurs dans Puppeteer!

Étape n° 1 : générer un agent utilisateur aléatoire

Il existe deux approches principales pour obtenir un agent utilisateur aléatoire. La première consiste à obtenir une liste d’agents utilisateurs valides et à en sélectionner un au hasard dans la liste, comme indiqué dans notre guide des agents utilisateurs Node.js.

La deuxième approche consiste à utiliser une bibliothèque tierce de génération d’agents utilisateurs. La plus populaire en JavaScript est user-agents, un package qui peut générer des agents utilisateurs valides pour vous. Dans ce guide, nous suivrons cette méthode !

Lancez cette commande npm pour ajouter la bibliothèque user-agents aux dépendances de votre projet :

npm install user-agents

Notez que user-agents est mis à jour quotidiennement, ce qui garantit qu’il inclut toujours les derniers agents utilisateurs.

Après avoir installé la bibliothèque, importez l’objet UserAgent dans votre script Puppeteer:

import UserAgent from "user-agents";

Vous pouvez désormais générer une chaîne d’agent utilisateur aléatoire à l’aide du code suivant :

const userAgent = new UserAgent().random().toString();

Consultez la documentation officielle pour une utilisation plus avancée, telle que l’obtention d’agents utilisateurs pour des appareils spécifiques, des systèmes d’exploitation, etc.

Étape n° 2 : définir l’agent utilisateur aléatoire

Transmettez la chaîne d’agent utilisateur aléatoire à Puppeteer en appelant la méthode setUserAgent():

const userAgent = new UserAgent().random().toString();

await page.setUserAgent(userAgent);

Toutes les requêtes effectuées via l’objet page auront désormais un agent utilisateur personnalisé, généré de manière aléatoire.

Étape n° 3 : visiter la page cible

Appelez la méthode goto() sur la page pour visiter votre page Web cible dans le navigateur headless contrôlé :

await page.goto("https://httpbin.io/user-agent");

Étape n° 4 : assembler le tout

Vous trouverez ci-dessous votre script final de rotation d’agent utilisateur Puppeteer:

import puppeteer from "puppeteer";

import UserAgent from "user-agents";

(async () => {

// lancer le navigateur et ouvrir une nouvelle page

const browser = await puppeteer.launch();

const page = await browser.newPage();

// générer un agent utilisateur aléatoire

const userAgent = new UserAgent().random().toString();

// définir un agent utilisateur aléatoire

await page.setUserAgent(userAgent);

// se connecter à la page cible

await page.goto("https://httpbin.io/user-agent");

// extraire le corps du texte avec la réponse API

// et l'imprimer

const bodyText = await page.evaluate(() => {

return document.body.innerText;

});

console.log(bodyText);

// fermer le navigateur et libérer ses ressources

await browser.close();

})();

Exécutez le script plusieurs fois, et vous devriez voir différents agents utilisateurs.

Et voilà ! La logique de rotation des agents utilisateurs dans Puppeteer fonctionne à merveille.

Définir un agent utilisateur personnalisé dans Puppeteer avec puppeteer-extra-plugin-anonymize-ua

Les approches ci-dessus pour définir l’agent utilisateur dans Puppeteer sont efficaces, mais elles présentent un inconvénient majeur. La méthode userAgent() ne modifie l’agent utilisateur que pour une session de page spécifique, et non pour tous les onglets du navigateur.

Pour vous assurer que Puppeteer n’utilise jamais l’agent utilisateur par défaut, vous pouvez utiliser le plugin puppeteer-extra-plugin-anonymize-ua de Puppeteer Extra. Si vous ne connaissez pas ce projet, Puppeteer Extra étend Puppeteer en ajoutant la prise en charge de plugins définis par la communauté. Vous pouvez en savoir plus dans notre guide sur le plugin Puppeteer Extra Stealth.

Le plugin puppeteer-extra-plugin-anonymize-ua peut anonymiser l’agent utilisateur défini par Puppeteer. Pour installer puppeteer-extra et le plugin nécessaire, exécutez la commande suivante :

npm install puppeteer-extra puppeteer-extra-plugin-anonymize-ua

Ensuite, importez puppeteer depuis puppeteer-extra et AnonymizeUAPlugin depuis puppeteer-extra-plugin-anonymize-ua:

import puppeteer from "puppeteer-extra";

import AnonymizeUAPlugin from "puppeteer-extra-plugin-anonymize-ua";

Configurez puppeteer-extra-plugin-anonymize-ua pour générer un agent utilisateur aléatoire et enregistrez-le en tant que plugin avec la méthode use() de Puppeteer Extra:

puppeteer.use(

AnonymizeUAPlugin({

customFn: () => new UserAgent().random().toString(),

})

);

Maintenant, essayez de visiter des pages dans deux onglets différents en utilisant deux objets de page distincts :

import puppeteer from "puppeteer-extra";

import AnonymizeUAPlugin from "puppeteer-extra-plugin-anonymize-ua";

import UserAgent from "user-agents";

(async () => {

// configurez et enregistrez le

// plugin puppeteer-extra-plugin-anonymize-ua

puppeteer.use(

AnonymizeUAPlugin({

customFn: () => new UserAgent().random().toString(),

})

);

// lancer le navigateur et ouvrir une nouvelle page

const browser = await puppeteer.launch();

// ouvrir une nouvelle page

const page1 = await browser.newPage();

// se connecter à la page cible

await page1.goto("https://httpbin.io/user-agent");

// extraire le texte du corps avec la réponse API

// et l'imprimer

const bodyText1 = await page1.evaluate(() => {

return document.body.innerText;

});

console.log(bodyText1);

// ouvrir une nouvelle page

const page2 = await browser.newPage();

// se connecter à la page cible

await page2.goto("https://httpbin.io/user-agent");

// extraire le texte du corps avec la réponse API

// et l'imprimer

const bodyText2 = await page2.evaluate(() => {

return document.body.innerText;

});

console.log(bodyText2);

// fermer le navigateur et libérer ses ressources

await browser.close();

})();

Le résultat sera deux agents utilisateurs différents, comme indiqué ci-dessous :

{

"user-agent": "Mozilla/5.0 (iPhone; CPU iPhone OS 17_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.5 Mobile/15E148 Safari/604.1"

}

{

« user-agent » : « Mozilla/5.0 (Linux ; Android 10 ; K) AppleWebKit/537.36 (KHTML, comme Gecko) Chrome/127.0.0.0 Mobile Safari/537.36 »

}

Les deux agents utilisateurs sont différents, et aucun n’est l’agent utilisateur Puppeteer par défaut. Cela s’explique par le fait que puppeteer-extra-plugin-anonymize-ua personnalise chaque objet de page avec un agent utilisateur aléatoire, comme spécifié dans la fonction customFn. De cette façon, Puppeteer n’exposera jamais son agent utilisateur par défaut !

Conclusion

Dans cet article, vous avez découvert l’importance de définir l’en-tête User-Agent et vu à quoi ressemble l’agent utilisateur Puppeteer par défaut. Vous avez appris à remplacer cette valeur et à mettre en œuvre la rotation des agents utilisateurs pour contourner les systèmes anti-scraping de base. Cependant, des systèmes plus sophistiqués peuvent toujours détecter et bloquer vos requêtes automatisées. Pour éviter les interdictions d'IP, vous pouvez configurer un Proxy dans Puppeteer, mais même cela peut ne pas toujours suffire !

Pour une solution plus efficace, essayez le Navigateur de scraping, un navigateur de nouvelle génération qui s’intègre à Puppeteer et à tout autre outil d’automatisation de navigateur. Le Navigateur de scraping peut facilement contourner les technologies anti-bot pour vous tout en évitant l’empreinte digitale du navigateur. En coulisses, il s’appuie sur des fonctionnalités telles que la rotation des agents utilisateurs, la rotation des adresses IP et la Résolutionde CAPTCHA. L’automatisation des navigateurs n’a jamais été aussi simple !

Inscrivez-vous dès maintenant et commencez votre essai gratuit.