Tryb bez interfejsu graficznego w Chrome

Peter Kvitek
Peter Kvitek

W trybie bez interfejsu przeglądarka Chrome może działać w otoczeniu bez nadzoru, bez widocznego interfejsu użytkownika. W podstawie możesz uruchomić Chrome bez chrome.

Tryb bez interfejsu jest popularnym wyborem do automatyzacji przeglądarki za pomocą takich projektów jak Puppeteer czy ChromeDriver.

Korzystanie z trybu bez interfejsu graficznego

Aby korzystać z trybu bez interfejsu graficznego, prześlij flagę wiersza poleceń --headless:

chrome --headless

Korzystanie ze starego trybu bez interfejsu graficznego

Wcześniej tryb bez interfejsu graficznego był oddzielną, alternatywną implementacją przeglądarki, która była dostarczana w ramach tego samego pliku binarnego Chrome. Nie udostępnia żadnego kodu przeglądarki Chrome w //chrome.

Chrome ma teraz zjednolicone tryby bez interfejsu graficznego i z interfejsem.

Tryb bez interfejsu graficznego korzysta z kodu Chrome.

Obecnie stary tryb bez interfejsu graficznego jest nadal dostępny w przypadku:

chrome --headless=old

W Puppeteer

Aby korzystać z trybu bez interfejsu graficznego w Puppeteer:

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

W Selenium-WebDriver

Aby użyć trybu bez interfejsu graficznego w Selenium-WebDriver:

const driver = await env
  .builder()
  .setChromeOptions(options.addArguments('--headless'))
  .build();

await driver.get('https://developer.chrome.com/');

// …

await driver.quit();

Więcej informacji, w tym przykłady użycia innych języków, znajdziesz w poście na blogu zespołu Selenium.

Flagi wiersza poleceń

W trybie bez głowicy dostępne są te flagi wiersza poleceń.

--dump-dom

Flaga --dump-dom wyprowadza na wyjście do standardowego (stdout) serializowany DOM strony docelowej. Na przykład:

chrome --headless --dump-dom https://developer.chrome.com/

Jest to inne działanie niż drukowanie kodu źródłowego HTML, które można wykonać za pomocą curl. Aby uzyskać dane wyjściowe funkcji --dump-dom, Chrome najpierw przeanalizuje kod HTML, przekształcając go w model DOM, a następnie wykona wszystkie instrukcje <script>, które mogą zmienić model DOM, a potem przekształci ten model z powrotem w serializowany ciąg znaków HTML.

--screenshot

Flaga --screenshot robi zrzut ekranu strony docelowej i zapisuje go jako screenshot.png w bieżącym katalogu roboczym. Jest to szczególnie przydatne w połączeniu z opcją --window-size.

Na przykład:

chrome --headless --screenshot --window-size=412,892 https://developer.chrome.com/

--print-to-pdf

Flaga --print-to-pdf zapisuje stronę docelową jako plik PDF o nazwie output.pdf w bieżącym katalogu roboczym. Na przykład:

chrome --headless --print-to-pdf https://developer.chrome.com/

Opcjonalnie możesz dodać flagę --no-pdf-header-footer, aby pominąć nagłówek (z bieżącą datą i godziną) oraz stopkę (z adresem URL i numerem strony) w wersji drukowanej.

chrome --headless --print-to-pdf --no-pdf-header-footer https://developer.chrome.com/

Uwaga: funkcja obsługiwana przez flagę --no-pdf-header-footer była wcześniej dostępna za pomocą flagi --print-to-pdf-no-header. Jeśli używasz starszej wersji, konieczne może być użycie starej nazwy flagi.

--timeout

Flaga --timeout określa maksymalny czas oczekiwania (w milisekundach), po którym zawartość strony jest przechwytywana przez --dump-dom, --screenshot--print-to-pdf, nawet jeśli strona nadal się wczytuje.

chrome --headless --print-to-pdf --timeout=5000 https://developer.chrome.com/

Flaga --timeout=5000 informuje Chrome, aby czekał maksymalnie 5 sekund przed wydrukowaniem pliku PDF. W związku z tym proces ten trwa najwyżej 5 sekund.

--virtual-time-budget

--virtual-time-budget działa jak „przewijanie do przodu” w przypadku dowolnego kodu zależnego od czasu (np. setTimeout/setInterval). Wymusza na przeglądarce jak najszybsze wykonanie dowolnego kodu strony, sprawiając, że strona „myśli”, że czas płynie.

Aby zilustrować jego użycie, rozważ ten demonstracyjny przykład, który co sekundę zwiększa, rejestruje i wyświetla licznik za pomocą funkcji setTimeout(fn, 1000). Oto odpowiedni kod:

<output>0</output>
<script>
  const element = document.querySelector('output');
  let counter = 0;
  setInterval(() => {
    counter++;
    console.log(counter);
    element.textContent = counter;
  }, 1_000);
</script>

Po 1 sekundzie strona zawiera „1”, po 2 sekundach – „2” itd. Aby zarejestrować stan strony po 42 sekundach i zapisać go jako plik PDF:

chrome --headless --print-to-pdf --virtual-time-budget=42000 https://mathiasbynens.be/demo/time

--allow-chrome-scheme-url

Flaga --allow-chrome-scheme-url jest wymagana do uzyskiwania dostępu do adresów URL chrome://. Ta flaga jest dostępna w Chrome 123. Oto przykład:

chrome --headless --print-to-pdf --allow-chrome-scheme-url chrome://gpu

Debugowanie

Ponieważ Chrome jest w trybie bez interfejsu niewidoczny, może być trudno rozwiązać problem. Debugowanie wersji bez interfejsu graficznego Chrome jest możliwe w sposób bardzo podobny do wersji z interfejsem.

Uruchom Chrome w trybie bez interfejsu graficznego za pomocą flagi wiersza poleceń --remote-debugging-port.

chrome --headless --remote-debugging-port=0 https://developer.chrome.com/

To polecenie wypisuje na wyjście standardowe unikalny adres URL WebSocket, na przykład:

DevTools listening on ws://127.0.0.1:60926/devtools/browser/b4bd6eaa-b7c8-4319-8212-225097472fd9

W przykładowym wystąpieniu Chrome możemy użyć debugowania zdalnego w Narzędziach deweloperskich Chrome, aby połączyć się z docelowym urządzeniem bez interfejsu graficznego i je sprawdzić.

  1. Otwórz chrome://inspect i kliknij przycisk Skonfiguruj….
  2. Wpisz adres IP i numer portu z adresu URL WebSocket.
    • W poprzednim przykładzie wpisałem 127.0.0.1:60926.
  3. Kliknij Gotowe. Powinien pojawić się element docelowy zdalny ze wszystkimi kartami i innymi elementami docelowymi.
  4. Kliknij Zbadaj, aby uzyskać dostęp do Narzędzi deweloperskich w Chrome i zbadać zdalny bezgłowy cel, w tym podgląd na żywo strony.

Narzędzia deweloperskie w Chrome mogą sprawdzać zdalne strony docelowe bez interfejsu

Prześlij opinię

Czekamy na Twoją opinię na temat trybu bez głowy. Jeśli napotkasz problemy, zgłoś błąd.