Video play() api in javascript is not working in safari until I change the preference of autoplay to 'Allow all Autoplay'

Question

We are implementing web player which should work across the browsers. We are setting the video source through java script and calling play() to play the video on the browser.

We described Video element as given below.

<video id="videoID" preload="none"  tabindex="1"></video>

This is working fine on Chrome but video is not playing on Safari (version : 11.0.3) and throwing Unhandled Promise Rejection error as given below.

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

If I change the autoplay setting in safari to 'Allow all Autoplay', video is playing fine with out any issues.

I tried by adding autoplay attribute also to Video element but it is not working.

Expectation is user shouldn't do any thing to play the video. When user visits the URL, it should play the video (with audio) automatically without any user action. Could anyone please let me know if there is anyway to achieve this in javascript?

Answer 1

As far as I know this cannot be achieved via Javascript alone. On safari (without the setting you mentioned) a video can only be started via a user interaction. This is to avoid videos auto-playing against a user's will.