remotion-dev / remotion

🎥 Make videos programmatically with React
https://remotion.dev
Other
20.87k stars 1.05k forks source link

Prevent "NotAllowedError: play() failed" #4409

Closed UmungoBungo closed 1 month ago

UmungoBungo commented 1 month ago

While the audio has not been requested (un-mute hasn't been clicked, or the volume hasn't been changed) don't mount an audio component. If rendering, mount it regardless.

This is to prevent this browser message

image

vercel[bot] commented 1 month ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
bugs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 15, 2024 3:09am
remotion ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 15, 2024 3:09am
remotion-convert ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 15, 2024 3:09am
UmungoBungo commented 1 month ago

Considering the audio tag is mounted just at the moment it is required for playback, I have added a preload() outside of the <Player />. I also trimmed the audio, bringing the file size down from 1.76mb to 60kb