So erstellen Sie Screenshots von Webseiten über die Befehlszeile

Es gibt viele Situationen, in denen Sie vielleicht Screenshots einer Webseite machen möchten. Sicher, es gibt Browsererweiterungen, die diese Aufgabe übernehmen, aber wenn Sie Screenshots von vielen Websites machen müssen, um sie zu archivieren oder sie als Teil eines automatisierten Prozesses zu generieren, dann brauchen Sie ein Befehlszeilentool. Hier sind vier Tools, die Screenshots von Webseiten über die Befehlszeile erstellen.

pageres-cli

Obwohl dies nicht so beliebt ist wie einige der anderen, bekannteren Tools, ist pageres-cli bei weitem das beste Tool zum Aufnehmen von Screenshots. Basierend auf PhantomJS und in Node.js geschrieben, gibt es selbst die komplexesten Webseiten genau wieder.

Um pageres-cli zu installieren, müssen Sie zuerst Node.js und NPM installieren. Öffnen Sie dann ein Terminalfenster und installieren Sie es wie folgt:

sudo npm install -g pageres-cli

Nach der Installation ist das Erstellen von Screenshots ein Kinderspiel:

pageres google.com

Dadurch erhalten Sie einen Screenshot in Ihrem aktuellen Arbeitsverzeichnis mit dem Namen google.com-1366x768.png was, wie Sie sehen können, eine Auflösung von 1366 × 768 und das PNG-Format hat.

Sie können Ihren eigenen Dateinamen, Format und Auflösung angeben. Betrachten Sie den folgenden Befehl:

pageres google.com yahoo.com 1280x800 --format=jpg --filename="Pictures/<%= date %>_<%= url %>"

Dies ist ein langer Befehl, also lassen Sie ihn uns für Sie aufschlüsseln:

• google.com und yahoo.com sind die URLs, deren Screenshots generiert werden.
• 1280x800 gibt die Bildschirmgröße an, in der der Screenshot gerendert wird.
• --format gibt das zu verwendende Format an. In diesem Fall haben wir das JPG-Format verwendet.
• --filename Gibt das Verzeichnis an, in dem die Screenshots gespeichert werden, und das Format, in dem die Dateien benannt werden. In unserem Fall haben wir festgelegt, dass Sie in das Verzeichnis „Bilder“ gehen sollten und dass die Dateinamen das Datum gefolgt von einem Unterstrich enthalten sollten (_ ) und weiter gefolgt von der URL.

Sie können sogar unterschiedliche Einstellungen für verschiedene Websites vornehmen!

pageres [google.com 1280x800] [yahoo.com 800x600]

Schließlich werden Sie möglicherweise feststellen, dass einige Websites Ihnen „Lite“- oder „Mobile“-Versionen von Webseiten anbieten, während Sie dieses Tool verwenden. Sie können den User-Agent-String ganz einfach so ändern, dass er einem modernen Browser ähnelt:

pageres echo.opera.com --user-agent='Mozilla/5.0 (X11; Linux x86_64; rv:50.0) Gecko/20100101 Firefox/50.0'

Eine Vielzahl anderer Optionen ist verfügbar; schauen Sie sich die Homepage des Projekts an.

Feuerfuchs

Firefox 57 und neuere Versionen haben einen Befehlszeilen-Screenshot-Modus. Genau wie pageres-cli erfasst Firefox Webseiten genau, hat aber nicht so viele Funktionen. Dieser Modus verwendet keine grafische Umgebung, weshalb er sich gut für den Einsatz auf Servern eignet.

Gehen Sie wie folgt vor, um mit Firefox einen Screenshot zu erstellen:

firefox -screenshot google.png google.com

Dadurch wird ein ganzseitiger Screenshot der Datei erstellt. erstellt google.com in die Datei google.png . Firefox unterstützt derzeit keine Screenshots in anderen Formaten. Wenn Sie eine andere Nebenstelle verwenden, z. B. google.jpg , wird eine PNG-Datei mit diesem Namen erstellt.

Um einen Screenshot in begrenzter Größe zu erstellen, verwenden Sie den --window-size Parameter. Wenn Sie beispielsweise einen Screenshot mit einer Größe von 1366 × 768 erstellen möchten, gehen Sie wie folgt vor:

firefox -screenshot google.png google.com --window-size=1366,768

Auch in Firefox installierte Add-Ons wirken sich auf die Ausgabe aus; was in vielen Fällen recht praktisch ist. Wenn Sie beispielsweise eine Werbeblocker-Erweiterung installieren, entfernt diese auch Werbung in den Screenshots.

Cutycapt

Obwohl pageres-cli und Firefox großartig sind, sind sie nicht jedermanns Sache. Glücklicherweise gibt es andere Tools wie Cutycapt. Es verwendet die QtWebkit-Bibliothek zum Rendern von Webseiten.

Sie können es mit Ubuntu und Debian sudo apt install cutycapt installieren; auf anderen Systemen können Sie es aus dem Quellcode kompilieren, wie auf deren Homepage beschrieben.

Sie können einen Screenshot mit cutycapt wie folgt machen:

cutycapt --url=google.com --out=google.png

cutycapt versucht, das Format der Ausgabedatei anhand des Dateinamens zu erkennen. Zu den unterstützten Formaten gehören JPG, GIF, SVG und PNG.

Standardmäßig erzeugt Cutycapt Screenshots mit einer Breite von 800 × 600. Sie können die Höhe und Breite des Screenshots wie folgt steuern:

cutycapt --url=google.com --out=google.png --min-width=1366 --min-height=768

Dadurch erhalten Sie einen Screenshot mit der Auflösung 1366 × 768.

Werfen Sie einen Blick auf die Manpage, indem Sie man cutycapt eingeben auf dem Terminal, um eine Liste mit Optionen anzuzeigen.

Wenn Sie Probleme mit Websites haben, die „Lite“- oder „Mobile“-Versionen anbieten, geben Sie einen User-Agent-String ähnlich einem modernen Browser ein:

cutycapt --url=... --out=... --user-agent='Mozilla/5.0 (X11; Linux x86_64; rv:50.0) Gecko/20100101 Firefox/50.0'

Wenn Sie jedoch versuchen, cutycapt auf einer Maschine auszuführen, auf der kein X-Server läuft (wie bei den meisten Servern), schlägt dies fehl. Sie sollten xvfb verwenden um es auszuführen:

xvfb-run --server-args="-screen 0, 1024x768x24" cutycapt --url=... --out=...

Im obigen Befehl ist der --server-args Parameter erstellt einfach einen virtuellen Bildschirmpuffer der Größe 1024 × 768 mit einer Farbtiefe von 24 Bit. Dies wirkt sich nicht auf den Screenshot aus.

wkhtmltoimage

wkhtmltoimage, das Teil von wkhtmltopdf ist, ist ein weiteres Tool zum Generieren von Screenshots. Sein Funktionsumfang ist auf die schnelle, automatisierte Generierung von Screenshots ausgerichtet; obwohl es nicht am besten ist, wenn Sie Details wünschen.

Es sollte in den Repositories Ihrer Distribution verfügbar sein. Unter Debian / Ubuntu bekommt man es mit sudo apt install wkhtmltopdf . Wenn es in Ihrer Distribution nicht verfügbar ist, können Sie immer die vorkompilierten Binärdateien verwenden oder es aus dem Quellcode kompilieren.

Ein Wort der Vorsicht:Wenn Sie wkhtmltoimage in einer Umgebung ohne X-Server ausführen möchten, sollten Sie sich die vorkompilierte Binärdatei besorgen – die in den Standard-Repositories unterstützen die Ausführung oft nicht ohne.

Um die vorkompilierten Binärdateien zu installieren, laden Sie das neueste Archiv für Ihr System herunter und gehen Sie wie folgt vor:

sudo tar -xf wkhtmltox-*.tar.xz -C /opt
sudo mkdir -p /usr/local/lib /usr/local/share/man/man1
sudo ln -s /opt/wkhtmltox/bin/wkhtmltoimage /usr/local/lib
sudo ln -s /opt/wkhtmltox/bin/wkhtmltopdf /usr/local/lib
sudo ln -s /opt/wkhtmltox/share/man/man1/wkhtmltoimage.1.gz /usr/local/share/man/man1
sudo ln -s /opt/wkhtmltox/share/man/man1/wkhtmltopdf.1.gz /usr/local/share/man/man1

Sie können Screenshots von Webseiten machen, indem Sie Folgendes tun:

wkhtmltoimage google.com google.jpg

Die Generierung von JPG- und PNG-Screenshots wird unterstützt. Allerdings ist die Größe der erzeugten JPG-Dateien enorm

Sie können eine benutzerdefinierte Breite und Höhe festlegen, indem Sie Folgendes angeben:

wkhtmltoimage --height 1200 --width 800 google.com google.png

In bestimmten Fällen kann der Screenshot breiter sein als angegeben. Sie können dies beheben, indem Sie den --disable-smart-width hinzufügen Flagge.

Leider gibt es keine zuverlässige Möglichkeit, die Zeichenfolge des Benutzeragenten zu ändern. Insbesondere können Sie den User-Agent verwenden HTTP-Header, aber Sie können ihn nicht ändern navigator.userAgent Wert durch JavaScript (JS). Davon abgesehen ist das Fälschen des HTTP-Headers für viele Anwendungsfälle alles, was Sie brauchen. Das geht mit:

wkhtmltoimage --custom-header-propagation --custom-header User-Agent 'Mozilla/5.0 (X11; Linux x86_64; rv:50.0) Gecko/20100101 Firefox/50.0' google.com google.jpg

die --custom-header-propagation Switch stellt sicher, dass der benutzerdefinierte User-Agent HTTP-Header, um alle Ressourcen wie Bilder, JS-Dateien und Inline-Frame-Inhalte abzurufen.

Manchmal möchten Sie beim Erstellen automatischer Screenshots sehen, wie die Seite ohne das JS aussieht. Sie können dies tun, indem Sie den --disable-javascript verwenden Zähler:

wkhtmltoimage --disable-javascript google.com google.jpg

Wenn Sie viele Screenshots machen müssen, möchten Sie vielleicht die Dinge beschleunigen, indem Sie die Zeit verkürzen, die für die Ausführung von JS benötigt wird. Die Standardzeit beträgt 200 Millisekunden (ms), Sie können sie jedoch verringern oder erhöhen. Wenn Sie beispielsweise 45 ms für die Ausführung von JS zulassen möchten, verwenden Sie:

wkhtmltoimage --javascript-delay 45 google.com google.jpg

Um alle verfügbaren Optionen anzuzeigen, führen Sie wkhtmltoimage --extended-help aus .

Diplom

In diesem Artikel haben wir gesehen, wie man Screenshots von Webseiten mit einer Vielzahl von Tools macht – einige sind auf Genauigkeit und andere auf Geschwindigkeit ausgelegt.