javascript - theme - progressive web apps tutorial

¿Por qué veo "Error: solo se permiten orígenes seguros" para mi trabajador de servicio?

Question

Cuando intento agregar un trabajador de servicio en la página de mi aplicación web progresiva, ¿por qué la consola del navegador muestra el siguiente error?

ERROR "Uncaught (in promise) DOMException: Only secure origins are allowed

Código JS:

(function () {
    ''use strict'';

    // TODO add service worker code here
    if (''serviceWorker'' in navigator) {
        navigator.serviceWorker
            .register(''service-worker.js'')
            .then(function () {
                console.log(''Service Worker Registered'');
            });
    }
})();

Answer 1

Intente usar http://127.0.0.1:8080 para hospedar localmente en lugar de http://192.168.29.53:8080

Answer 2

Puede verificar el protocolo antes de registrar el trabajador de servicio como este, location.protocol === ''https:'' && serviceWorker.register(''service-worker.js'')

Answer 3

Preguntas frecuentes de Service Worker :

P: Recibo un mensaje de error sobre "Sólo se permiten orígenes seguros". ¿Por qué?

R: Los trabajadores de servicio solo están disponibles para "orígenes seguros" (sitios HTTPS, básicamente) en línea con una política que prefiere orígenes seguros para características nuevas y potentes. Sin embargo, http: // localhost también se considera un origen seguro, por lo que si puede, desarrollar en localhost es una forma fácil de evitar este error.

También puede usar el --unsafely-treat-insecure-origin-as-secure . Este indicador debe combinarse con un --user-data-dir . Por ejemplo:

$ ./chrome --user-data-dir=/tmp/foo --unsafely-treat-insecure-origin-as-secure=http://your.insecure.site

Si desea probar en https: // localhost con un certificado autofirmado, haga:

$ ./chrome --allow-insecure-localhost https://localhost

También puede encontrar útil el indicador --ignore-certificate-errors .