JavaScript Website offline herunterladen: Warum leer?
JavaScript Website offline herunterladen? Warum Kopien von React-, Vue- und Angular-Seiten leer bleiben, ein 30-Sekunden-Test und was stattdessen hilft.
Website Downloader 10 Min. Lesezeit
Eine Kopie einer React-, Vue- oder Angular-Seite bleibt meist leer, weil der Server nur eine fast leere HTML-Datei schickt. Den Text baut erst der Browser des Besuchers mit JavaScript zusammen. HTTrack, wget und Online-Downloader speichern, was der Server schickt, nicht das, was der Browser daraus macht. Sie speichern also die leere Hülle. Bevor Sie eine JavaScript Website offline herunterladen, öffnen Sie deshalb den Seitenquelltext und suchen Sie nach einem Satz, den Sie auf dem Bildschirm sehen. Steht er dort, kann ein normaler Crawler die Seite kopieren. Steht er nicht dort, brauchen Sie einen der Umwege weiter unten.
Warum zeigt eine heruntergeladene JavaScript-Website nur eine leere Seite?
Eine klassische Website, etwa mit WordPress, den meisten Baukästen oder als handgeschriebene statische Seite, schickt fertiges HTML: Überschriften, Absätze, Bilder und Links stehen in der Datei. Eine clientseitige Single-Page-App (SPA) schickt eher so etwas: ein <div id="root"></div>, ein paar <script src="/assets/main.js">-Tags und kaum mehr. Sobald die Seite geladen ist, fragt das Skript die Inhalte bei einer API ab und fügt sie in die Seite ein.
Speichert ein Crawler eine solche Seite, gehen drei Dinge schief:
- Der Text stand nie in der Datei. Crawler laden Dateien herunter, sie führen die Skripte darin nicht aus. Außer der Hülle gibt es nichts zu speichern.
- Unterseiten bleiben unsichtbar. Menüs von SPAs werden oft per JavaScript erzeugt oder arbeiten mit Klick-Handlern statt mit gewöhnlichen
<a href>-Links. Ohne Links im HTML findet der Crawler nur die Startseite. Deshalb zeigt eine Website-Kopie oft nur eine leere Seite, und zwar nur eine einzige. - Die App versagt offline. Selbst wenn
main.jsmitgespeichert wurde, versucht die Kopie von Ihrer Festplatte aus die Live-API aufzurufen, erwartet, vom Stammverzeichnis der Website ausgeliefert zu werden, oder trifft auf einen Router, der einenfile://-Pfad nicht kennt. Ergebnis: eine weiße Seite oder ein Ladekreisel, der sich endlos dreht.
Das ist ein anderes Problem als eine Kopie, die zwar Text enthält, aber ein zerschossenes Layout hat. Wenn Ihre Seiten Inhalte, aber keine Formatierung und keine Bilder zeigen, lesen Sie stattdessen Heruntergeladene Website ohne Bilder und CSS? Die Lösung.
Wie erkenne ich vor dem Download, ob eine Website eine Single-Page-App ist?
Sie brauchen dafür weder Entwicklerwerkzeuge noch Framework-Kenntnisse. Der Quelltext-Test dauert etwa 30 Sekunden:
- Öffnen Sie die Seite ganz normal und wählen Sie einen markanten Satz aus dem Hauptinhalt. Meiden Sie Menü und Fußzeile, denn die gehören manchmal zur Hülle.
- Öffnen Sie den Seitenquelltext. Drücken Sie
Strg+Uunter Windows, Linux oder auf einem Chromebook. Am Mac drücken Sie in ChromeCmd+Wahltaste+Uoder in FirefoxCmd+U. In Chrome, Edge und Firefox können Sie auchview-source:vor die Adresse schreiben. - Drücken Sie
Strg+F(bzw.Cmd+F) und suchen Sie nach Ihrem Satz.
So lesen Sie das Ergebnis:
- Als normaler Text im HTML gefunden: Der Server liefert die Inhalte aus, und jeder Crawler kann sie kopieren.
- Nicht gefunden, der Quelltext ist kurz, besteht vor allem aus Script-Tags und einem leeren
root- oderapp-Div: Die Seite wird clientseitig gerendert. Ein Crawler speichert nur die Hülle. - Nur in einem langen JSON-Block innerhalb eines
<script>-Tags gefunden: Die Daten werden mitgeliefert, aber erst JavaScript macht daraus eine Seite. Für das Offline-Lesen gilt das als durchgefallen.
Zwei weitere Prüfungen lohnen die zusätzliche Minute. Erstens: Wiederholen Sie den Test auf einer tieferen Seite, etwa einem Blogartikel, einem Produkt oder einem Hilfeartikel, nicht nur auf der Startseite. Viele Websites rendern die Startseite auf dem Server und alles andere im Browser, oder umgekehrt. Zweitens: Suchen Sie im Quelltext nach href=" gefolgt vom Pfad einer Unterseite, von der Sie wissen, dass es sie gibt. Stehen die Menülinks nicht im Quelltext, kann ein Crawler den Rest der Website nicht finden, selbst wenn die erste Seite Text enthält.
Eine Falle: Verwenden Sie nicht Untersuchen oder den Bereich Elemente der Entwicklertools. Dort sehen Sie die Seite nachdem JavaScript gelaufen ist, also wirkt dort jede Website vollständig. Wenn Sie JavaScript für die Website in den Browsereinstellungen deaktivieren und die Seite neu laden, erhalten Sie eine ähnliche Antwort wie mit dem Quelltext: Bleibt sie leer, wird sie clientseitig gerendert.
Clientseitig oder serverseitig gerendert: React, Next.js, Vue, Nuxt und Angular einfach erklärt
Eine Seite kann ihre Inhalte auf drei Arten bekommen:
- Clientseitiges Rendering (CSR): Der Browser baut die Seite nach dem Laden mit JavaScript zusammen.
- Serverseitiges Rendering (SSR): Der Server erzeugt für jede Anfrage fertiges HTML.
- Statische Generierung (SSG): Das HTML wird einmal vorab erzeugt und als Dateien hochgeladen.
Für einen Crawler sehen SSR- und SSG-Seiten genauso aus wie eine altmodische Website, sie lassen sich also gut kopieren. Leere Kopien entstehen nur bei CSR. Der Name des Frameworks gibt einen Hinweis darauf, womit Sie es zu tun haben:
| Framework | Übliche Einrichtung | Was ein Crawler meist erhält |
|---|---|---|
| React (Create React App, Vite) | Clientseitig | Leere Hülle |
| Next.js (basiert auf React) | Serverseitig gerendert oder statisch | Vollständiger Text |
| Vue (Vite, Vue CLI) | Clientseitig | Leere Hülle |
| Nuxt (basiert auf Vue) | Serverseitig gerendert oder statisch | Vollständiger Text |
| Angular | Clientseitig, sofern kein SSR eingerichtet ist | Standardmäßig Hülle |
| SvelteKit | Standardmäßig serverseitig gerendert | Vollständiger Text |
| Gatsby, Astro, Hugo, Eleventy | Statisches HTML | Vollständiger Text |
Die Tabelle sagt aus gutem Grund „meist“. Entwickler können jede dieser Einrichtungen ändern. Eine Next.js-Seite kann ganze Bereiche nur clientseitig laden, und ein Angular-Team kann serverseitiges Rendering ergänzen. Betrachten Sie das Framework als Hinweis und den Quelltext-Test als Antwort. Wenn Sie also eine React-Website herunterladen wollen, lautet die eigentliche Frage nicht „Ist das React?“, sondern „Steht der Text im Quelltext?“
Auch serverseitig gerenderte Seiten laden JavaScript, das die Seite nach dem Eintreffen übernimmt (Entwickler nennen das Hydration). In einer Offline-Kopie versuchen diese Skripte womöglich, frische Daten abzurufen, und scheitern. Der Text, der schon im HTML steht, bleibt normalerweise lesbar; interaktive Elemente reagieren einfach nicht mehr.
JavaScript Website offline herunterladen: Was HTTrack, wget und Online-Tools kopieren können
Weder wget noch HTTrack enthält eine JavaScript-Engine. wget lädt Dateien herunter und folgt den Links, die es in HTML und CSS findet. HTTrack macht dasselbe und durchsucht zusätzlich Skripte nach Zeichenketten, die wie URLs aussehen. Dadurch erwischt es manchmal eine zusätzliche Datei, führt den Code aber nie aus. Es gibt also keine Einstellung, die das Problem der leeren HTTrack-Seite bei JavaScript-Websites behebt. Auch wget kann keine per JavaScript gerenderte Seite erzeugen: --mirror, --page-requisites und --convert-links beheben fehlende Dateien und Links, nicht fehlende Inhalte. Einen Vergleich mit einer Lösung ohne Installation finden Sie in HTTrack Alternative 2026: Website Downloader online ohne Installation.
Online-Downloader rufen Seiten auf dieselbe Weise ab, und Website Downloader ist keine Ausnahme. Bei Websites, die ihre Inhalte vollständig im Browser erzeugen, kann ein Archiv entstehen, das die Seitenhülle enthält, aber nicht die Inhalte. Seiten hinter einem Login werden nicht heruntergeladen. Verweigert eine Website automatisierte Downloads, etwa mit einer 403-Antwort, meldet der Dienst das, statt Ihnen ein leeres Archiv zu liefern.
Hilfreich ist er bei der großen Gruppe von Websites, die den Test bestehen: serverseitig gerenderte Next.js- und Nuxt-Seiten, statische Websites und klassische CMS-Seiten. Geben Sie die Adresse auf der Startseite ein, und der Dienst lädt jede Unterseite mit Bildern, Stylesheets, Skripten, Schriften und Medien in eine einzige ZIP-Datei, die sich offline in jedem Browser öffnen lässt. Er läuft im Browser, Sie müssen also nichts installieren. Der kostenlose Tarif umfasst bis zu 100 Unterseiten ohne Konto. So können Sie an einer echten Kopie prüfen, ob die Inhalte mitgekommen sind, bevor Sie für etwas Größeres bezahlen (siehe Preise). Den vollständigen Ablauf beschreibt Komplette Website mit allen Unterseiten herunterladen – so geht's.
Wie speichere ich eine Seite, nachdem ihr JavaScript fertig geladen hat?
Fällt die Website durch den Test, hilft ein erneutes Crawlen mit anderen Einstellungen nicht. Wählen Sie einen Weg danach, wie viele Seiten Sie brauchen und wofür.
Prüfen Sie zuerst die anderen Bereiche der Website
Ein Blog, ein Dokumentationsbereich oder ein Hilfecenter läuft oft auf einem eigenen System, etwa WordPress, Ghost oder einem statischen Generator, selbst wenn das eigentliche Produkt eine Single-Page-App ist. Machen Sie den Quelltext-Test für jeden Bereich und crawlen Sie die Bereiche, die bestehen. Auch der RSS-Feed eines Blogs kann den vollständigen Text der neuesten Beiträge enthalten.
Einzelne gerenderte Seiten im Browser speichern
Für eine Handvoll Seiten ist Ihr Browser das einfachste Werkzeug, denn er speichert, was er bereits gerendert hat. In Chrome und Edge wählen Sie Seite speichern unter und dann Webseite, vollständig oder Webseite, eine Datei. Firefox bietet eine ähnliche Option. Als PDF speichern über den Druckdialog ist die robusteste Wahl zum Lesen oder als Beleg. Die Browsererweiterung SingleFile speichert die gerenderte Seite als eine einzige, in sich geschlossene HTML-Datei. Ein Vorbehalt: Wenn gespeicherte Skripte beim Öffnen der Datei erneut laufen, können sie den Inhalt wieder löschen. Passiert das, nehmen Sie das PDF oder eine Speicheroption, die Skripte entfernt. Jede Seite wird einzeln gespeichert, und Links zwischen den Seiten verweisen weiterhin auf die Live-Website. Die Schritt-für-Schritt-Anleitungen für Chrome und Firefox erklären die Details. Soll die Kopie als Beweis dienen, lesen Sie Website als Beweis sichern: Anleitung zum Selbermachen.
Einen Headless-Browser für viele Seiten nutzen
Ein Headless-Browser ist ein echter Browser ohne Fenster: Er führt das JavaScript aus und kann Ihnen das Ergebnis übergeben. Chrome kann das über die Kommandozeile: chrome --headless --dump-dom https://example.com/seite > seite.html. Der Programmname hängt vom System ab: google-chrome oder chromium unter Linux, unter Windows und macOS der vollständige Pfad zu Chrome. So erhalten Sie das gerenderte HTML einer Seite, aber Bilder und Links verweisen weiterhin ins Netz.
Für eine ganze Website schreiben Entwickler ein kurzes Puppeteer- oder Playwright-Skript. Es liest die URLs aus der sitemap.xml der Website, öffnet jede davon, wartet, bis keine Netzwerkaktivität mehr läuft, und speichert dann HTML und einen Screenshot. Für originalgetreue Archive zeichnen die Werkzeuge von Webrecorder (ArchiveWeb.page und Browsertrix Crawler) Browsersitzungen als WARC-Dateien auf, die Sie in einem Viewer abspielen, statt sie als einfaches HTML zu öffnen. Die Nachteile sind real: Sie brauchen etwas Programmiererfahrung, reparieren Links und Dateien selbst, es ist langsam, und stark besuchte Websites drosseln Sie unter Umständen.
In der Wayback Machine nachsehen
Das Internet Archive hat die Website vielleicht schon erfasst. Öffnen Sie einen Snapshot und machen Sie damit denselben Quelltext-Test. Steht der Text im archivierten HTML, kann der Wayback Machine Downloader diesen Snapshot in eine ZIP-Datei verwandeln, ohne die Wiedergabe-Leiste und ohne die Links zu archive.org. Bis 100 Seiten ist das kostenlos, bis 5000 Seiten kostet es einmalig 14,99 EUR. Ist auch der Snapshot nur eine Hülle, bringt eine Wiederherstellung die Inhalte nicht zurück. Den ganzen Ablauf beschreibt Website aus der Wayback Machine wiederherstellen – Schritt für Schritt.
Den Betreiber nach dem Quellcode oder einem statischen Export fragen
Gehört die Website Ihnen, einem Kunden oder Ihrem Arbeitgeber, liefert dieser Weg mit Abstand das beste Ergebnis. Ein Entwickler kann aus vielen Frameworks einen vollständig statischen Export erzeugen, zum Beispiel mit output: 'export' in der Next.js-Konfiguration oder mit npx nuxi generate bei Nuxt. Die Inhalte selbst liegen meist in einem CMS oder einer Datenbank mit eigener Exportfunktion. Beachten Sie: Der Build-Ordner einer clientseitigen App ist für sich allein keine Offline-Kopie, denn er ruft seine Inhalte weiterhin über die Live-API ab.
Egal welche Methode Sie nutzen: Kopieren Sie nur, was Sie behalten dürfen. Urheberrecht und Nutzungsbedingungen von Websites unterscheiden sich je nach Land und Situation; einen Überblick gibt Ist es legal, eine Website herunterzuladen?. Wenn Sie die Kopie kommerziell weiterverwenden oder sich in einem Streitfall darauf stützen wollen, fragen Sie einen Anwalt; dieser Artikel ist keine Rechtsberatung.
Was offline trotzdem nicht funktioniert, auch wenn die Inhalte heruntergeladen werden
Wer den Quelltext-Test besteht, bekommt Text, Bilder und Layout, aber nicht den Server dahinter. In jeder Offline-Kopie, egal mit welchem Werkzeug erstellt, gilt:
- Seitensuche, Kontaktformulare, Newsletter-Anmeldungen und Kommentare tun nichts.
- Warenkörbe, Kassen, Logins und Kundenbereiche funktionieren nicht.
- Live-Daten wie Preise, Lagerbestände und Feeds bleiben auf dem Stand des Downloads stehen.
- „Mehr laden“-Buttons, endloses Scrollen, Filter und Sortierung zeigen nur, was im HTML stand.
- Eingebettete Karten, Videos und Social-Media-Widgets anderer Dienste brauchen weiterhin eine Internetverbindung.
Wenn diese Funktionen weiterlaufen sollen, brauchen Sie den Quellcode der Website und einen Server, keine Offline-Kopie. Weitere Fragen dazu, was ein Archiv enthält, beantworten die FAQ.
FAQ: JavaScript-Websites und Offline-Kopien
Warum zeigt meine HTTrack- oder wget-Kopie einer Website eine leere Seite?
Die Website baut ihre Inhalte im Browser mit JavaScript auf, und weder HTTrack noch wget führt JavaScript aus. Gespeichert wurde die HTML-Hülle, die der Server geschickt hat, und die App darin kann ihre Daten nicht von Ihrer Festplatte laden. Machen Sie den Quelltext-Test: Steht Ihr Satz nicht im Quelltext, hilft keine Crawler-Einstellung.
Kann ich eine React-, Vue- oder Angular-Website mit allen Inhalten herunterladen?
Ja, wenn die Seiten auf dem Server gerendert oder als statische Dateien erzeugt werden, was bei Next.js, Nuxt und Angular mit SSR üblich ist. Eine rein clientseitige App lässt sich nicht zu einer funktionierenden Kopie crawlen. Sie können ihre Seiten aber einzeln im Browser speichern, mit einem Headless-Browser erfassen oder einen statischen Export vom Betreiber bekommen.
Lässt sich eine Website mit Next.js oder Nuxt besser herunterladen als eine reine React-App?
Meistens ja. Beide Frameworks schicken normalerweise fertiges HTML, sodass Crawler denselben Text sehen wie Sie. Einzelne Bereiche können trotzdem nur clientseitig geladen werden, testen Sie also ein paar tiefere Seiten, statt sich auf den Framework-Namen zu verlassen.
Lohnt sich ein Headless-Browser, um eine JavaScript-Website zu archivieren?
Für wenige Seiten ist das Speichern im normalen Browser oder als PDF schneller. Für Dutzende oder Hunderte clientseitig gerenderte Seiten ist ein Setup mit Puppeteer, Playwright oder Webrecorder der einzige zuverlässige Weg, rechnen Sie aber mit Zeit für Skripte und das Reparieren von Links. Besteht die Website den Quelltext-Test, lassen Sie den Headless-Browser weg und nehmen Sie einen gewöhnlichen Crawler.
- JavaScript Website offline herunterladen
- JavaScript
- Single-Page-Apps
- HTTrack
- wget