[matteason]

It's actually surprisingly hard to get iOS Safari to keep playing audio with the screen off.

When I made https://ambiph.one I ended up having to route everything through a MediaStreamAudioDestinationNode to trick Safari into thinking it's a livestream, which is apparently the only type of audio allowed to play in the background

Minimal demo here if it's helpful for anyone: https://codepen.io/matteason/pen/VYwdzVV

[thorum]

The solution I found after approximately two months of struggling with this problem: you have to generate an audio file that is a few seconds of silence, play it on a loop, and play it at the same time as the actual audio file you want to play (via separate audio elements, or an AudioContext). Specifically I believe you need to make sure the silence is “playing” at track boundaries for the real audio, so there is never a single moment where your webapp stops playing audio.

[prmoustache]

How do you even accept to use/and develop for a device that forces you to do that?

[thorum]

Apple makes webapps/PWAs hard because they want you to make a native app instead.

[matteason]

Ohhh that's interesting, so the root cause for my workaround working might be that the "live" audio node that I stream everything else to effectively never stops

[busymom0]

Does iOS let you play multiple audio at the same time?

[aspenmayer]

I have been able to have multiple streams on iOS, but not easily. GarageBand might be able to do this via imports, but I’m not sure it it lets you queue/play multiple samples simultaneously like it will on macOS iirc.

If you are playing music through Spotify in the background, foreground audio in Snapchat still plays normally while recording and playing back just recorded snaps, as well as snaps or memories you have prepared earlier. Sometimes you need to start playback on Spotify again via Control Center, because Snapchat steals focus or takes priority for audio output or something, but it is just part of the jankyness of this workflow, which is probably not intentionally designed to be used the way I use it. If you combine these quirks with Screen Recording, you can make simple audio loops by recording simultaneously via Snapchat and iOS Screen Recording, then use those videos as uploads to Snapchat to stack the loops over each over by selectively queuing them, with audio from a video in Snapchat playing at the same time as audio from Spotify.

It’s kind of a weird workflow, but it’s neat that it works. It feels intentional, as most apps stop background audio playback when starting recording on the same device, but at least Snapchat does not do this, so it’s at least technically possible.

[thorum]

It works on iOS 18. Safari’s audio support was pretty rough on earlier versions, especially <17, but I didn’t need to support those for my project.

[egglemonsoup]

Hey Matt! I've been a fan of Ambiphone for a while and I see your comments on HN surprisingly often. I've been trying to build a different web audio player with inspiration taken from yours. I haven't figured out the screen off audio thing, so thank you so much for sharing this demo!!!

[matteason]

Thanks so much, that's really cool to hear! Let me know if you ever hit any more problems, I've been meaning to blog about a bunch of problems I had to work round in various browsers but haven't got round to it yet, so happy to answer any questions