22

Sto utilizzando lo HTML5 notification API per informare l'utente su Chrome o Firefox. Sui browser desktop, funziona. Tuttavia, in Chrome 42 per Android, l'autorizzazione è richiesta ma la notifica stessa non viene visualizzata.Notifica HTML5 non funzionante in Chrome Mobile

Il codice di richiesta, funziona su tutti i dispositivi:

if ('Notification' in window) { 
    Notification.requestPermission(); 
} 

Il codice di invio, lavora su browser desktop, ma non sul mobile:

if ('Notification' in window) { 
    new Notification('Notify you'); 
} 
+1

Sto avendo l'esatto stesso problema. Ho anche provato 'window.webkitNotification'. * Le notifiche push *, d'altra parte, funzionano ma sono una bestia diversa del tutto: https://developers.google.com/web/updates/2015/03/push-notificatons-on-the-open-web?hl= it (demo https://simple-push-demo.appspot.com/) – BoppreH

risposta

29

provare quanto segue:

navigator.serviceWorker.register('sw.js'); 
Notification.requestPermission(function(result) { 
    if (result === 'granted') { 
    navigator.serviceWorker.ready.then(function(registration) { 
     registration.showNotification('Notification with ServiceWorker'); 
    }); 
    } 
}); 

Questo dovrebbe funzionare su Android sia in Chrome che in Firefox Nightly (ma non ancora in Firefox beta).

(Il file sw.js può essere solo un file di zero byte.)

Un avvertimento è che è necessario eseguire da un origine protetta (un URL https, non un http URL).

https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification ha più informazioni.

https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BygptYClroM ha informazioni sul perché il costruttore Notification non è supportato in Chrome su Android anche se è ancora in desktop Chrome.

+1

Questo funziona, ma crea un servizio di assistenza in background con un proprio ciclo di vita. Vorrei che ci fosse una soluzione più leggera, ma vabbè. Grazie per l'intera risposta. – BoppreH

+3

Per avere una soluzione più leggera (che non richiede ServiceWorker), mi raccomando di dedicare del tempo a sollevare un problema su https://github.com/whatwg/notifications/issues. La gente desidera molto ricevere feedback dagli sviluppatori di siti web reali, e nella mia esperienza risponderanno molto positivamente ai feedback che ottengono. Ma senza che nessuno invii feedback, è molto meno probabile che ci saranno dei cambiamenti. – sideshowbarker

+5

La soluzione proposta non gestirà gli eventi di clic sebbene sia probabilmente lo stesso motivo per cui l'API light non è disponibile in Android. Non vi è alcuna garanzia che la pagina sarà intorno al momento in cui si fa clic sulla notifica (poiché può essere eliminata dal gestore della memoria in qualsiasi momento), pertanto ciò si tradurrebbe in un'API super flaky. –

2

L'esecuzione di questo codice:

if ('Notification' in window) { 
    Notification.requestPermission(); 
} 

Console in Chrome DevTools mostra questo errore:

Uncaught TypeError: Failed to construct ‘Notification’: Illegal constructor. Use ServiceWorkerRegistration.showNotification() instead

Un approccio migliore potrebbe essere:

function isNewNotificationSupported() { 
    if (!window.Notification || !Notification.requestPermission) 
     return false; 
    if (Notification.permission == 'granted') 
     throw new Error('You must only call this \*before\* calling 
Notification.requestPermission(), otherwise this feature detect would bug the 
user with an actual notification!'); 
    try { 
     new Notification(''); 
    } catch (e) { 
     if (e.name == 'TypeError') 
      return false; 
    } 
    return true; 
} 

Funzione sorgente: HTML5Rocks

Problemi correlati