Zrób pełny zrzut ekranu w przeglądarce Firefox w wierszu polecenia

224

Używam Firefoksa na Xvfb na VPS. Chcę zrobić pełny zrzut ekranu strony.

Mogę przekierować Firefoksa na określoną stronę za pomocą

firefox http://google.com

i zrób zrzut ekranu (wewnątrz X) za pomocą ImageMagick

import root -window output.jpg

Problem polega na tym, że większość strony wymaga przewijania i wcześniej nie znam wysokości.

Innym sposobem jest wybranie bardzo dużej wysokości (np. 4000 pikseli), a następnie przetworzenie obrazu i usunięcie niepotrzebnej części. Ale to niepotrzebne przetwarzanie.

Znalazłem wiele dodatków do Firefoksa, ale szukam rozwiązania, które można zaprogramować za pomocą wiersza poleceń Shell.

Edycja: W tym celu napisałem własne rozszerzenie FireFox .

Omar Abid
źródło
1
Widziałem niektóre narzędzia cli do tworzenia zrzutów ekranu, ale nie pamiętam ich nazw.
Rufo El Magufo

Odpowiedzi:

480

Developer Toolbar GCLI i Shift+ F2skrót wyjęto Firefox w wersji 60 . Aby zrobić zrzut ekranu w wersji 60 lub nowszej:

  • naciśnij Ctrl+ Shift+, Kaby otworzyć konsolę programisty ( ⌥ Option+ ⌘ Command+ Kna macOS)
  • wpisz :screenshotlub:screenshot --fullpage

Dowiedz się więcej na temat zrzutów ekranu i innych funkcji


W przypadku wersji Firefox <60:

Naciśnij Shift+ F2lub przejdź do Narzędzia> Web Developer> Pasek narzędzi programisty, aby otworzyć wiersz poleceń. Pisać:

screenshot

i naciśnij Enter , aby zrobić zrzut ekranu.

Aby w pełni odpowiedzieć na pytanie, możesz nawet zapisać całą stronę, a nie tylko jej widoczną część:

screenshot --fullpage

Aby skopiować zrzut ekranu do schowka, użyj --clipboardopcji:

screenshot --clipboard --fullpage

Firefox 18 zmienia sposób przekazywania argumentów do poleceń, musisz dodać przed nimi znak „-”.

Można znaleźć w dokumentacji oraz pełną listę poleceń tutaj .

PS. Zrzuty ekranu są domyślnie zapisywane w katalogu pobrań .

enreas
źródło
4
Jeśli chcesz po prostu skopiować zrzut ekranu do schowka bezpośrednio użyj zrzutu ekranu
schowek
2
To polecenie nie działa w konsoli javascript, więc czy jest link do dodatkowych informacji o tym pasku narzędzi? Co jeszcze można zrobić?
tremby
5
Po prostu do Twojej wiadomości możesz również wybrać notatki DOM za pośrednictwem inspektora, a następnie right-click-> screenshot node. Jest to bardzo pomocne, gdy chcesz wykonać zrzut ekranu sekcji strony.
Tom
5
Zrzut ekranu z całej strony do schowka - screenshot --clipboard --fullpageZrzut ekranu z określonego węzła (według Id) -screenshot --clipboard --selector #elementId
Mohnish
3
Musiałem użyć :screenshot --clipboard --fullpage(
uważaj
134

Aktualizacja 2018-07-23

Jak właśnie wskazano w komentarzach, to pytanie dotyczyło uzyskania zrzutu ekranu z wiersza poleceń . Przepraszam, właśnie to przeczytałem. Oto poprawna odpowiedź:

Począwszy od przeglądarki Firefox 57, możesz utworzyć zrzut ekranu w trybie bezgłowym w następujący sposób:

firefox -screenshot https://developer.mozilla.com

Przeczytaj więcej w dokumentacji .

Aktualizacja 2017-06-15

Począwszy od Firefoksa 55, dostępne są zrzuty ekranu Firefox jako bardziej elastyczna alternatywa. Począwszy od przeglądarki Firefox 57, zrzuty ekranu mogą przechwytywać także całą stronę.

Oryginalna odpowiedź

Od wersji Firefox 32 w narzędziach programistycznych (F12) znajduje się również przycisk zrzutu całej strony . Jeśli nie jest włączony, przejdź do ustawień narzędzi dla programistów (przycisk koła zębatego) i wybierz „Zrób zrzut ekranu na całej stronie” w sekcji „Dostępne przyciski Zestawu narzędzi”.

pasek narzędzi dla programistów źródło: developer.mozilla.org

Domyślnie zrzuty ekranu są zapisywane w katalogu pobierania. Działa to podobnie do screenshot --fullpagepaska narzędzi.

Mouagip
źródło
7
Dla tych, którzy otwierają Firebug na F12, narzędzia programistyczne są dostępne z Ctrl + Shift + K lub Ctrl + Shift + I. Tylko ... na wypadek, gdyby ktoś nigdy ich nie używał.
Kir Kanos,
Te skróty klawiaturowe nie działają na komputerze Mac. Użyj Narzędzia> Web Developer> Przełącz narzędzia. Tak, przycisk zrzutu ekranu jest domyślnie wyłączony. Kliknij ikonę Ustawienia, aby włączyć.
Snowcrash,
na Macu możesz otworzyć narzędzia programistyczne za pomocą cmd+ alt+i
achairapart
Zrzuty ekranu przeglądarki Firefox przesyłają zrzuty ekranu wykonane na serwery Mozilli. Nie uczyniły tego wystarczająco odrażającym, żebym to z góry zauważył. Na szczęście obraz w moim przypadku nie był zbyt wrażliwy, chociaż był wewnętrzny. Być ostrzeżonym.
Hammer Bro.
1
Z pytania: „Znalazłem wiele dodatków do Firefoksa, ale szukam rozwiązania, które można zaprogramować za pomocą wiersza poleceń powłoki”.
Quentin,
9

W końcu napisałem niestandardowe rozwiązanie (rozszerzenie Firefox), które to robi. Myślę, że zanim go opracowałem, nie było tam wiersza poleceń wspomnianego w enreas.

Rozszerzenie Firefox to CmdShots . Jest to dobra opcja, jeśli potrzebujesz dokładniejszej kontroli nad procesem robienia zrzutu ekranu (lub chcesz dokonać modyfikacji HTML / JS i przetwarzania obrazu).

Możesz go używać i nadużywać. Postanowiłem zachować to bez licencji, więc możesz grać z nim tak, jak chcesz.

Omar Abid
źródło
20
Hmm, to nie to, co oznacza „nielicencjonowane”: w rzeczywistości oznacza to, że nie dajesz żadnego zezwolenia na jakiekolwiek użycie, co oczywiście nie jest prawdą, ponieważ w tym samym zdaniu mówisz również, że możesz używać, nadużywać i bawić się nim tak jak chcieć. Może chcesz coś takiego jak CC0 ?
SamB
Dla tych „nielicencjonowanych” rzeczy wolę to: wtfpl.net Wyraźnie określa, co jest dozwolone bez legalnej BS.
kap
@SamB Przypadkowo natknąłem się na twój komentarz. Tak, wiem 3 lata później. Problem polega na tym, że jeśli napiszę licencję, już skomplikowałem sprawę. Podejście NOLICENSE polega po prostu na rzeczy.
Omar Abid
3
Proszę, nie używaj niestandardowej licencji. Wiem, że ludzie starają się unikać prawnych bzdur, pisząc własną licencję, ale w końcu robią coś przeciwnego, powodując prawne bóle głowy, gdy próbują dowiedzieć się, co właściwie oznacza licencja niestandardowa. Zobacz choosealicense.com
Flimm,
@SamB - chociaż „nielicencjonowany” nie jest wyraźnie „oficjalną licencją”, „nielicencjonowany” w rzeczywistości jest licencją i wydaje się być bardzo zbliżony do tego, co OP opisuje jako zamiar użycia swojego kodu. Zobacz: choosealicense.com/licenses/unlicense
Czy Ediger
8

Myślę, że to, czego szukasz, to narzędzie, które umożliwia zapisanie całej strony otwartej w przeglądarce do pliku png. Najprawdopodobniej szukasz narzędzia takiego jak Commandlineprint2 .

Po zainstalowaniu rozszerzenia wystarczy wpisać polecenie:

firefox -print http://google.com -printfile ~/foo.png
Nehal J Wani
źródło
1

Firefox Screenshots to nowe narzędzie dostarczane z przeglądarką Firefox. To nie jest narzędzie programistyczne, jest skierowane do użytkowników końcowych przeglądarki.

Aby zrobić zrzut ekranu, kliknij menu działań strony na pasku adresu i kliknij „zrób zrzut ekranu”. Jeśli następnie klikniesz „Zapisz całą stronę”, zapiszesz całą stronę, przewijając ją.


(źródło: mozilla.net )

Flimm
źródło
3
Z pytania: „Znalazłem wiele dodatków do Firefoksa, ale szukam rozwiązania, które można zaprogramować za pomocą wiersza poleceń powłoki”.
Quentin,
-1

Możesz używać selenu i webdrivera dla Firefoksa.

import selenium.webdriver
import selenium.common

options = selenium.webdriver.firefox.options.Options()
# options.headless = True
with selenium.webdriver.Firefox(options=options) as driver:
    driver.get('http://google.com')
    time.sleep(2)
    root=driver.find_element_by_tag_name('html')
    root.screenshot('whole page screenshot.png')
Gqqnbig
źródło