Chrome Gözetimsiz modu

Mathias Bynens

Peter Kvitek

Chrome Headless modu sayesinde, tarayıcıyı görünür kullanıcı arayüzü olmadan gözetimsiz bir ortamda çalıştırabilirsiniz. Yani Chrome'u Chrome olmadan çalıştırabilirsiniz.

Gözetimsiz mod, Puppeteer veya ChromeDriver gibi projeler aracılığıyla tarayıcı otomasyonu için popüler bir seçimdir.

Gözetimsiz modu kullanma

Gözetimsiz modu kullanmak için --headless komut satırı işaretini iletin:

chrome --headless

Eski Gözetimsiz modu kullan

Daha önce, Gözetimsiz mod, aynı Chrome ikili programının bir parçası olarak gönderilen ayrı, alternatif bir tarayıcı uygulamasıydı. //chrome adresindeki Chrome Tarayıcı kodunun hiçbirini paylaşmadı.

Chrome artık birleştirilmiş Gözetimsiz ve Başlıklı modlara sahiptir.

Şu anda eski Headless modu aşağıdakilerle kullanılabilir:

chrome --headless=old

Puppeteer'da

Puppeteer'da Headless modunu kullanmak için:

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

Selenium-WebDriver'da

Selenium-WebDriver'da gözetimsiz modu kullanmak için:

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

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

// …

await driver.quit();

Diğer dil bağlamalarını kullanan örnekler de dahil olmak üzere daha fazla bilgi için Selenium ekibinin blog yayınını inceleyin.

Komut satırı işaretleri

Aşağıdaki komut satırı işaretleri, Başsız modda kullanılabilir.

--dump-dom

--dump-dom işareti, hedef sayfanın serileştirilmiş DOM'sini stdout'a yazdırır. Örneğin:

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

Bu, curl ile yapabileceğiniz HTML kaynak kodunu yazdırmaktan farklıdır. Chrome, --dump-dom etkinleştirildiğinde size çıkışı sunmak için önce HTML kodunu bir DOM'a ayırır, DOM'u değiştirebilecek tüm <script>'leri yürütür, ardından bu DOM'u serileştirilmiş bir HTML dizesine dönüştürür.

--screenshot

--screenshot işareti, hedef sayfanın ekran görüntüsünü alır ve geçerli çalışma dizininde screenshot.png olarak kaydeder. Bu, özellikle --window-size işaretiyle birlikte kullanıldığında yararlıdır.

Örneğin:

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

--print-to-pdf

--print-to-pdf işareti, hedef sayfayı geçerli çalışma dizininde output.pdf adlı bir PDF olarak kaydeder. Örneğin:

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

İsteğe bağlı olarak, baskı üst bilgisini (mevcut tarih ve saati içeren) ve alt bilgisini (URL ve sayfa numarasını içeren) çıkarmak için --no-pdf-header-footer işaretini ekleyebilirsiniz.

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

Not: --no-pdf-header-footer bayrağının arkasındaki işlev daha önce --print-to-pdf-no-header bayrağıyla kullanılabiliyordu. Önceki bir sürümü kullanıyorsanız eski işaret adı için geri dönmeniz gerekebilir.

--timeout

--timeout işareti, sayfa hâlâ yükleniyor olsa bile sayfanın içeriğinin --dump-dom, --screenshot ve --print-to-pdf tarafından yakalanacağı maksimum bekleme süresini (milisaniye cinsinden) tanımlar.

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

--timeout=5000 işareti, Chrome'a PDF'yi yazdırmadan önce 5 saniye beklemesini söyler. Bu nedenle, bu işlemin yürütülmesi en fazla 5 saniye sürer.

--virtual-time-budget

--virtual-time-budget, zamana bağlı herhangi bir kod (ör. setTimeout/setInterval) için "ileri sarma" işlevi görür. Tarayıcıyı sayfanın kodunun tamamını mümkün olduğunca hızlı bir şekilde yürütmeye zorlarken sayfaya zamanın gerçekten geçtiğini düşündürür.

Kullanımını açıklamak için setTimeout(fn, 1000) kullanarak her saniye bir sayacı artıran, kaydeden ve görüntüleyen bu demoyu inceleyin. İlgili kod aşağıda verilmiştir:

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

Bir saniye sonra sayfa "1", iki saniye sonra "2" ve bu şekilde devam eder. 42 saniye sonra sayfanın durumunu nasıl yakalayacağınız ve PDF olarak nasıl kaydedeceğiniz aşağıda açıklanmıştır:

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

--allow-chrome-scheme-url

chrome:// URL'lerine erişmek için --allow-chrome-scheme-url işareti gereklidir. Bu işaret, Chrome 123'ten itibaren kullanılabilir. Aşağıda bununla ilgili bir örnek verilmiştir:

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

Hata Ayıklama

Chrome, Gözetimsiz modda görünmez olduğundan bir sorunu çözmek zor görünebilir. Gözetimsiz Chrome'da, başlıklı Chrome'a çok benzer bir şekilde hata ayıklamak mümkündür.

Chrome'u --remote-debugging-port komut satırı işaretiyle gözetimsiz modda başlatın.

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

Bu komut, stdout'a benzersiz bir WebSocket URL'si yazdırır. Örneğin:

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

Ardından, başlık içeren bir Chrome örneğinde Chrome Geliştirici Araçları uzaktan hata ayıklama özelliğini kullanarak başlıksız hedefe bağlanabilir ve hedefi inceleyebiliriz.

1. chrome://inspect sayfasına gidin ve Yapılandır... düğmesini tıklayın.
2. WebSocket URL'sindeki IP adresini ve bağlantı noktası numarasını girin.
   • Önceki örnekte 127.0.0.1:60926 değerini girdim.
3. Bitti'yi tıklayın. Tüm sekmelerinin ve diğer hedeflerinin listelendiği bir uzak hedef görürsünüz.
4. Chrome Geliştirici Araçları'na erişmek ve sayfanın canlı görünümü dahil olmak üzere uzaktaki Headless hedefi incelemek için İncele'yi tıklayın.

Geri bildirim

Gözetimsiz mod hakkındaki geri bildiriminizi öğrenmek için sabırsızlanıyoruz. Sorunla karşılaşırsanız hata bildirin.