Service-Worker-Precache-Liste erstellen
Fügen Sie die Pfade der Dateien ein, die Ihre Website offline bereithalten soll, und erhalten Sie eine saubere, geordnete Liste: Aus /assets/./app.js wird /assets/app.js, ein doppeltes Stylesheet fällt weg, und aus den fünf Einträgen im Beispiel werden 4. Kostenlos in Ihrem Browser.
- Kostenlos
- Läuft in Ihrem Browser
- Ohne Anmeldung
- Ihre Daten bleiben auf Ihrem Gerät
Im Browser ausführen – kostenlos
Eine zuverlässige Service-Worker-Installation beginnt mit einer sauberen Liste der Dateien für den Cache. Dieser Generator übernimmt statische Asset-Pfade, wandelt relative Einträge in URLs ab der Stammwurzel um, löst sichere Punktsegmente auf, bewahrt relevante Abfragen und entfernt Duplikate in ihrer ersten Reihenfolge. Das Ergebnis enthält eine für Cache Storage geeignete Precache-Liste sowie Zähler für automatisierte Build-Prüfungen.
Build-Ausgaben in eine installierbare Liste verwandeln
Moderne Web-Builds erzeugen HTML, Stylesheets, JavaScript-Chunks, Schriften, Symbole und Ersatzseiten oft in mehreren Verzeichnissen. Übergeben Sie die statischen Pfade in der gewünschten Abrufreihenfolge. Die Reihenfolge des ersten Auftretens bleibt erhalten und erleichtert Prüfungen sowie Vergleiche zwischen Builds.
Zusätzlich nennt die Antwort die endgültige Asset-Anzahl und die Zahl entfernter Duplikate. Diese Werte helfen in CI: Ein unerwarteter Rückgang kann den Build stoppen, bevor eine unvollständige Offline-Version veröffentlicht wird. Das Werkzeug lädt keine Assets herunter, bildet keine Fingerabdrücke und untersucht keine Inhalte.
Es verarbeitet ausschließlich Pfade aus einem vertrauenswürdigen Build-Prozess.
Vorhersehbare Normalisierung
Unterschiedlich geschriebene Asset-Pfade können dieselbe Datei bezeichnen. So werden <code>assets/app.js</code>, <code>/assets/app.js</code> und <code>/assets/./app.js</code> zu <code>/assets/app.js</code>. Mehrfache Schrägstriche werden zusammengeführt, sichere übergeordnete Segmente aufgelöst, äußere Leerzeichen entfernt und gleiche normalisierte Ergebnisse nach dem ersten Auftreten ausgelassen.
Abfragezeichenfolgen bleiben erhalten, weil <code>/app.js? Vollständige und protokollrelative URLs sind ebenfalls unzulässig, denn diese Funktion ist für statische Dateien derselben Website vorgesehen. Ein Pfad, der über die Stammwurzel hinausführt, erzeugt einen Fehler statt einer stillen Umschreibung.
Dadurch bleibt die Ausgabe deterministisch, ohne Annahmen über Ursprung, Inhalt oder externe Verfügbarkeit.
Verwenden Sie das ausgegebene Array in der Installationsroutine, die Ihren versionierten Cache öffnet und <code>addAll</code> aufruft. Versionieren Sie den Cache-Namen separat, denn der Generator erkennt keine Inhaltsänderung unter einem gleichbleibenden Pfad. Fügt Ihr Bundler Hashes in Dateinamen ein, übernehmen Sie diese Pfade; bei stabilen Namen erhöhen Sie nach Inhaltsänderungen die Cache-Version.
Behandeln Sie die Eingabe als bewusste Positivliste: Nehmen Sie die Anwendungshülle und notwendige Offline-Ressourcen auf, aber keine persönlichen Seiten, authentifizierten Antworten oder unbegrenzten Laufzeit-URLs. Eine große Liste verlängert Downloads und macht Installationen bei schwachen Verbindungen anfälliger. Die Schutzgrenze beträgt 10,000 Einträge, produktive Listen sollten jedoch deutlich kleiner sein.
Löschen Sie bei der Aktivierung alte Cache-Versionen gemäß Ihrer Richtlinie.
Anwendungsfälle
Liste für die Anwendungshülle erzeugen
Normalisieren Sie HTML-, CSS-, JavaScript-, Schrift- und Symbolpfade, die eine progressive Web-App offline zum Start benötigt.
Build-Artefakte in CI prüfen
Wandeln Sie gesammelte Namen in stabile Ausgaben um und prüfen Sie die Zähler vor der Bereitstellung.
Eine manuelle Liste bereinigen
Lösen Sie uneinheitliche relative Pfade auf und entfernen Sie versehentliche Duplikate bei gleicher Installationsreihenfolge.
Häufige Fragen
Was kostet die Nutzung?
Derselbe deterministische Generator lässt sich auf dieser Seite auch in Ihrem Browser ausführen.
Lädt oder überprüft das Werkzeug die Assets?
Nein. Es validiert und normalisiert Pfade ohne Netzwerkanfragen und prüft nicht, ob Dateien existieren.
Warum bleiben Abfragezeichenfolgen erhalten?
Eine Abfrage kann einen anderen Cache-Schlüssel oder eine Version wählen; ihr Entfernen könnte getrennte Ressourcen zusammenführen.
Warum werden externe URLs abgelehnt?
Die Funktion erstellt eine statische Liste derselben Website. Ursprungsübergreifendes Caching erfordert eigene Entscheidungen zu Verfügbarkeit, CORS, Datenschutz und Fehlern.
Warum sollte ich den Cache-Namen getrennt versionieren?
Die Liste betrachtet nur Pfade und kann daher nicht erkennen, wann sich der Inhalt einer Datei bei gleichem Namen ändert. Tragen Ihre Dateinamen einen Inhalts-Fingerabdruck, benennen Sie den Cache nach dem Release; sonst ändern Sie die Cache-Version bei jeder Inhaltsänderung.
Verwandte Tools
Für Entwickler — API-Zugang
Alles auf dieser Seite ist auch per API verfügbar. Dieser Abschnitt richtet sich an Teams, die es in ihre eigenen Systeme einbinden möchten; alle anderen nutzen einfach das Tool oben.
Endpunkt
Authentifizierung per Bearer-Token. Ein einziger POST stellt die Aufgabe in die Warteschlange; das Ergebnis erhalten Sie per Webhook oder über einen signierten Link.
Aufruf aus Ihrem Stack
curl -X POST https://api.kit.forhosting.com/web/service-worker-cache-list-build \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"paths":["/","/assets/app.css","assets/app.js","/icons/icon-192.png"]}'const res = await fetch("https://api.kit.forhosting.com/web/service-worker-cache-list-build", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"paths": [
"/",
"/assets/app.css",
"assets/app.js",
"/icons/icon-192.png"
]
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/web/service-worker-cache-list-build",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"paths": [
"/",
"/assets/app.css",
"assets/app.js",
"/icons/icon-192.png"
]
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/web/service-worker-cache-list-build", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"paths":["/","/assets/app.css","assets/app.js","/icons/icon-192.png"]}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"paths":["/","/assets/app.css","assets/app.js","/icons/icon-192.png"]}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/web/service-worker-cache-list-build", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Beispiel-Anfrage
{
"paths": [
"/",
"/assets/app.css",
"assets/app.js",
"/icons/icon-192.png"
]
}Beispiel-Antwort
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "web.service_worker_cache_list_build",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}Die API arbeitet asynchron: Sie erhalten sofort eine task_id. Polling ist mit 1 Anfrage pro Sekunde erlaubt.
Preis
Der Preis steht auf der Seite – keine Tokens, keine Credits. Fehlgeschlagene Aufgaben werden nicht berechnet.
Limits
timeout_sec | 30 |
max_crawl_pages | 25 |
Fehler
| HTTP | Code | Bedeutung |
|---|---|---|
401 | unauthorized | Der API-Schlüssel fehlt oder ist ungültig – prüfen Sie den Authorization-Header (Bearer). |
402 | insufficient_balance | Ihr Guthaben reicht für diese Aufgabe nicht aus – Aufladungen verfallen nicht. |
404 | unknown_type | Unbekannter Aufgabentyp – prüfen Sie das Feld „type“ gegen den Katalog. |
429 | rate_limited | Zu viele Anfragen – warten Sie kurz; Polling ist mit 1 Anfrage pro Sekunde erlaubt. |
Technische Hinweise
Build-Ausgaben in eine installierbare Liste verwandeln
Diese Namen manuell in einen Service Worker zu kopieren kostet Zeit und führt nach Dateiänderungen schnell zu Abweichungen. Der Generator liefert unter <code>precache_manifest</code> eine Service-Worker-Precache-Liste. Jeder Eintrag ist eine lokale, wurzelrelative URL; deshalb können Sie das Array bei der Installation direkt an <code>cache.addAll(precache_manifest)</code> übergeben.
Vorhersehbare Normalisierung
v=41</code> und <code>/app.js? v=42</code> verschiedene Cache-Schlüssel darstellen können. Fragmente werden abgelehnt: Sie werden nicht in HTTP-Anfragen übertragen und könnten identische Netzwerkressourcen verschieden erscheinen lassen.
Die Liste sicher im Service Worker einsetzen
Das Werkzeug erstellt nur die Liste; es erzeugt keine Ereignisse, wählt keine Strategie, greift nicht auf das Netz zu und verändert keinen Service Worker.
Technische Fragen
Kann ich das Ergebnis direkt an cache.addAll übergeben?
Ja. precache_manifest ist ein Array lokaler URLs und für die addAll-Methode von Cache Storage geeignet.
Was geschieht bei einer leeren Pfadliste?
Die Anfrage endet mit invalid_input, weil eine leere Precache-Liste den Zweck dieser Fähigkeit nicht erfüllt.