Navigateur sans tête en C# : configuration et exemples de code

Les navigateurs headless vous permettent d'automatiser les tâches Web sans interface graphique. En C#, ils sont largement utilisés pour les tests, le scraping Web et la gestion de contenu. Deux outils populaires sont MarionnettisteAiguisé (optimisé pour Chrome/Chromium) et Pilote Web Selenium (prend en charge plusieurs navigateurs). Voici comment ils se comparent :

Fonctionnalité	MarionnettisteAiguisé	Pilote Web Selenium
Support du navigateur	Chrome / Chrome	Chrome, Firefox, Edge, etc.
Complexité de la configuration	Facile (téléchargement automatique de Chromium)	Nécessite une configuration de pilote distincte
Performances	Plus rapide pour Chrome/Chromium	Cohérent sur tous les navigateurs
Conception d'API	Moderne, basé sur des promesses	Traditionnel, orienté objet
Utilisation de la mémoire	Coût en adjuvantation plus élevé.	Varie selon le navigateur

Principaux avantages des navigateurs sans tête :

• La vitesse: Tests plus rapides sans rendu GUI.
• Rendement : Utilise moins de mémoire et de CPU.
• Automation: Gère des tâches telles que la récupération de données, les tests et les soumissions de formulaires.

Pour une configuration rapide :

1. Installez l' SDK .NET et les packages requis (PuppeteerSharp or Selenium.WebDriver).
2. Utilisez PuppeteerSharp pour l’automatisation spécifique à Chrome ou Selenium pour la prise en charge multi-navigateurs.
3. Écrivez des scripts C# pour interagir avec des pages Web, extraire des données ou effectuer des tests automatisés.

Les deux outils sont puissants. PuppeteerSharp est idéal pour les tâches centrées sur Chrome, tandis que Selenium excelle dans les scénarios multi-navigateurs. Choisissez en fonction des besoins de votre projet.

Test du navigateur sans tête Selenium en C# avec PhantomJS

Configuration requise

La configuration d'un navigateur headless en C# nécessite des outils et des configurations spécifiques. Voici une liste des logiciels nécessaires et une comparaison entre PuppeteerSharp et Selenium WebDriver.

Installation du logiciel requis

Pour commencer, vous aurez besoin des éléments suivants :

• SDK .NET:Installez-le via l'une de ces méthodes :
  • Visual Studio Installateur avec la charge de travail ASP.NET
  • Visual Studio Code grâce à la fonction Kit de développement C# l'extension de
  • Téléchargement direct depuis le site Web .NET
  • Installation en ligne de commande via Gestionnaire de packages Windows (WinGet)
• Forfaits:Installez les packages requis pour votre projet :

Forfait	Commande d'installation	Interet
MarionnettisteAiguisé	dotnet ajouter le package PuppeteerSharp	Automatise et contrôle Chrome/Chromium
Pilote Web Selenium	dotnet add package Selenium.WebDriver --version 4.29.0	Permet l'automatisation multi-navigateur
Pilotes de navigateur	Téléchargez les pilotes nécessaires pour votre navigateur	Assure la fonctionnalité de Selenium

Une fois le logiciel prêt, examinons comment PuppeteerSharp et Selenium WebDriver se comparent.

MarionnettisteAiguisé vs Pilote Web Selenium

Ces deux outils sont excellents pour l'automatisation du navigateur headless mais servent à des fins différentes. Voici une comparaison rapide :

Fonctionnalité	MarionnettisteAiguisé	Pilote Web Selenium
Support du navigateur	Limité à Chrome/Chromium	Fonctionne avec Chrome, Firefox, Edge, etc.
Complexité de la configuration	Simple – inclut le téléchargement automatique de Chromium	Nécessite une installation de pilote séparée
Performances	Optimisé pour Chrome/Chromium	Cohérent sur tous les navigateurs pris en charge
Conception d'API	Moderne, basé sur des promesses	Traditionnel, orienté objet
Utilisation de la mémoire	Moins d'utilisation de la mémoire	Varie selon le navigateur

Pour les développeurs C#, PuppeteerSharp est souvent le plus rapide à configurer. Sa gestion automatique de Chromium et son API conviviale le rendent idéal pour les projets axés uniquement sur Chrome/Chromium. D'autre part, Selenium WebDriver est mieux adapté aux projets nécessitant une compatibilité entre navigateurs, car il prend en charge plusieurs navigateurs via des événements au niveau du système d'exploitation et des pilotes dédiés.

Pour télécharger Chromium pour PuppeteerSharp, utilisez le code suivant :

<span class="hljs-keyword">await</span> <span class="hljs-keyword">new</span> BrowserFetcher().DownloadAsync(BrowserFetcher.DefaultChromiumRevision);

Cette configuration vous fournit les outils dont vous avez besoin pour une automatisation robuste du navigateur sans tête, que vous travailliez sur des frameworks de test, du scraping Web ou de l'automatisation des flux de travail.

Premiers pas avec PuppeteerSharp

PuppeteerSharp propose une API puissante pour contrôler Chrome ou Chromium en mode sans tête, ce qui en fait un choix solide pour les tâches d'automatisation Web C#.

Premier lancement du navigateur

Une fois que vous avez installé PuppeteerSharp via NuGet, vous pouvez configurer et lancer le navigateur comme ceci :

<span class="hljs-comment">// Ensure Chromium is downloaded using BrowserFetcher</span>
<span class="hljs-keyword">await</span> <span class="hljs-keyword">new</span> BrowserFetcher().DownloadAsync(BrowserFetcher.DefaultChromiumRevision);

<span class="hljs-comment">// Launch the browser in headless mode</span>
<span class="hljs-keyword">var</span> launchOptions = <span class="hljs-keyword">new</span> LaunchOptions {
    Headless = <span class="hljs-literal">true</span>,
    Args = <span class="hljs-keyword">new</span>[] { <span class="hljs-string">"--no-sandbox"</span>, <span class="hljs-string">"--disable-setuid-sandbox"</span> }
};

<span class="hljs-keyword">using</span> <span class="hljs-keyword">var</span> browser = <span class="hljs-keyword">await</span> Puppeteer.LaunchAsync(launchOptions);
<span class="hljs-keyword">using</span> <span class="hljs-keyword">var</span> page = <span class="hljs-keyword">await</span> browser.NewPageAsync();

<span class="hljs-comment">// Navigate to a webpage</span>
<span class="hljs-keyword">await</span> page.GoToAsync(<span class="hljs-string">"https://example.com"</span>);

Après avoir lancé le navigateur, vous pouvez commencer à interagir avec les pages Web et à collecter des données.

Actions sur la page et collecte de données

PuppeteerSharp vous permet d'effectuer diverses actions sur les pages Web et d'extraire des informations :

<span class="hljs-comment">// Enter text into an input field</span>
<span class="hljs-keyword">await</span> page.TypeAsync(<span class="hljs-string">"#search-input"</span>, <span class="hljs-string">"search term"</span>);

<span class="hljs-comment">// Click a button</span>
<span class="hljs-keyword">await</span> page.ClickAsync(<span class="hljs-string">"#submit-button"</span>);

<span class="hljs-comment">// Get text content from an element</span>
<span class="hljs-keyword">var</span> content = <span class="hljs-keyword">await</span> page.EvaluateExpressionAsync<<span class="hljs-built_in">string</span>>(<span class="hljs-string">"document.querySelector('.content').textContent"</span>);

<span class="hljs-comment">// Capture a screenshot</span>
<span class="hljs-keyword">await</span> page.ScreenshotAsync(<span class="hljs-string">"page-capture.png"</span>);

Pour de meilleures performances de grattage, envisagez ces techniques :

Technique	Comment implémenter	Avantages sociaux
Demande d'interception	Bloquer les ressources inutiles	Réduit le temps de chargement
Mise en cache des ressources	Utiliser un répertoire de données utilisateur personnalisé	Accélère les visites répétées
Limitation du débit	Ajouter des délais entre les demandes	Réduit la pression sur le serveur

Travailler avec du contenu dynamique

Le contenu statique est simple, mais le contenu dynamique nécessite souvent des étapes supplémentaires, comme l'attente du chargement des éléments ou la gestion des données rendues par JavaScript :

<span class="hljs-comment">// Wait for a specific element to appear</span>
<span class="hljs-keyword">await</span> page.WaitForSelectorAsync(<span class="hljs-string">".dynamic-content"</span>);

<span class="hljs-comment">// Wait for navigation to complete with network idle</span>
<span class="hljs-keyword">await</span> page.WaitForNavigationAsync(<span class="hljs-keyword">new</span> NavigationOptions {
    WaitUntil = <span class="hljs-keyword">new</span>[] { WaitUntilNavigation.NetworkIdle0 }
});

<span class="hljs-comment">// Extract text from dynamically loaded content</span>
<span class="hljs-keyword">var</span> dynamicContent = <span class="hljs-keyword">await</span> page.EvaluateFunctionAsync<<span class="hljs-built_in">string</span>>(<span class="hljs-string">@"() => {
    return document.querySelector('.js-content').innerText;
}"</span>);

Pour des interactions plus complexes, telles que l'utilisation d'applications comme Bing Maps, vous pouvez enchaîner des actions pour gérer du contenu avancé rendu par JavaScript.

N'oubliez pas de gérer les erreurs et de définir des délais d'attente pour éviter les problèmes inattendus :

<span class="hljs-keyword">try</span> {
    <span class="hljs-keyword">await</span> page.WaitForSelectorAsync(<span class="hljs-string">".dynamic-element"</span>, <span class="hljs-keyword">new</span> WaitForSelectorOptions {
        Timeout = <span class="hljs-number">5000</span>
    });
} <span class="hljs-keyword">catch</span> (WaitTaskTimeoutException) {
    Console.WriteLine(<span class="hljs-string">"Element did not appear within 5 seconds"</span>);
}

Enfin, assurez-vous de nettoyer correctement les ressources :

<span class="hljs-keyword">await</span> page.CloseAsync();
<span class="hljs-keyword">await</span> browser.CloseAsync();

Cette approche maintient votre automatisation efficace et évite les fuites de mémoire.

sbb-itb-23997f1

Utilisation de Selenium WebDriver

Selenium WebDriver est un outil puissant pour l'automatisation du navigateur en C#. Contrairement à PuppeteerSharp, qui se concentre sur Chrome, Selenium prend en charge plusieurs navigateurs, ce qui en fait un choix polyvalent pour les tests.

Configuration du mode sans tête

Pour configurer Selenium WebDriver pour le mode headless, vous avez besoin de paramètres spécifiques au navigateur. Voici comment le configurer pour Chrome, Firefox et Edge :

<span class="hljs-comment">// Chrome setup</span>
<span class="hljs-keyword">var</span> chromeOptions = <span class="hljs-keyword">new</span> ChromeOptions();
chromeOptions.AddArgument(<span class="hljs-string">"--headless=new"</span>);
<span class="hljs-keyword">var</span> chromeDriver = <span class="hljs-keyword">new</span> ChromeDriver(chromeOptions);

<span class="hljs-comment">// Firefox setup</span>
<span class="hljs-keyword">var</span> firefoxOptions = <span class="hljs-keyword">new</span> FirefoxOptions();
firefoxOptions.Headless = <span class="hljs-literal">true</span>;
<span class="hljs-keyword">var</span> firefoxDriver = <span class="hljs-keyword">new</span> FirefoxDriver(firefoxOptions);

<span class="hljs-comment">// Edge setup</span>
<span class="hljs-keyword">var</span> edgeOptions = <span class="hljs-keyword">new</span> EdgeOptions();
edgeOptions.Headless = <span class="hljs-literal">true</span>;
<span class="hljs-keyword">var</span> edgeDriver = <span class="hljs-keyword">new</span> EdgeDriver(edgeOptions);

L'exécution de navigateurs en mode sans tête vous permet d'effectuer des tâches telles que l'interaction avec des éléments de page sans interface utilisateur visible.

« En supprimant la méthode de commodité (et en la supprimant dans Selenium 4.10.0), les utilisateurs auront le contrôle total du choix du mode headless qu'ils souhaitent utiliser. » - Diego Molina, Selenium [2]

Interactions avancées entre les pages

Selenium WebDriver gère les interactions Web détaillées sans effort. Voici un exemple d'automatisation des tâches courantes :

<span class="hljs-comment">// Initialize WebDriverWait for explicit waits</span>
<span class="hljs-keyword">var</span> wait = <span class="hljs-keyword">new</span> WebDriverWait(driver, TimeSpan.FromSeconds(<span class="hljs-number">10</span>));

<span class="hljs-comment">// Wait for an element to become visible and interact with it</span>
<span class="hljs-keyword">var</span> element = wait.Until(ExpectedConditions.ElementIsVisible(By.Id(<span class="hljs-string">"dynamicElement"</span>)));
element.Click();

<span class="hljs-comment">// Handle alerts</span>
<span class="hljs-keyword">var</span> alert = driver.SwitchTo().Alert();
alert.Accept();

<span class="hljs-comment">// Work with frames</span>
driver.SwitchTo().Frame(<span class="hljs-string">"frameId"</span>);
<span class="hljs-keyword">var</span> frameElement = driver.FindElement(By.CssSelector(<span class="hljs-string">".frame-content"</span>));
driver.SwitchTo().DefaultContent();

Sélecteurs d'éléments communs :

Type de sélecteur	Meilleur cas d'utilisation	Exemple
ID	Éléments uniques	Par.Id("bouton-de-connexion")
CSS	Motifs complexes	Par.CssSelector(".nav > .item")
XPath	Contenu dynamique	Par XPath("//div[contains(@class, 'dynamic')]")

Options d'exportation de pages

Selenium propose plusieurs méthodes pour capturer et exporter le contenu d'une page. Voici quelques exemples :

<span class="hljs-comment">// Take a full page screenshot</span>
<span class="hljs-keyword">var</span> screenshot = ((ITakesScreenshot)driver).GetScreenshotAs(ScreenshotImageFormat.Png);
screenshot.SaveAsFile(<span class="hljs-string">"page.png"</span>);

<span class="hljs-comment">// PDF export</span>
<span class="hljs-keyword">var</span> printOptions = <span class="hljs-keyword">new</span> PrintOptions()
{
    Orientation = PrintOrientation.Portrait,
    Scale = <span class="hljs-number">1.0</span>
};
driver.SavePrintPage(printOptions).SaveAsFile(<span class="hljs-string">"page.pdf"</span>);

<span class="hljs-comment">// Get page source</span>
<span class="hljs-keyword">var</span> htmlContent = driver.PageSource;
File.WriteAllText(<span class="hljs-string">"page.html"</span>, htmlContent);

Les configurations de synchronisation sont essentielles pour une automatisation fluide :

<span class="hljs-comment">// Custom wait condition for page load</span>
wait.Until(driver => ((IJavaScriptExecutor)driver)
    .ExecuteScript(<span class="hljs-string">"return document.readyState"</span>).Equals(<span class="hljs-string">"complete"</span>));

<span class="hljs-comment">// Wait for a specific element to be present before exporting</span>
wait.Until(ExpectedConditions.ElementExists(By.CssSelector(<span class="hljs-string">".content-loaded"</span>)));

Enfin, assurez-vous de bien nettoyer les ressources lorsque vous avez terminé :

driver.Quit();
driver.Dispose();

Dépannage et astuces

Gestion de la vitesse et de la mémoire

Les navigateurs headless, comme ceux utilisés dans PuppeteerSharp, ignorent le chargement du CSS, ce qui les rend plus rapides que les navigateurs traditionnels. Pour tirer le meilleur parti de cette vitesse et réduire l'utilisation des ressources, envisagez ces optimisations :

<span class="hljs-keyword">var</span> launchOptions = <span class="hljs-keyword">new</span> LaunchOptions
{
    Headless = <span class="hljs-literal">true</span>,
    Args = <span class="hljs-keyword">new</span>[]
    {
        <span class="hljs-string">"--disable-gpu"</span>,
        <span class="hljs-string">"--disable-dev-shm-usage"</span>,
        <span class="hljs-string">"--disable-setuid-sandbox"</span>,
        <span class="hljs-string">"--no-sandbox"</span>,
        <span class="hljs-string">"--window-size=1920,1080"</span>
    }
};

<span class="hljs-comment">// Set a custom cache directory</span>
launchOptions.UserDataDir = <span class="hljs-string">"C:\\BrowserCache"</span>;

Vous pouvez également bloquer les ressources inutiles comme les images ou les feuilles de style pour économiser de la mémoire :

<span class="hljs-keyword">await</span> page.SetRequestInterceptionAsync(<span class="hljs-literal">true</span>);
page.Request += <span class="hljs-keyword">async</span> (sender, e) =>
{
    <span class="hljs-keyword">if</span> (e.Request.ResourceType == ResourceType.Document)
        <span class="hljs-keyword">await</span> e.Request.ContinueAsync();
    <span class="hljs-keyword">else</span>
        <span class="hljs-keyword">await</span> e.Request.AbortAsync();
};

Guide de correction des erreurs

Améliorer les performances est une bonne chose, mais corriger les erreurs courantes est tout aussi important pour une automatisation fluide. Voici un guide rapide :

Type d'erreur	Cause commune	Solution
Exceptions de dépassement de délai	Chargement lent des pages	Utilisez WebDriverWait avec des délais d'attente plus longs.
Élément introuvable	Contenu dynamique	Utilisez des attentes explicites et des sélecteurs précis
Incompatibilité de version du pilote	Composants obsolètes	Gardez les versions de WebDriver et du navigateur alignées

Par exemple, vous pouvez utiliser ce code pour gérer les pages à chargement lent :

<span class="hljs-keyword">var</span> wait = <span class="hljs-keyword">new</span> WebDriverWait(driver, TimeSpan.FromSeconds(<span class="hljs-number">30</span>));
wait.Until(driver => ((IJavaScriptExecutor)driver)
    .ExecuteScript(<span class="hljs-string">"return document.readyState"</span>).Equals(<span class="hljs-string">"complete"</span>));

« Le mode sans tête peut parfois se comporter différemment en raison d'aspects de rendu non visibles. » - ClimbingLion [3]

Étapes de connexion et de sécurité

Une fois les erreurs gérées, concentrez-vous sur une authentification sécurisée et fiable. Voici un exemple de gestion sécurisée des informations d'identification :

<span class="hljs-comment">// Use environment variables for credentials</span>
<span class="hljs-keyword">var</span> username = Environment.GetEnvironmentVariable(<span class="hljs-string">"AUTH_USERNAME"</span>);
<span class="hljs-keyword">var</span> password = Environment.GetEnvironmentVariable(<span class="hljs-string">"AUTH_PASSWORD"</span>);

<span class="hljs-comment">// Apply rate limiting</span>
<span class="hljs-keyword">private</span> <span class="hljs-keyword">static</span> <span class="hljs-keyword">readonly</span> SemaphoreSlim _rateLimiter = <span class="hljs-keyword">new</span>(<span class="hljs-number">1</span>, <span class="hljs-number">1</span>);
<span class="hljs-keyword">await</span> _rateLimiter.WaitAsync();
<span class="hljs-keyword">try</span>
{
    <span class="hljs-keyword">await</span> page.TypeAsync(<span class="hljs-string">"#username"</span>, username);
    <span class="hljs-keyword">await</span> page.TypeAsync(<span class="hljs-string">"#password"</span>, password);
    <span class="hljs-keyword">await</span> Task.Delay(<span class="hljs-number">1000</span>); <span class="hljs-comment">// Respect rate limits</span>
}
<span class="hljs-keyword">finally</span>
{
    _rateLimiter.Release();
}

Principales pratiques de sécurité à suivre :

• Utilisez la limitation de débit basée sur IP pour éviter les abus.
• Stockez les informations sensibles telles que les informations d’identification dans des variables d’environnement.
• Assurer une bonne gestion des sessions.
• Effectuer des contrôles de sécurité réguliers.

Pour gérer les erreurs d’authentification, implémentez une logique de nouvelle tentative comme ceci :

<span class="hljs-keyword">try</span>
{
    <span class="hljs-keyword">await</span> page.WaitForSelectorAsync(<span class="hljs-string">".login-success"</span>, 
        <span class="hljs-keyword">new</span> WaitForSelectorOptions { Timeout = <span class="hljs-number">5000</span> });
}
<span class="hljs-keyword">catch</span> (WaitTaskTimeoutException)
{
    <span class="hljs-comment">// Log the failed attempt and retry</span>
    <span class="hljs-keyword">await</span> page.ReloadAsync();
}

Conclusion

Résumé

L'automatisation du navigateur sans tête en C# offre des options puissantes avec MarionnettisteAiguisé et Pilote Web SeleniumAlors que PuppeteerSharp est connu pour sa rapidité et son efficacité avec Chrome/Chromium, Selenium se distingue par sa compatibilité entre navigateurs et ses intégrations au niveau de l'entreprise. [5].

Voici une ventilation rapide:

• MarionnettisteAiguisé:Idéal pour l'automatisation Chrome/Chromium lorsque la vitesse et l'efficacité des ressources sont des priorités [1].
• Sélénium: Idéal pour les tâches nécessitant une compatibilité avec plusieurs navigateurs et une prise en charge linguistique plus large [4].

« Puppeteer est le meilleur choix lorsque la vitesse et le contrôle précis du navigateur sont essentiels. Selenium prend en charge davantage de langues et est plus adapté si vous devez exécuter vos tâches de scraping sur plusieurs navigateurs. » - ZenRows [5]

En comprenant les points forts de ces outils, vous pouvez sélectionner celui qui convient le mieux à vos besoins et projets spécifiques.

Apprentissage supplémentaire

Si vous souhaitez approfondir vos connaissances sur les navigateurs headless en C#, ces ressources peuvent vous aider :

• Inscrivez-vous à la #marionnettiste-sharp Canal Slack pour une assistance en temps réel [6].
• Jetez un coup d'œil au MarionnettisteSharp.Contrib bibliothèque pour des fonctionnalités supplémentaires [7].
• Plongez dans l' documentation officielle de l'API pour vous familiariser avec l'ensemble des fonctionnalités [6].

Les applications pratiques de ces outils incluent :

• Tests dans les pipelines CI/CD.
• Récupération de contenu Web dynamique.
• Suivi des performances du site Web.
• Réalisation de tests d'interface utilisateur sur différents navigateurs.

Le paysage des navigateurs headless est en constante évolution. Restez informé en participant aux projets GitHub et aux forums de développeurs pour tirer le meilleur parti des nouvelles mises à jour et des meilleures pratiques émergentes.

articles similaires

• Qu'est-ce qu'un navigateur sans tête et pourquoi en avez-vous besoin ?
• Navigateur sans tête Node.js : aperçu des meilleures solutions
• Chrome sans tête : comment l'utiliser et le configurer
• Utilisation de navigateurs sans tête avec Selenium : configuration et exemples de code