Media Player Broken in Safari 11.1
Closed this issue · 8 comments
Love the player, and works very well. Recently we noticed that it is broken in Safari. Getting the following error in the console. This seems to be an issue picked up across other video players as well, so perhaps a webkit bug that needs to be worked around.
Unhandled Promise Rejection: NotSupportedError: The operation is not supported.
Screenshot of console from demo page attached
Follow up, I realized that in the screenshot the promise may have failed because of the 404 being returned, but we are still facing the issue in our live environment when we are directly linking to mp3's as well.
Do you think this is because the resources I was referencing have moved? In a sense, this is two bugs. The first bug is to update the demos to use more reliable media sources. The second bug is to either not throw when a resource is not found or to throw a more reasonable error.
What do you think?
Also, thank you so much for using this player. I didn’t think anyone cared or used it at all. I recently saw a blog about accessible players and I don’t think this one was mentioned. 😄
The player is fantastic so we use it in our CRM! Thank you for building it. Yes, agreed updating demos would be a bug. However, it's not actually a 404 that's triggering it. here's a screenshot from our live system.
This page works fine in Chrome but breaks in Safari. Not sure why exactly.
Here's some samples to illustrate my point:
This seems to be related to Safari 11's autoplay media update.
https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/
https://www.reddit.com/r/webdev/comments/71nkym/safari_11_has_a_major_change_to_web_audio_api/
For me, the issue disappeared for me once I added working files. I tested this in Safari 12.0 (13606.1.30).
See the following URLs:
- https://jonathantneal.github.io/media-player/index.html
- https://jonathantneal.github.io/media-player/playlist.html
In the playlist example, I switched to the second song and let it finish, transition to the next track which autoplayed, and then transitioned from that track to the next track which also autoplayed.
Would you be able to send me a snippet of code or a link to a repo that should demonstrate the failure with the littlest code possible? I’m happy to look at this further with you.
Thanks for the quick response @jonathantneal! So after further examination I realized that this is because safari doesn't seem to like being given streams in the audio src. We currently get our audio from Amazon S3 which returns a value like :
src="/getfile.php?f=1&stream=true&id=XXXXXXX&cid=XXXXXXXXX"
Safari doesn't seem to like this. If i give it a full URL and don't stream it works fine. Not sure if this is something the player can detect and solve for or if just not using streams is the solution.
What do you think? Thank you for taking the time to diagnose this with me. Sincerely appreciate it.
Okay, I’m closing the initial issue since this is more about adding support for streams. However, I’m also not sure this app doesn’t support streams out of the box. If you can throw together a demo of streams working or not working with this app, I’d be happy to followup.