Speichern Sie eine exakte Kopie einer sicheren Webseite in Vektorgrafikform

9

Ich möchte eine exakte Nachbildung einer Webseite in Vektorgrafikform speichern, daher kann ich keine Screenshot-Technik verwenden (da das Bild in einer Rastorgrafikform gespeichert wird).

Ich habe versucht, über Safari, Chrome und Firefox in PDF zu drucken und als PDF zu speichern. Das funktioniert meistens. Das gespeicherte PDF ist jedoch nicht für alle Webseiten eine exakte Kopie. Versuchen Sie beispielsweise, diese Webseite als PDF zu speichern, und beachten Sie, dass die Upvote- / Downvote-Symbole nicht im gespeicherten PDF enthalten sind.

Ich habe auch versucht, mit Safari als WebArchiv zu speichern. Das Problem hierbei ist, dass ich die resultierende Datei zuschneiden muss und nicht weiß, wie ein WebArchiv zugeschnitten werden soll, da die Vorschau es nicht öffnen kann und es einfach in Safari geöffnet wird (zurück zum ersten Feld).

Ich habe auch Webbrowser-Plugins ausprobiert, die eine Ein-Klick-Lösung zum Speichern der Webseite als PDF (Vektorgrafik-Formular) bieten. Dies funktioniert besser (genaue Seite wird gespeichert) und löst das Problem fast, außer dass diese Programme funktionieren, indem die Seiten-URL an ein Cloud-basiertes Programm gesendet wird, um die Seite abzufragen und dann zu speichern. Dies bedeutet, dass diese Technik nicht für https-Sites funktioniert, für deren Anmeldung meine Anmeldeinformationen erforderlich sind.

Also bin ich in einer Ecke. Ich versuche, eine exakte Vektorgrafik-Replik einer Webseite zu speichern, für deren Anzeige meine Anmeldeinformationen erforderlich sind. Wie kann ich das machen?

macos google-chrome vector-graphics Clayton Stanley
quelle
1
Ich denke, Sie sind verwirrt - PDF ist kein Vektorformat.
Kevin Panko
Nicht verwirrt; nur nicht zu viel über die Detail Besorgnis erregend , dass ein pdf ist ein Container, die Vektor-Grafiken Material speichern kann, da ich glaube , der Hauptpunkt in der Frage gefördert wird
Clayton Stanley
Ihre Frage scheint zu lauten: "Wie kann ich eine Webseite als PDF-Datei speichern, genau wie sie auf dem Bildschirm angezeigt wird, und mit einer Seite arbeiten, für deren Anmeldung ein Kennwort erforderlich ist?"
Kevin Panko
Muss nicht pdf sein; Dies ist nur ein Weg, um eine Webseite zu speichern, auf der der Text in Vektorgrafiken vorliegt. Ich muss mich nicht auf dieses Format festlegen. Ich werde den Titel für die zweite Note jedoch sicher hinzufügen, damit dies besser hervorgehoben wird.
Clayton Stanley

Antworten:

6

Beim Drucken der Seite in PDF erhalten Sie andere Ergebnisse als beim Anzeigen der Seite auf dem Bildschirm.

Dies liegt daran, dass die Webseite ein CSS-Stylesheet enthält, das die Seite beim Drucken ändert.

Diese Frage hilft Ihnen, dieses Problem zu vermeiden: Wie drucke ich mit dem Bildschirm-Stylesheet?

Befolgen Sie die dortigen Anweisungen, um die Seite mit dem Stylesheet auf dem Bildschirm zu drucken.

Dann sollten Sie in der Lage sein, als PDF zu drucken und das gleiche Ergebnis zu erhalten, das Sie auf dem Bildschirm sehen.

Kevin Panko
quelle
1
Nur für die vollständige Dokumentation habe ich das Chrome Web Developer-Plugin verwendet und das CSS über dieses Plugin bearbeitet. Ich konnte die Druckseite nach dem Bearbeiten des CSS mit den in Google Chrome integrierten Entwicklertools nicht aktualisieren. Dies ist jedoch höchstwahrscheinlich darauf zurückzuführen, dass ich mit diesem Tool nicht vertraut bin.
Clayton Stanley
4

Wenn Sie keine Angst vor ein wenig Skripten haben, können Sie versuchen, die phantomjs-Anwendung für OSX unter http://phantomjs.org/ zu verwenden.

Dann würden Sie einfach die enthaltene Binärdatei mit dem Skript rasterize.js mit einem Befehl wie dem folgenden ausführen.

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

Ein paar Anmerkungen:

  • Es heißt 'rasterize.js', aber der Text selbst wird als eigentlicher Text in der PDF-Datei gespeichert.

  • Die Authentifizierung an einer sicheren Site mithilfe der Windows-Authentifizierung kann durch Hinzufügen einiger Zeilen zum Skript rasterize.js nach dem Initialisieren des Seitenobjekts erfolgen:

var page = require ('webpage'). create (),
    system = require ('system'),
    Adresse, Ausgabe, Größe;
    page.settings.userName = "serviceUserName"; // Ich habe diese hinzugefügt
    page.settings.password = "servicePassword"; // 2 Zeilen hier

if (system.args.length 5) {
nvuono
quelle
Phantomjs rockt!
Matthew Lock