2017-02-16 2 views
0

Есть ли способ воспроизвести аудиофайл у сервисного работника?Воспроизведение звука от обслуживающего персонала

Я пытаюсь использовать io.sound библиотеки, но это плагин JavaScript, который требует окна, поэтому он не работает.

EDIT

Как предложил Джефф Пытаюсь открыть новое окно и отправить сообщение этому окну. это мой код:

function notifyClientToPlaySound() { 
    idbKeyval.get('pageToOpenOnNotification') 
    .then(url => { 

     console.log("notifyClientToPlaySound", url); 

     clients.matchAll({ 
      type: "window" 
      //includeUncontrolled: true 
     }) 
     .then((windowClients) => { 

      console.log("notifyClientToPlaySound - windowClients", windowClients); 
      for (var i = 0; i < windowClients.length; i++) { 
       var client = windowClients[i]; 
       if (client.url === url && "focus" in client) { 
        notify({ event: "push" }); 
        return client.focus(); 
       } 
      } 

      //https://developer.mozilla.org/en-US/docs/Web/API/Clients/openWindow 
      if (clients.openWindow) { 
       return clients.openWindow("/") 
        .then(() => { 
         notify({ event: "push" }); 
        }); 
      } 
     }) 
    }); 
} 

Эта функция теперь называется от event.waitUntil (..) внутри self.addEventListener ("толчок", (событие) => {...}

self.addEventListener("push", (event) => { 
    console.log("[serviceWorker] Push message received", event); 

    event.waitUntil(
     idbKeyval.get('fetchNotificationDataUrl') 
     .then(url => { 
      console.log("[serviceWorker] Fetching notification data from -> " + url); 

      return fetch(url, { 
       credentials: "include" 
      }); 
     }) 
     .then(response => { 
      if (response.status !== 200) { 
       // Either show a message to the user explaining the error 
       // or enter a generic message and handle the 
       // onnotificationclick event to direct the user to a web page 
       console.log("[serviceWorker] Looks like there was a problem. Status Code: " + response.status); 
       throw new Error(); 
      } 

      // Examine the text in the response 
      return response.json(); 
     }) 
     .then(data => { 
      if (!data) { 
       console.error("[serviceWorker] The API returned no data. Showing default notification", data); 
       //throw new Error(); 
       showDefaultNotification({ url: "/" }); 
      } 

      notifyClientToPlaySound(); <------ HERE 

      var title = data.Title; 
      var message = data.Message; 
      var icon = data.Icon; 
      var tag = data.Tag; 
      var url = data.Url; 

      return self.registration.showNotification(title, { 
       body: message, 
       icon: icon, 
       tag: tag, 
       data: { 
        url: url 
       }, 
       requireInteraction: true 
      }); 
     }) 
     .catch(error => { 
      console.error("[serviceWorker] Unable to retrieve data", error); 

      var title = "An error occurred"; 
      var message = "We were unable to get the information for this push message"; 
      var icon = "/favicon.ico"; 
      var tag = "notification-error"; 
      return self.registration.showNotification(title, { 
       body: message, 
       icon: icon, 
       tag: tag, 
       data: { 
        url: "/" 
       }, 
       requireInteraction: true 
      }); 
     }) 
    ); 
}); 

Но когда clients.openWindow называется, она возвращает следующее исключение:

Uncau ght (в обещании) DOMException: не разрешено открывать окно.

Как я могу это решить?

+0

Извинения; Я обновил свой ответ соответственно. –

ответ

2

Живые спецификации API веб-уведомлений ссылаются на sound property, которые могут быть указаны при показе уведомления, и теоретически позволят вам воспроизводить выбранный вами звук при показе уведомления от сервисного работника.

Однако, хотя спецификация ссылается на это свойство, на момент написания этой статьи it's not supported in any browsers.

Ваш лучший выбор: post a message и открытое окно, которое контролируется текущим работником службы, а окно воспроизводит звук в ответ на событие message.

Если нет под контролем клиента доступны (например, потому что ваш работник службы был разбужен push событием, и ваш сайт не в настоящее время открыт в браузере), то вы имеете возможность opening a new window внутри обработчика notificationclick , который запускается в ответ на щелчок пользователем уведомления, отображаемого в вашем обработчике событий push. Затем вы можете отправить сообщение в это новое окно.

+0

К сожалению, я не могу открыть новое окно из-за «Нечистого (в обещании) DOMException: Не разрешено открывать окно». Я обновил свой вопрос с помощью кода – Androidian

+1

@ Androidian, вы не можете открыть окно в ответ на событие push - вам нужно будет показать уведомление, затем прослушать событие notificationclick и открыть окно. – Alastair

+0

Хорошо, я отредактирую свой ответ, чтобы это было ясно. –

Смежные вопросы