Javascript HTML5通知在移动Chrome中不起作用

我在使用Chrome或Firefox通知用户。在桌面浏览器上，它可以工作。然而，在Chrome 42 for Android中，会请求权限，但不会显示通知本身

请求代码适用于所有设备：

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

发送代码在桌面浏览器上有效，但在移动设备上无效：

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

请尝试以下操作：

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

这应该在Chrome和Firefox中的Android上都适用（在Safari的iOS上也适用）

（sw.js文件只能是一个零字节文件。）

一个警告是，您必须从安全的来源（一个

https

URL，而不是

http

URL）运行它

请参阅。

运行此代码：

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

Chrome DevTools中的控制台显示此错误：

未捕获的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;  
}

---

函数源：

我对Windows桌面上的通知API没有任何问题。它甚至可以在移动FF上正常工作。我发现一些文档似乎表明Chrome for Android也得到了支持，但对我来说不起作用。我真的很想证明API可以在我目前（2019年）的Android版Chrome（70）上运行。经过大量调查，我很容易明白为什么很多人的结果参差不齐。当我把上面的答案粘贴到一个简单的页面上时，它根本不适合我，但我发现了原因。根据Chrome调试器，只允许在响应用户手势时使用通知API。这意味着您不能在加载文档时简单地调用通知。相反，您必须调用代码来响应用户的交互，就像单击一样

因此，这里有一个简单而完整的解决方案，证明您可以在当前（2019年）的Android Chrome上获得通知（注意：我使用jQuery只是为了简洁）：

$（函数（）
{
navigator.serviceWorker.register（'sw.js'）；
$（“#mynotify”）。单击（函数（）
{
Notification.requestPermission（）.then（函数（权限）
{
如果（权限！=“已授予”）
{
警报（“通知失败！”）；
返回；
}
navigator.serviceWorker.ready.then（函数（注册）
{
registration.showNotification（“你好，世界”{body:“这里是body！”}）；
} );
} );
} );
} );

总之，关于当前（2019年）Android版Chrome上的通知，需要了解的重要事项如下：

必须使用HTTPS

必须使用通知API来响应用户交互

必须使用通知API请求通知权限

必须使用ServiceWorker API触发实际通知

---

如果您已经注册了服务人员，请使用以下方法：

navigator.serviceWorker.getRegistrations().then(function(registrations) {
  registrations[0].showNotification(title, options);
});

---

我也有同样的问题。还尝试了

window.webkitNotification

。另一方面，推送通知可以工作，但完全不同：（演示）这可以工作，但会创建一个具有自己生命周期的后台ServiceWorker。我希望有一个更轻量级的解决方案，但哦，好吧。感谢您完整的回答。关于更轻量级的解决方案（不需要ServiceWorker），我建议您花点时间在下面的会议上提出一个问题。人们非常希望从现实世界的web开发人员那里得到反馈，根据我的经验，他们会对得到的反馈做出高度响应。但是如果没有任何人发送反馈，就不太可能有任何改变。提议的解决方案将不会处理点击事件，尽管这可能与light API在Android中不可用的原因相同。无法保证在单击通知时该页面会出现（因为内存管理器随时都可能将其删除），因此这将导致一个超级脆弱的API。您好，我一直收到以下错误消息：“失败：连接建立中的错误：net:：ERR_SSL_PROTOCOL_error”套接字对象的创建显示为错误源[websocket=new websocket（“wss://www2.demo.domainname.com:45786/directory/socket.php");] . 45786是我在非ssl版本中使用的端口号，它工作正常。用443替换它，或者干脆把它取下来，也没什么用。您对修复有什么建议吗？我可以从哪里获得

sw.js

文件？太糟糕了，在不显示弹出窗口的情况下，似乎无法测试新通知。是否有方法与服务人员检查现有权限？类似于

if（Notification.permission==“grated”）{…}

？实际上，您使用通知API来检查现有的权限，就像您描述的那样。Chrome for Android的独特之处在于通知API目前无法创建实际的通知。但检查权限和请求权限确实有效。一旦您获得了权限，您就可以使用ServiceWorker API实际导致显示通知。对我来说不起作用@Ben用

注册[0]

的回答有效。我在Ubuntu桌面上的Chrome浏览器和Android上都不起作用。

navigator.serviceWorker.getRegistrations().then(function(registrations) {
  registrations[0].showNotification(title, options);
});