CODEWITHSUNDEEP
javascripthtmlreactjsfrontendhtml5-notifications
Kishore Devaraj
Kishore Devaraj

Reputation: 156

HTML5 Web Notification Permission Issue

I'm trying to implement HTML5 Notification API in my chat application. When I'm working on my localhost, everything works fine (The browser prompts me whether i need to allow notification from this site or not).

But when i try to access my application running in my local machine from some other machine which all connected in the same network. The browser is not prompting anything.

To Sum up my problem:

http://localhost:3000/home - This works!

http://10.1.0.126:3000/home - This doesn't works this way. (Even if try my from my computer or from other computer)

This is the code I'm using for notification api implementation

function createNotification(response){
  if(!('Notification' in window)){
    console.log("This browser does not Notification")
  }else{
    if(Notification.permission === 'granted'){
         createNotification(response) // function to createNotification from response
    }else if(Notification.permission !== 'denied'){
     Notification.requestPermission((permission) => {
       if(permission === 'granted'){
         createNotification(response)
       }
     })
 }



function createNotification(response){
    // Construct the Notification
    let title = response.sender_name
    let notificationOptions = {
        body: response.message,
        icon: default_profile_pic
    }

    // Close the Notification after 3 seconds
    let notification = new Notification(title, notificationOptions) 
    setTimeout(notification.close.bind(notification),3000)
}

P.S: I'm using ReactJS, Redux for my front-end development.

Upvotes: 0

Views: 540

Answers (1)

Leibale Eidelman
Leibale Eidelman

Reputation: 3184

In Chrome 62 and newer you cannot request notification api at all unless the site is https:// secured. (see issue 779612) If you do have https on the site you should be able to use notifications and background push notifications.

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

Upvotes: 1

Related Questions