我有这段代码,可以通过一个蔚蓝的http静态站点将Web通知发送到当前页面。
但是我希望通知也可以与智能手机上的移动浏览器一起使用。似乎在那里不工作。是否有任何解决方案或替代方法可以在智能手机浏览器上模拟通知。我想制作一个软件原型,用于接收有关智能音符的通知。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3pro.css">
<script>
function ask_for_permission() {
navigator.serviceWorker.register('sw.js');
Notification.requestPermission(function (result) {
if (result === 'granted') {
navigator.serviceWorker.ready.then(function (registration) {
registration.showNotification('Notification with ServiceWorker');
});
}
});
}
function send() {
Notification.requestPermission(function (result) {
if (result === 'granted') {
navigator.serviceWorker.ready.then(function (registration) {
var ntitle = document.getElementById('title').value;
var nbody = document.getElementById('body').value;
registration.showNotification(ntitle, {
body: nbody
});
});
}
});
}
</script>
</head>
<body onload="init()">
<style> body{
background-image: url("background2.jpg");
}
</style>
<div class="w3-container w3-card">
<h1>Phone App</h1>
<button id="ask_permission" onclick="ask_for_permission()">Aktivieren</button>
<div>
Titel:
<input id="title" value="Neue Benachrichtigung" /><br />
Inhalt:
<input id="body" value="Ich bin eine Webnotification!" /><br />
<button onclick="send()">Senden</button>
</div>
</div>
</body>
</html>