Con el modo sin interfaz gráfica de Chrome, puedes ejecutar el navegador en un entorno sin supervisión, sin ninguna IU visible. En esencia, puedes ejecutar Chrome sin Chrome.
El modo sin interfaz gráfica es una opción popular para la automatización de navegadores, por medio de proyectos como Puppeteer o ChromeDriver.
Cómo usar el modo sin interfaz gráfica
Para usar el modo sin cabeza, pasa la marca de línea de comandos --headless
:
chrome --headless
Cómo usar el modo sin interfaz gráfica anterior
Anteriormente, el modo sin interfaz gráfica era una implementación de navegador independiente y alternativa que se enviaba como parte del mismo objeto binario de Chrome. No se compartió ninguno del código del navegador Chrome en //chrome
.
Chrome ahora unificó los modos sin interfaz gráfica y con interfaz gráfica.
Por ahora, el modo sin interfaz gráfica anterior sigue disponible con lo siguiente:
chrome --headless=old
En Puppeteer
Para usar el modo sin interfaz gráfica en Puppeteer, haz lo siguiente:
import puppeteer from 'puppeteer';
const browser = await puppeteer.launch({
headless: 'true', // (default) enables Headless
// `headless: 'old'` enables old Headless
// `headless: false` enables "headful" mode
});
const page = await browser.newPage();
await page.goto('https://developer.chrome.com/');
// …
await browser.close();
En Selenium-WebDriver
Para usar el modo sin interfaz gráfica en Selenium-WebDriver, haz lo siguiente:
const driver = await env
.builder()
.setChromeOptions(options.addArguments('--headless'))
.build();
await driver.get('https://developer.chrome.com/');
// …
await driver.quit();
Consulta la entrada de blog del equipo de Selenium para obtener más información, incluidos ejemplos con otras vinculaciones de lenguaje.
Marcas de línea de comandos
Las siguientes marcas de línea de comandos están disponibles en el modo sin interfaz gráfica.
--dump-dom
La marca --dump-dom
imprime el DOM serializado de la página de destino en stdout.
Por ejemplo:
chrome --headless --dump-dom https://developer.chrome.com/
Esto es diferente de imprimir el código fuente HTML, que puedes hacer con curl
. Para mostrarte el resultado de --dump-dom
, Chrome primero analiza el código HTML en un DOM, ejecuta cualquier <script>
que pueda alterar el DOM y, luego, vuelve a convertirlo en una cadena serializada de HTML.
--screenshot
La marca --screenshot
toma una captura de pantalla de la página de destino y la guarda como screenshot.png
en el directorio de trabajo actual. Esto es muy útil en combinación con la marca --window-size
.
Por ejemplo:
chrome --headless --screenshot --window-size=412,892 https://developer.chrome.com/
--print-to-pdf
La marca --print-to-pdf
guarda la página de destino como un archivo PDF llamado output.pdf
en el directorio de trabajo actual. Por ejemplo:
chrome --headless --print-to-pdf https://developer.chrome.com/
De forma opcional, puedes agregar la marca --no-pdf-header-footer
para omitir el encabezado de impresión (con la fecha y la hora actuales) y el pie de página (con la URL y el número de página).
chrome --headless --print-to-pdf --no-pdf-header-footer https://developer.chrome.com/
No: La funcionalidad detrás de la marca --no-pdf-header-footer
estaba disponible antes con la marca --print-to-pdf-no-header
. Es posible que debas usar el nombre de la marca anterior si usas una versión anterior.
--timeout
La marca --timeout
define el tiempo de espera máximo (en milisegundos) después del cual --dump-dom
, --screenshot
y --print-to-pdf
capturan el contenido de la página, incluso si la página aún se está cargando.
chrome --headless --print-to-pdf --timeout=5000 https://developer.chrome.com/
La marca --timeout=5000
le indica a Chrome que espere hasta 5 segundos antes de imprimir el archivo PDF. Por lo tanto, este proceso tarda como máximo 5 segundos en ejecutarse.
--virtual-time-budget
--virtual-time-budget
actúa como un “avance rápido” para cualquier código dependiente del tiempo (por ejemplo, setTimeout
/setInterval
). Obliga al navegador a ejecutar cualquier código de la página lo más rápido posible y, al mismo tiempo, hace que la página crea que el tiempo realmente pasa.
Para ilustrar su uso, considera esta demostración, que incrementa, registra y muestra un contador cada segundo con setTimeout(fn, 1000)
. Este es el código relevante:
<output>0</output>
<script>
const element = document.querySelector('output');
let counter = 0;
setInterval(() => {
counter++;
console.log(counter);
element.textContent = counter;
}, 1_000);
</script>
Después de un segundo, la página contiene "1"; después de dos segundos, "2", y así sucesivamente. A continuación, te mostramos cómo capturar el estado de la página después de 42 segundos y guardarlo como PDF:
chrome --headless --print-to-pdf --virtual-time-budget=42000 https://mathiasbynens.be/demo/time
--allow-chrome-scheme-url
La marca --allow-chrome-scheme-url
es obligatoria para acceder a las URLs de chrome://
. Esta marca está disponible a partir de la versión 123 de Chrome. Por ejemplo:
chrome --headless --print-to-pdf --allow-chrome-scheme-url chrome://gpu
Depurar
Dado que Chrome es invisible en el modo sin interfaz gráfica, puede parecer difícil solucionar un problema. Es posible depurar Chrome sin interfaz gráfica de una manera muy similar a Chrome con interfaz gráfica.
Inicia Chrome en modo sin interfaz gráfica con la marca de línea de comandos --remote-debugging-port
.
chrome --headless --remote-debugging-port=0 https://developer.chrome.com/
Esto imprime una URL de WebSocket única en stdout, por ejemplo:
DevTools listening on ws://127.0.0.1:60926/devtools/browser/b4bd6eaa-b7c8-4319-8212-225097472fd9
En una instancia de Chrome con interfaz gráfica, podemos usar la depuración remota de Chrome DevTools para conectarnos al destino sin interfaz gráfica y, luego, inspeccionarlo.
- Ve a
chrome://inspect
y haz clic en el botón Configurar…. - Ingresa la dirección IP y el número de puerto de la URL de WebSocket.
- En el ejemplo anterior, ingresé
127.0.0.1:60926
.
- En el ejemplo anterior, ingresé
- Haz clic en Listo. Deberías ver un destino remoto con todas sus pestañas y otros destinos enumerados.
- Haz clic en Inspeccionar para acceder a las Herramientas para desarrolladores de Chrome y, luego, inspecciona el objetivo sin cabeza remoto, incluida una vista en vivo de la página.
Comentarios
Esperamos recibir tus comentarios sobre el modo sin interfaz gráfica. Si tienes algún problema, informa un error.