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. Możesz używać 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

Używaj starego trybu bez interfejsu graficznego

Wcześniej tryb bez interfejsu graficznego był oddzielną, alternatywną implementacją przeglądarki, która była dostarczana jako część 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 użyć trybu bez interfejsu graficznego w aplikacji 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/

Różni się to od drukowania kodu źródłowego HTML, którego można użyć w kodzie curl. Aby wygenerować 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 zserializowany ciąg znaków HTML.

--screenshot

Flaga --screenshot robi zrzut ekranu strony docelowej i zapisuje go jako screenshot.png w bieżącym katalogu roboczym. Przydaje się to szczególnie w połączeniu z flagą --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ą w bieżącym katalogu roboczym jako plik PDF o nazwie output.pdf. 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 treść strony jest przechwytywana przez funkcje --dump-dom, --screenshot i --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, że plik PDF może zostać wydrukowany dopiero po 5 sekundach. 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 kodu zależnego od czasu (np. setTimeout/setInterval). Wymusza na przeglądarce jak najszybsze wykonanie dowolnego kodu strony, sprawiając przy tym, że strona „myśli”, że czas płynie normalnie.

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 jednej sekundzie strona zawiera wartość „1”, po dwóch 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, rozwiązanie problemu może wydawać się trudne. Debugowanie Chrome bez interfejsu graficznego jest możliwe w sposób bardzo podobny do debugowania Chrome z interfejsem graficznym.

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 pełnej wersji Chrome możemy następnie użyć debugowania zdalnego w Narzędziach deweloperskich Chrome, aby połączyć się z obiektem bez interfejsu graficznego i go sprawdzić.

  1. Przejdź na stronę chrome://inspect i kliknij przycisk Konfiguruj....
  2. Wpisz adres IP i numer portu z adresu URL WebSocket.
    • W poprzednim przykładzie mam wpisany ciąg 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ę

Chętnie poznamy Twoją opinię na temat trybu bez interfejsu graficznego. Jeśli napotkasz problemy, zgłoś błąd.