Powiadomienia dźwiękowe chatu nie działają jeśli korzysta się z innej karty

Cześć,
mam prosty chat napisany w vue.js, laravel i pusher. Kiedy przychodzi wiadomość pojawia się powiadomienie dźwiękowe.
Ogólnie mój kod działa prawidłowo jednak nie otrzymuje powiadomienia dźwiękowego jeśli aktualnie jest w innej karcie.
Chat mam powiedzmy w zakładce chat.example.org, dostaje wiadomość ale aktualnie jestem na stronie 4programmers, nie otrzymuję powiadomienia dźwiękowego.
Audio otwieram po prostu

this.$refs.audio.load();
this.$refs.audio.play();

w momencie kiedy przychodzi wiadomość

Wydaje mi się, że większość przeglądarek wstrzymuje działanie JavaScriptu w nieaktywnych kartach.

a w jaki sposób można to ominąć?
Pierwsze lepsze powiadomienia np facebook, kiedy przychodzi wiadomość dźwięk jest

To znaczy w poprzednim poście żle napisałem, ale nie bede już edytiwał :P.

Zatrzymywany jest jedynie "główny wątek przeglądarki", ale skrypty zarejestrowane jako np ServiceWorker, lub WebSocket powinny wciąż działać.

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

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

Zapewne można to zrobić w taki sposób, ale w powiadomienia dźwiękowe nigdy się nie bawiłem.

A możesz podać jakiś przykład, jak to powinno wyglądać w użyciu ?

Ktoś? Coś?
Ogólnie jest to dość popularne że js wykonuje się w nieaktywnej karcie chociażby do komunikatu że user zostanie wylogowany itd

ssquad napisał(a):

Ktoś? Coś?
Ogólnie jest to dość popularne że js wykonuje się w nieaktywnej karcie chociażby do komunikatu że user zostanie wylogowany itd

Nikt CI nie będzie gotowca dostarczał. Dostałeś wskazówkę, że powinieneś się zainteresować ServiceWorker-ami. Wpisz w internety how to use service workers js albo konkretniej js service worker play audio i przeczytaj co Ci wyskoczy. Jeśli nie znajdziesz nic przydatnego to zajrzyj do dokumentacji i szukaj pod innymi hasłami.

Nie chcę tworzyć nowego wątku więc dodam tutaj. Chcę dodać powiadomienie kiedy kiedy użytkownik jest w innej karcie. Jeśli natomiast jest w tej samej powiadomienie nie powinno się wyświetlać.
W momencie kiedy otrzymuję nową wiadomość wywyołuję.

Echo.channel('chat_conversation_'+this.user_id)
            .listen('.messages', (payload) => {
                this.$refs.audio.load();
                    this.$refs.audio.play();
                    const title = document.title;
            
              
                    window.onblur = function (ev) {
                        new Notification('Nowa wiadomość', {
                            body: 'Nowa wiadomość'
                        })
                    };
            });

to kod w moim mounted() w vue.js
i tutaj po pierwsze powiadomienia nie ma kiedy ktoś pisze a ja jestem w innej karcie. Po drugie kiedy przejdę do karty chat w później przejdę do innej karty powiadomienie się wyświetli jednak później się to nie resetuje i powiadomienie wyświetla się cały czas kiedy przechodzi się z karty chatu na inną kartę