2017 wurde mit Chrome 59 der monitorlose Modus eingeführt, können Sie den Browser in einer unbeaufsichtigten Umgebung ohne sichtbare Benutzeroberfläche ausführen. Im Prinzip kann Chrome auch ohne Chrome ausgeführt werden.
Der monitorlose Modus ist eine beliebte Wahl für die Browserautomatisierung. Projekte wie Puppeteer oder ChromeDriver: Hier sehen Sie ein minimales Befehlszeilenbeispiel, in dem Sie den monitorlosen Modus verwenden, um eine PDF-Datei zu erstellen. einer bestimmten URL:
chrome --headless --print-to-pdf https://developer.chrome.com/
Wie funktioniert die Funktion „Headless“?
Bevor wir uns ansehen, wie Headless funktioniert, sollten Sie wissen,
"alt" Headless hat funktioniert. Im vorherigen Befehlszeilen-Snippet wird die --headless
Befehlszeilen-Flag, das darauf hinweist, dass Headless nur ein Betriebsmodus des
normalen Chrome-Browsers. Vielleicht war es überraschend, dass das nicht stimmte.
Tatsächlich war das alte Headless-Modell
eine separate, alternative Browserimplementierung
die als Teil desselben Chrome-Binärprogramms ausgeliefert wurden. Daten werden nicht geteilt
Chrome-Browsercode in
//chrome
Die Implementierung und Wartung eines separaten monitorlosen Browsers brachte viele Engineering-Aufwand. Da Headless ein separater wurden eigene Fehler und Funktionen gefunden, Chrome Dies führte zu Verwirrung bei automatisierten Browsertests, die möglicherweise im monitorlosen Modus fehlschlagen und im monitorlosen Modus fehlschlagen oder umgekehrt.
Darüber hinaus hat Headless alle automatisierten Tests ausgeschlossen, die auf dem Browser Installation der Erweiterung. Dasselbe gilt für alle anderen Funktionen auf Browserebene. nur wenn Headless eine eigene, separate Implementierung hatte.
Das Chrome-Team hat jetzt den monitorlosen Modus und den monitorlosen Modus zusammengeführt.
Der neue monitorlose Modus ist ab Chrome 112 verfügbar. In diesem Modus erstellt Chrome aber kein Plattformfenster angezeigt wird. Alle anderen Funktionen, Zukunft, sind uneingeschränkt verfügbar.
Monitorlosen Modus verwenden
Übergeben Sie das Befehlszeilen-Flag --headless=new
, um den neuen monitorlosen Modus zu verwenden:
chrome --headless=new
Der alte monitorlose Modus ist vorerst weiterhin verfügbar mit:
chrome --headless=old
In Puppeteer
So aktivieren Sie den neuen monitorlosen Modus in Puppeteer:
import puppeteer from 'puppeteer';
const browser = await puppeteer.launch({
headless: 'new',
// `headless: true` (default) enables old Headless;
// `headless: 'new'` enables new Headless;
// `headless: false` enables "headful" mode.
});
const page = await browser.newPage();
await page.goto('https://developer.chrome.com/');
// …
await browser.close();
In Selenium WebDriver
So verwenden Sie den neuen monitorlosen Modus in Selenium-WebDriver:
const driver = await env
.builder()
.setChromeOptions(options.addArguments('--headless=new'))
.build();
await driver.get('https://developer.chrome.com/');
// …
await driver.quit();
Weitere Informationen sowie Beispiele zur Verwendung anderer Sprachbindungen finden Sie im Blogpost des Selenium-Teams.
Befehlszeilen-Flags
Die folgenden Befehlszeilen-Flags sind im neuen monitorlosen Modus verfügbar.
--dump-dom
Das Flag --dump-dom
gibt das serialisierte DOM der Landingpage in stdout aus.
Beispiel:
chrome --headless=new --dump-dom https://developer.chrome.com/
Dies unterscheidet sich vom Drucken des HTML-Quellcodes,
curl
Damit du die Ausgabe von --dump-dom
abrufen kannst, parst Chrome zuerst den HTML-Code
in ein DOM wandeln, alle <script>
ausführen, die das DOM ändern könnten, und
wandelt dieses DOM wieder in einen serialisierten HTML-String um.
--screenshot
Mit dem Flag --screenshot
wird ein Screenshot der Landingpage erstellt und unter dem Namen
screenshot.png
im aktuellen Arbeitsverzeichnis. Dies ist besonders nützlich in
mit dem Flag --window-size
kombinieren.
Beispiel:
chrome --headless=new --screenshot --window-size=412,892 https://developer.chrome.com/
--print-to-pdf
Das Flag --print-to-pdf
speichert die Zielseite als PDF-Datei mit dem Namen output.pdf
in
im aktuellen Arbeitsverzeichnis. Beispiel:
chrome --headless=new --print-to-pdf https://developer.chrome.com/
Optional können Sie das Flag --no-pdf-header-footer
hinzufügen, um den Druckvorgang wegzulassen
Kopfzeile (mit dem aktuellen Datum und der aktuellen Uhrzeit) und Fußzeile (mit URL und Seite)
Nummer).
chrome --headless=new --print-to-pdf --no-pdf-header-footer https://developer.chrome.com/
Nicht: Die Funktion hinter dem Flag --no-pdf-header-footer
war zuvor
verfügbar mit dem Flag --print-to-pdf-no-header
. Möglicherweise müssen Sie
den alten Flag-Namen, falls Sie eine frühere Version verwenden.
--timeout
Das Flag --timeout
definiert die maximale Wartezeit (in Millisekunden), nach der
Der Inhalt der Seite wird von --dump-dom
, --screenshot
und
--print-to-pdf
, auch wenn die Seite noch geladen wird.
chrome --headless=new --print-to-pdf --timeout=5000 https://developer.chrome.com/
Das Flag --timeout=5000
weist Chrome an, mit dem Drucken bis zu 5 Sekunden zu warten
in der PDF-Datei. Daher dauert die Ausführung dieses Vorgangs höchstens 5 Sekunden.
--virtual-time-budget
--virtual-time-budget
fungiert als „Vorspulen“ für zeitabhängigen Code
(z. B. setTimeout
/setInterval
). Dadurch wird der Browser gezwungen,
so schnell wie möglich, während die Seite den Eindruck erweckt, dass die
die Zeit tatsächlich vergeht.
Sehen Sie sich diese Demo an, um die Verwendung zu veranschaulichen.
Inkrementierungen, Protokolle und Anzeigen von Zählern pro Sekunde
mit setTimeout(fn, 1000)
. Hier ist der entsprechende Code:
<output>0</output>
<script>
const element = document.querySelector('output');
let counter = 0;
setInterval(() => {
counter++;
console.log(counter);
element.textContent = counter;
}, 1_000);
</script>
Nach einer Sekunde enthält die Seite „1“. nach zwei Sekunden, „2“ usw. So erfassen Sie den Status der Seite nach 42 Sekunden und speichern sie als PDF:
chrome --headless=new --print-to-pdf --virtual-time-budget=42000 https://mathiasbynens.be/demo/time
--allow-chrome-scheme-url
Das Flag --allow-chrome-scheme-url
ist für den Zugriff auf chrome://
-URLs erforderlich.
Dieses Flag ist ab Chrome 123 verfügbar. Beispiel:
chrome --headless=new --print-to-pdf --allow-chrome-scheme-url chrome://gpu
Fehlerbehebung
Da Chrome im monitorlosen Modus praktisch unsichtbar ist, mag es kompliziert klingen. um ein Problem zu lösen. Es ist möglich, die monitorlose Chrome-Version ähnlich wie Headful Chrome.
Starten Sie Chrome im monitorlosen Modus mit der
--remote-debugging-port
-Befehlszeilen-Flag.
chrome --headless=new --remote-debugging-port=0 https://developer.chrome.com/
Damit wird eine eindeutige WebSocket-URL für stdout ausgegeben, zum Beispiel:
DevTools listening on ws://127.0.0.1:60926/devtools/browser/b4bd6eaa-b7c8-4319-8212-225097472fd9
In einer Chrome-Instanz können wir dann Remote-Debugging in Chrome DevTools ausführen, um eine Verbindung herzustellen zum monitorlosen Ziel hinzu und sehen Sie es sich an.
- Gehen Sie zu
chrome://inspect
und klicken Sie auf die Schaltfläche Konfigurieren.... - Geben Sie die IP-Adresse und die Portnummer aus der WebSocket-URL ein.
- Im vorherigen Beispiel habe ich
127.0.0.1:60926
eingegeben.
- Im vorherigen Beispiel habe ich
- Klicken Sie auf Fertig. Es sollte ein Remote-Ziel mit allen zugehörigen Tabs und anderen aufgeführten Zielen.
- Klicken Sie auf Prüfen, um auf die Chrome-Entwicklertools zuzugreifen und die Remote-Version zu prüfen. Monitorloses Ziel mit Livestream der Seite.
Feedback
Wir freuen uns auf Ihr Feedback zum neuen monitorlosen Modus. Wenn auf Probleme stoßen, melden Sie den Fehler.