Safari and autoplay

[khannurien]

Hi,

When trying to play audio through the UI in Safari, I get this error:

Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.

This is most probably caused by the recent change in policy regarding audio autoplay in Safari (11 and 12):
https://www.reddit.com/r/webdev/comments/71nkym/safari_11_has_a_major_change_to_web_audio_api/
https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/

Clicking on a track in queue to start playing it manually doesn't work either.

Thanks for the hard work! Airsonic-UI looks great :-)

[heyarne]

Thanks for reporting this! This seems to be quite a common problem and I'm not 100% sure how to solve it yet and it unfortunately breaks audio completely in Safari currently (also the audio controls in the bottom bar). I'm not sure how Safari figures out the "user interaction" part.
I took a stab at solving it, so far unsuccesfully. What didn't work:

• creating the audio element non-lazily
• using <source> elements instead of setting the src attribute
• calling .load on the audio element before calling play

Apparently working with AudioContext directly still works but I don't know if I want to go down that route. Looks more like an oversight to me that might stop working soon as well, considering the intent appears to be disabling automatically starting media altogether.

(Oh, and a fun-fact: Spotify doesn't work on Safari (for unrelated reasons), but maybe we can beat them there ;))

[heyarne]

I've had some success by causing the audio effects using rf/dispatch-sync instead of rf/dispatch. Still not working 100% but I think it's promising. It's also nice to not have to pull in another lib, but we'll see if audio works well enough across browsers and devices for it to stay that way.

[heyarne]

@khannurien Can you verify that the fix is working? I've tested it on macOS 10.13.6 with Safari Version 12.0.1 (13606.2.104.1.2) and it seems to be okay. It's deployed at https://heyarne.github.io/airsonic-ui.

[khannurien]

Sorry for the late reply, and thank you for the patch. It's working here with 10.13.6 and Safari 12.0.1.

[heyarne]

Actually I only just deployed it, so not such a late reply at all. Glad to hear that it worked!