Zapisz dokładną kopię bezpiecznej strony internetowej w formie grafiki wektorowej

Chciałbym zapisać dokładną replikę strony internetowej w formie grafiki wektorowej, więc nie mogę użyć techniki zrzutu ekranu (ponieważ przechowuje obraz w formie grafiki rastorowej).

Próbowałem „wydrukować do pdf” i „zapisać jako pdf” za pomocą Safari, Chrome i Firefox. Działa to przez większość czasu. Zapisany plik pdf nie jest jednak dokładną repliką dla wszystkich stron internetowych. Na przykład spróbuj zapisać tę stronę jako plik pdf i zwróć uwagę, że ikony upvote / downvote nie są zawarte w zapisanym pliku pdf.

Próbowałem również zapisać jako archiwum internetowe w Safari. Problem polega na tym, że muszę przyciąć wynikowy plik i nie wiem, jak przyciąć archiwum WWW, ponieważ Preview nie może go otworzyć, a po prostu otwiera się w Safari (z powrotem do kwadratu).

Próbowałem również wtyczek do przeglądarek internetowych, które zapewniają rozwiązanie jednym kliknięciem, aby zapisać stronę internetową jako pdf (formularz grafiki wektorowej). Działa to lepiej (zapisana jest dokładna strona) i prawie rozwiązuje problem, z wyjątkiem tego, że programy te działają, wysyłając adres strony do programu w chmurze w celu zapytania, a następnie zapisania strony. Oznacza to, że ta technika nie będzie działać w przypadku witryn https, które wymagają moich danych logowania do logowania.

Więc jestem w kącie. Usiłuję zapisać dokładną replikę grafiki wektorowej strony internetowej, która wymaga podania danych logowania. W jaki sposób mogę to zrobić?

macos google-chrome vector-graphics

— Clayton Stanley
źródło

Myślę, że jesteś zdezorientowany - PDF nie jest formatem wektorowym.

— Kevin Panko

Nie mylić; po prostu nie przejmuję się zbytnio szczegółami, że pdf jest kontenerem, w którym można przechowywać rzeczy z grafiką wektorową, ponieważ myślę, że główny punkt pytania jest przekazywany

— Clayton Stanley

Twoje pytanie brzmi: „Jak zapisać stronę internetową jako plik PDF, dokładnie tak, jak pokazuje na ekranie i działa ze stroną wymagającą hasła do zalogowania?”

— Kevin Panko

Nie musi być pdf; to tylko jedna droga do zapisania strony internetowej, na której tekst jest w formie grafiki wektorowej. Nie muszę się zgadzać na ten format. Dodam jednak bezpieczne do tytułu drugiej nuty, aby lepiej to podkreślić.

— Clayton Stanley

Odpowiedzi:

Otrzymujesz inne wyniki drukowania strony do formatu PDF, niż widzisz podczas przeglądania strony na ekranie.

Dzieje się tak, ponieważ strona internetowa zawiera arkusz stylów CSS, który zmienia stronę podczas drukowania.

To pytanie pomoże ci uniknąć tego problemu: Jak wydrukować za pomocą arkusza stylów ekranu?

Postępuj zgodnie z instrukcjami tam, aby wydrukować stronę z arkuszem stylów na ekranie.

Następnie powinieneś być w stanie wydrukować do pliku PDF i uzyskać taki sam efekt, jak widzisz na ekranie.

— Kevin Panko
źródło

Aby uzyskać pełną dokumentację, skorzystałem z wtyczki Chrome Web Developer i edytowałem css za pośrednictwem tej wtyczki. Nie mogłem zaktualizować strony wydruku po edycji css za pomocą wbudowanych narzędzi programistycznych Google Chrome, ale jest to najprawdopodobniej dlatego, że nie znam tego narzędzia.

— Clayton Stanley

Jeśli nie boisz się małego skryptu, możesz spróbować użyć aplikacji phantomjs dla OSX z http://phantomjs.org/

Następnie wystarczy uruchomić dołączony plik binarny za pomocą skryptu rasterize.js za pomocą polecenia:

phantomjs.exe rasterize.js http://www.example.com/sitepage 8.5in*11in outfile.pdf

Kilka notatek:

Nazywa się to „rasterize.js”, ale sam tekst jest zapisywany w pliku PDF jako rzeczywisty tekst.
Uwierzytelnianie w bezpiecznej witrynie przy użyciu uwierzytelniania systemu Windows można osiągnąć, dodając kilka wierszy do skryptu rasterize.js po zainicjowaniu obiektu strony:

var page = wymagany („strona internetowa”). create (),
    system = wymagany („system”),
    adres, wyjście, rozmiar;
    page.settings.userName = "serviceUserName"; // Dodałem je
    page.settings.password = "servicePassword"; // 2 linie tutaj

if (system.args.length 5) {

— nvuono
źródło

skały phantomjs!

— Matthew Lock