Pracuję nad PWA zbudowanym z Vue do użytku osobistego, który zasadniczo spełnia tę samą funkcję co YouTube Music, bez konieczności płacenia za niego co miesiąc.
Skonfigurowałem serwer z interfejsem API REST, który może przeszukiwać YouTube na podstawie zapytania, a następnie zwraca adres URL dla strumienia wideo tego wideo zawierającego tylko dźwięk do klienta. Następnie jest definiowany jako atrybut src
w tagu <audio>
.
Odtwarzanie działa świetnie, ale zamierzam używać tego przez Bluetooth w moim samochodzie i zauważyłem, że informacje wyświetlane na tablecie mojego samochodu to tylko informacje o aplikacji. Na przykład, jeśli odtwarzam muzykę, widzę:
- Nazwa aplikacji
- Lokalny adres IP
- Nieznany artysta
- Brak okładki albumu
Kiedy zazwyczaj informacje byłyby wyświetlane jako:
- Tytuł piosenki
- Nazwa albumu
- Imię artysty
- Album Art
Ponieważ jest to PWA, kiedy muzyka jest odtwarzana na moim telefonie, pojawia się małe powiadomienie odtwarzacza audio. Uważam, że jeśli uda mi się wymyślić, jak edytować wartości w tym odtwarzaczu, powinienem być w stanie osiągnąć to, co próbuję zrobić. Czy istnieje sposób na ustawienie tych wartości?
Oto jak wygląda to powiadomienie: https://i.imgur.com/xazil7Y.png
1 odpowiedź
Udało mi się znaleźć odpowiedź w Media Session API.
Ten przykład, który został podany, jest w zasadzie dokładnie tym, czego szukałem.
if ('mediaSession' in navigator) {
navigator.mediaSession.metadata = new MediaMetadata({
title: 'Never Gonna Give You Up',
artist: 'Rick Astley',
album: 'Whenever You Need Somebody',
artwork: [
{ src: 'https://dummyimage.com/96x96', sizes: '96x96', type: 'image/png' },
{ src: 'https://dummyimage.com/128x128', sizes: '128x128', type: 'image/png' },
{ src: 'https://dummyimage.com/192x192', sizes: '192x192', type: 'image/png' },
{ src: 'https://dummyimage.com/256x256', sizes: '256x256', type: 'image/png' },
{ src: 'https://dummyimage.com/384x384', sizes: '384x384', type: 'image/png' },
{ src: 'https://dummyimage.com/512x512', sizes: '512x512', type: 'image/png' },
]
});
}
Teraz, gdy pojawi się powiadomienie odtwarzacza audio, wyświetla prawidłowy tytuł, wykonawcę, album i okładkę albumu. Działa tak samo, jak powiadomienie odtwarzacza dotyczące Muzyki Google Play, YouTube Music lub Spotify.