HTML5 Web通知權限問題

Question

我正在嘗試在我的聊天應用程序中實現HTML5 Notification API。 當我在本地主機上工作時，一切正常（瀏覽器提示我是否需要允許來自此站點的通知）。

但是，當我嘗試從所有連接在同一網絡中的其他計算機訪問在本地計算機上運行的應用程序時。 瀏覽器未提示任何內容。

總結我的問題：

http：// localhost：3000 / home-可行 ！

http://10.1.0.126:3000/home-這種方式行不通。 （即使從我的計算機或其他計算機嘗試我的計算機）

這是我用於通知api實現的代碼

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)
}

PS：我正在使用ReactJS，Redux進行前端開發。

Answer 1

在Chrome 62及更高版本中，除非該網站受到https：//的保護，否則您根本無法請求通知api。 （請參閱問題779612）如果您的站點上確實有https，則應該可以使用通知和后台推送通知。

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