Progressive Web App „funktioniert nicht offline“ Fehler

Question

Ich habe eine progressive Web-App geschrieben, nach allen verfügbaren Leitfäden und Beispiele, aber aus irgendeinem Grund, wenn ich Sie auf die Add to homescreen Taste, halte ich diese mysteriöse Fehler bekommen:

Site cannot be installed: does not work offline 

Der Hauptunterschied zwischen meinem PWA und den Beispielen besteht darin, dass meins nur in einem Nicht-Root-Pfad der Domäne läuft, also musste ich den configs an verschiedenen Stellen zusätzliche Pfade hinzufügen, sodass die App auf die beschränkt ist Nicht-root-Ordner.

Die Google Lighthouse Seite hilft auch nicht viel und gibt eine sehr ähnliche Nachricht.

Kann jemand vorschlagen, woran dieser Fehler liegen könnte?

Answer 1

So dauerte es ein paar Stunden, aber ich fand schließlich heraus, dass es einen erforderlichen scope Parameter gibt, den Sie im Client-JavaScript beim Herstellen einer Verbindung zum Servicearbeiter angeben müssen, wenn er nicht auf dem Stamm ausgeführt wird (/) Pfad.

if ('serviceWorker' in navigator) { 
    navigator.serviceWorker.register('sw.js?v2', { 
     scope: '.' // <--- THIS BIT IS REQUIRED 
    }).then(function(registration) { 
     // Registration was successful 
     console.log('ServiceWorker registration successful with scope: ', registration.scope); 
    }, function(err) { 
     // registration failed :(
     console.log('ServiceWorker registration failed: ', err); 
    }); 
} 

Sie können die Arbeits Produkt, das hier sehen:

• App: https://stampy.me/pwgen/
• Manifest-Datei: https://stampy.me/pwgen/manifest.json
• Serviceworker-Datei: https://stampy.me/pwgen/sw.js
• App Skript: https://stampy.me/pwgen/script.js (scrollen nach unten für PWA-Code)

Ich hoffe, dass mein Schmerz jemand anderen Zeit sparen kann.