Navegador sin interfaz gráfica en C#: configuración y ejemplos de código

Los navegadores sin interfaz gráfica permiten automatizar tareas web sin una interfaz gráfica. En C#, se utilizan ampliamente para realizar pruebas, extraer datos de la web y administrar contenido. Dos herramientas populares son TitiriteroAfilado (optimizado para Chrome/Chromium) y Selenio WebDriver (compatible con varios navegadores). A continuación, se muestra una comparación:

Característica	TitiriteroAfilado	Selenio WebDriver
Soporte del navegador	Cromo / cromo	Chrome, Firefox, Edge, etc.
Complejidad de configuración	Fácil (descarga automática de Chromium)	Requiere configuración de controlador independiente
Rendimiento	Más rápido para Chrome/Chromium	Coherente en todos los navegadores
Diseño API	Moderno, basado en promesas	Tradicional, orientado a objetos
Uso de la memoria	Más Bajo	Varía según el navegador

Principales ventajas de los navegadores sin interfaz gráfica:

• Velocidad: Pruebas más rápidas sin renderizado de GUI.
• Eficiencia: Utiliza menos memoria y CPU.
• Automatización: Maneja tareas como extracción de datos, pruebas y envío de formularios.

Para una configuración rápida:

1. Instale la SDK de .NET y los paquetes requeridos (PuppeteerSharp or Selenium.WebDriver).
2. Utilice PuppeteerSharp para la automatización específica de Chrome o Selenium para compatibilidad con varios navegadores.
3. Escriba scripts en C# para interactuar con páginas web, extraer datos o realizar pruebas automatizadas.

Ambas herramientas son potentes. PuppeteerSharp es ideal para tareas centradas en Chrome, mientras que Selenium se destaca en escenarios multiplataforma. Elija según las necesidades de su proyecto.

Pruebas del navegador sin interfaz gráfica de Selenium en C# con PhantomJS

Requisitos de instalación

Para configurar un navegador sin interfaz gráfica en C# se necesitan herramientas y configuraciones específicas. A continuación, se detalla el software necesario y se compara PuppeteerSharp y Selenium WebDriver.

Instalación de software requerida

Para comenzar, necesitará lo siguiente:

• SDK de .NET:Instálelo a través de uno de estos métodos:
  • Visual Studio Instalador con la carga de trabajo ASP.NET
  • Visual Studio Code con el Kit de desarrollo de C# extensión
  • Descarga directa desde el sitio web de .NET
  • Instalación mediante línea de comandos mediante Administrador de paquetes de Windows (Obtener una victoria)
• Paquetes:Instala los paquetes necesarios para tu proyecto:

PREMIUM	Comando de instalación	Proposito
TitiriteroAfilado	dotnet agregar paquete PuppeteerSharp	Automatiza y controla Chrome/Chromium
Selenio WebDriver	dotnet agrega el paquete Selenium.WebDriver --versión 4.29.0	Permite la automatización de múltiples navegadores
Controladores del navegador	Descargue los controladores necesarios para su navegador	Garantiza la funcionalidad de Selenium

Una vez que el software esté listo, examinemos cómo se comparan PuppeteerSharp y Selenium WebDriver.

TitiriteroAfilado vs Selenio WebDriver

Ambas herramientas son excelentes para la automatización de navegadores sin interfaz gráfica, pero tienen diferentes propósitos. A continuación, se muestra una comparación rápida:

Característica	TitiriteroAfilado	Selenio WebDriver
Soporte del navegador	Limitado a Chrome/Chromium	Funciona con Chrome, Firefox, Edge, etc.
Complejidad de configuración	Sencillo: incluye descarga automática de Chromium	Requiere instalación de controlador independiente
Rendimiento	Optimizado para Chrome/Chromium	Coherente entre los navegadores compatibles
Diseño API	Moderno, basado en promesas	Tradicional, orientado a objetos
Uso de la memoria	Menor uso de memoria	Varía según el navegador.

Para los desarrolladores de C#, PuppeteerSharp suele ser el más rápido de configurar. Su gestión automática de Chromium y su API fácil de usar lo hacen ideal para proyectos centrados únicamente en Chrome/Chromium. Por otro lado, Selenium WebDriver es más adecuado para proyectos que requieren compatibilidad entre navegadores, ya que admite varios navegadores a través de eventos a nivel de SO y controladores dedicados.

Para descargar Chromium para PuppeteerSharp, utilice el siguiente código:

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

Esta configuración le proporciona las herramientas que necesita para una automatización robusta del navegador sin cabeza, ya sea que esté trabajando en marcos de prueba, raspado web o automatizando flujos de trabajo.

Introducción a PuppeteerSharp

PuppeteerSharp ofrece una potente API para controlar Chrome o Chromium en modo headless, lo que lo convierte en una opción sólida para tareas de automatización web de C#.

Primer lanzamiento del navegador

Una vez que haya instalado PuppeteerSharp a través de NuGet, puede configurar e iniciar el navegador de esta manera:

<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>);

Después de iniciar el navegador, puede comenzar a interactuar con páginas web y recopilar datos.

Acciones de página y recopilación de datos

PuppeteerSharp le permite realizar diversas acciones en páginas web y extraer información:

<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>);

Para un mejor rendimiento de raspado, considere estas técnicas:

Tecnologia	Cómo implementar	Beneficios
Solicitud de intercepción	Bloquear recursos innecesarios	Reduce el tiempo de carga
Almacenamiento en caché de activos	Utilice un directorio de datos de usuario personalizado	Acelera las visitas repetidas
Limitación de la velocidad	Agregar retrasos entre solicitudes	Reduce la tensión del servidor

Trabajar con contenido dinámico

El contenido estático es sencillo, pero el contenido dinámico a menudo requiere pasos adicionales, como esperar a que se carguen los elementos o manejar datos renderizados en 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>);

Para interacciones más complejas, como trabajar con aplicaciones como Bing Maps, puedes encadenar acciones para manejar contenido avanzado renderizado en JavaScript.

No olvides gestionar los errores y establecer tiempos de espera para evitar problemas inesperados:

<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>);
}

Por último, asegúrese de limpiar los recursos adecuadamente:

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

Este enfoque mantiene la eficiencia de su automatización y evita pérdidas de memoria.

sbb-itb-23997f1

Uso de Selenium WebDriver

Selenium WebDriver es una herramienta potente para la automatización de navegadores en C#. A diferencia de PuppeteerSharp, que se centra en Chrome, Selenium es compatible con varios navegadores, lo que lo convierte en una opción versátil para realizar pruebas.

Configuración del modo sin cabeza

Para configurar Selenium WebDriver en modo sin interfaz gráfica, necesitas configuraciones específicas del navegador. Aquí te mostramos cómo configurarlo para Chrome, Firefox y 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);

Ejecutar navegadores en modo sin cabeza le permite realizar tareas como interactuar con elementos de la página sin una interfaz de usuario visible.

"Al descontinuar el método de conveniencia (y eliminarlo en Selenium 4.10.0), los usuarios tendrán el control total para elegir qué modo sin interfaz gráfica desean usar". - Diego Molina, Selenium [ 2 ]

Interacciones de página avanzadas

Selenium WebDriver gestiona interacciones web detalladas sin esfuerzo. A continuación, se muestra un ejemplo de cómo automatizar tareas comunes:

<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();

Selectores de elementos comunes:

Tipo de selector	Mejor caso de uso	Ejemplo
ID	Elementos únicos	Por.Id("botón de inicio de sesión")
CSS	Patrones complejos	Por.CssSelector(".nav > .item")
XPath	Contenido dinámico	Por.XPath("//div[contiene(@class, 'dynamic')]")

Opciones de exportación de página

Selenium ofrece varias formas de capturar y exportar contenido de páginas. A continuación, se muestran algunos ejemplos:

<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);

Las configuraciones de tiempo son esenciales para una automatización fluida:

<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>)));

Por último, asegúrate de limpiar adecuadamente los recursos cuando hayas terminado:

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

Solución de problemas y sugerencias

Gestión de velocidad y memoria

Los navegadores sin interfaz gráfica, como los que se utilizan en PuppeteerSharp, omiten la carga de CSS, lo que los hace más rápidos que los navegadores tradicionales. Para aprovechar al máximo esta velocidad y reducir el uso de recursos, considere estas optimizaciones:

<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>;

También puedes bloquear recursos innecesarios como imágenes u hojas de estilo para ahorrar memoria:

<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();
};

Guía de corrección de errores

Mejorar el rendimiento es genial, pero solucionar errores comunes es igual de importante para lograr una automatización fluida. A continuación, se incluye una guía rápida:

Tipo de error	Causa comun	Solución:
Excepciones de tiempo de espera	Carga de página lenta	Utilice WebDriverWait con tiempos de espera más largos
Elemento no encontrado	Contenido dinámico	Utilice esperas explícitas y selectores precisos
La versión del controlador no coincide	Componentes obsoletos	Mantenga alineadas las versiones de WebDriver y del navegador

Por ejemplo, puedes usar este código para gestionar páginas de carga lenta:

<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>));

"El modo sin cabeza a veces puede comportarse de manera diferente debido a que los aspectos de renderizado no son visibles". - ClimbingLion [ 3 ]

Pasos de inicio de sesión y seguridad

Una vez que se hayan gestionado los errores, hay que centrarse en una autenticación segura y fiable. A continuación, se muestra un ejemplo de cómo gestionar las credenciales de forma segura:

<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();
}

Prácticas de seguridad clave a seguir:

• Utilice la limitación de velocidad basada en IP para evitar abusos.
• Almacene información confidencial, como credenciales, en variables de entorno.
• Asegúrese de que la sesión se gestione correctamente.
• Realizar revisiones de seguridad periódicas.

Para gestionar errores de autenticación, implemente una lógica de reintento como la siguiente:

<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();
}

Conclusión

Resumen

La automatización del navegador sin interfaz gráfica en C# proporciona opciones potentes con TitiriteroAfilado y Selenio WebDriverSi bien PuppeteerSharp es conocido por su velocidad y eficiencia con Chrome/Chromium, Selenium destaca por su compatibilidad con varios navegadores y sus integraciones a nivel empresarial. [ 5 ].

Aquí hay un desglose rápido:

• TitiriteroAfilado:Ideal para la automatización de Chrome/Chromium cuando la velocidad y la eficiencia de los recursos son prioridades [ 1 ].
• Selenio:Ideal para tareas que requieren compatibilidad con múltiples navegadores y un soporte de idiomas más amplio. [ 4 ].

"Puppeteer es la mejor opción cuando la velocidad y el control detallado del navegador son esenciales. Selenium admite más idiomas y es más adecuado si necesita ejecutar sus tareas de extracción de datos en varios navegadores". - ZenRows [ 5 ]

Al comprender las fortalezas de estas herramientas, podrá seleccionar la adecuada para sus necesidades y proyectos específicos.

Aprendizaje adicional

Si desea ampliar su conocimiento sobre los navegadores sin interfaz gráfica en C#, estos recursos pueden ayudarlo:

• Únete a los #titiritero-afilado Canal de Slack para asistencia en tiempo real [ 6 ].
• Consulte el PuppeteerSharp.Contribución biblioteca para funciones adicionales [ 7 ].
• Lee el documentación oficial de la API Para familiarizarse con la gama completa de capacidades [ 6 ].

Las aplicaciones prácticas de estas herramientas incluyen:

• Pruebas en pipelines de CI/CD.
• Extrayendo contenido web dinámico.
• Monitoreo del rendimiento del sitio web.
• Realizar pruebas de UI en diferentes navegadores.

El panorama de los navegadores sin interfaz gráfica está en constante avance. Manténgase actualizado participando en proyectos de GitHub y foros de desarrolladores para aprovechar al máximo las nuevas actualizaciones y las mejores prácticas emergentes.

Artículos relacionados con

• ¿Qué es un navegador sin cabeza y por qué lo necesitas?
• Navegador sin interfaz gráfica Node.js: descripción general de las mejores soluciones
• Chrome sin interfaz gráfica: cómo utilizarlo y configurarlo
• Uso de navegadores sin interfaz gráfica con Selenium: configuración y ejemplos de código