Воспроизведение звука при повторной визуализации компонента и при начальной визуализации - React.js - PullRequest
0 голосов
/ 04 ноября 2019

Я создаю интерактивное приложение, в котором пользователи могут «пинговать» друг друга по своему выбору.

при каждом так называемом «пинге». Я издаю звук уведомления, чтобы пользователь знал, что у него естьновое сообщение.

У меня есть компонент под названием BellNotifcation:

import soundFile from "../../assets/sharp.mp3";

const BellNotification = ({
  askingUserDisplayNameArray,
  openInvitationModal
}) => {

  useEffect(() => {
    const audio = new Audio(soundFile);

    const audioPromise = audio.play();

    if (audioPromise !== undefined) {
      audioPromise
        .then(_ => {
          console.log("played");
        })
        .catch(err => {
          console.info(err);
        });
    }
  }, [askingUserDisplayNameArray]);

В настоящее время у меня есть 2 проблемы в разных браузерах:

1. На Firefox и ChromeПользователь должен сначала взаимодействовать с браузером (щелкнуть), и если нет, я получаю эту ошибку:

The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission

после поиска в Интернете и при попытке использования различных решений ничего не работает,есть ли «хак» для этой проблемы?

2.on safari Я всегда получаю сообщение об ошибке выше (при каждом «пинге»), независимо от того, взаимодействовал пользователь с браузером или нет.

...