why javascript notification not showing?

Question

I am using below example.it show show me chrome notification default.but when I click on button it doesn't show show me notification why ?

https://developer.mozilla.org/en-US/docs/Web/API/notification

I am using 83 v chrome and mac

I used two example first one is simple and second one to get permission then show .both are not working

here is my code

https://codesandbox.io/s/nostalgic-tdd-9kto3?file=/src/App.js:249-1123

<button
        onClick={() => {
          var notification = new Notification("Hi there!");

          // another example

          // if (!("Notification" in window)) {
          //   alert("This browser does not support desktop notification");
          // }

          // // Let's check whether notification permissions have already been granted
          // else if (Notification.permission === "granted") {
          //   // If it's okay let's create a notification
          //   var notification = new Notification("Hi there!");
          // }

          // // Otherwise, we need to ask the user for permission
          // else if (Notification.permission !== "denied") {
          //   Notification.requestPermission().then(function(permission) {
          //     // If the user accepts, let's create a notification
          //     if (permission === "granted") {
          //       var notification = new Notification("Hi there!");
          //     }
          //   });
          // }
        }}
      >
        notify
      </button>

Hi I'm guessing there should be way more code in there such as user-permission and more. please see links https://developers.google.com/web/fundamentals/codelabs/push-notifications/ | https://stackoverflow.com/questions/33687298/how-to-send-push-notification-to-web-browser | — halilcakar, Jun 27 '20 at 00:10
@HalilÇakar we can also show notification without web notification it is native javascript — user944513, Jun 27 '20 at 00:20
I know it is but as far as know it still needs a permission process right? — halilcakar, Jun 27 '20 at 00:21

CygnusOlor · Answer 1 · 2020-06-27T00:51:28.337

1

This is a permission issue - your test code is running inside an <iframe> which is not allowed - same applies to non-https environments, mentioned here:

https://developer.mozilla.org/en-US/docs/Web/API/notification

add a console.log to the requestPermission promise:

Notification.requestPermission().then(function (permission) {
            console.log(permission)
});

will log denied

edited Jun 27 '20 at 00:51

answered Jun 27 '20 at 00:24

CygnusOlor

94
4

but chrome default notification not coming – user944513 Jun 27 '20 at 00:28
you are correct ..!! but on local there should be a default notification come after using this `var notification = new Notification("Hi there!"); ` – user944513 Jun 27 '20 at 00:30
see this video https://www.youtube.com/watch?v=OMXtJ0USM8s – user944513 Jun 27 '20 at 00:33
using these two line will show notification .but in my chrome it is not showing ` Notification.requestPermission(); new Notification("Hi there!") ` – user944513 Jun 27 '20 at 00:34
`Notification.requestPermission(); new Notification("Hi there!")` will never work btw - requestPermission() is promise based. – CygnusOlor Jun 30 '20 at 16:12

score 1 · Answer 2 · answered Nov 03 '22 at 06:35

1

Make sure your system has allowed notifications, in MacOS need to enable notifications from system preferences. using following steps

for MacOS

system preferences -> Notifications & Focus -> Click on Browser from list -> Allow Notification.

answered Nov 03 '22 at 06:35

Kaushik Makwana

2,422
9
31
50

why javascript notification not showing?

2 Answers2