Уведомление HTML5 не работает в мобильном Chrome
Я использую HTML5 уведомление API для уведомления Пользователя, в Chrome или Firefox. В настольных браузерах он работает. Однако в Chrome 42 для Android, разрешение требуется, но само уведомление не отображается.
код запроса, работает на всех устройствах:
if ('Notification' in window) {
Notification.requestPermission();
}
код отправки, работает на настольном браузере, но не на мобильном телефоне:
if ('Notification' in window) {
new Notification('Notify you');
}
2 ответов
попробуйте следующее:
navigator.serviceWorker.register('sw.js');
Notification.requestPermission(function(result) {
if (result === 'granted') {
navigator.serviceWorker.ready.then(function(registration) {
registration.showNotification('Notification with ServiceWorker');
});
}
});
Это должно работать на Android как в Chrome, так и в Firefox Nightly (но еще не Firefox beta).
(том sw.js
файл может быть просто нулевым байтовым файлом.)
одно предостережение заключается в том, что вы должны запустить его из безопасного источника (an https
URL, а не http
URL-адрес).
https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification has больше информация.
https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BygptYClroM имеет информацию о том, почему Notification
конструктор не поддерживается в Chrome на Android, хотя он все еще находится в настольном Chrome.
запуск этого кода:
if ('Notification' in window) {
Notification.requestPermission();
}
консоль в Chrome DevTools показывает эту ошибку:
Uncaught TypeError: не удалось создать "уведомление": незаконно конструктор. Используйте ServiceWorkerRegistration.showNotification() вместо
лучшим подходом может быть:
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;
}
Функции: HTML5Rocks