Hi everyone. Under recent Google Chrome version (for instance 67.0.3396.99 (Official Build) (64-bit) it is not possible to play a video immediately after the program is started (that means the ‘index.html’ file and .js are loaded into browser). The browser throws the following exception with an autoplaying video:
Uncaught (in promise) DOMException: play() failed because the user didn’t interact with the document first. https://goo.gl/xX8pDD p5.dom.js:1711
The problem concerns not only p5.js and dom.js but HTML5 more generally:
It can be solved changing the following Chrome policy:
chrome://flags/#autoplay-policy
The default auto-play policy value is apparently set to: “User gesture is required for cross origins iframes”. Setting it to “No user gesture is required” solves the problem in Chrome.
But apparently it would also be possible to solve it within HTML changing elements attributes…
It’s not really elegant to ask user to change a browser policy in order for an htm5 application to work… Is there a way to solve the problem directly within a sketch?
This is a new security measure that chrome (and many more soon) are adopting. my understanding is to fight auto play video ads and general bandwidth consumption w/o user consent. It’s hard to imagine google doing an about face on this issue and with it in place, any work around will be a hack and likely be patched or bypassed soon.
I’d say – just think about your user experience and perhaps it makes sense to incorporate the user input into something in your project that makes sense.
One way to solve it within the sketch (especially if you have interaction) is to just make the first time the user clicks on something or interacts with the page start the audio/video, you don’t need an explicit play button, you can handle it on any user interaction.
