Video object playback in Safari?

How do I...?
1

The video object is fantastic and works amazing in Chrome. In safari the videos load the first frame and respond to visibility changes, but any attempt to play them results in this error in the safari javascript console:

image
image1590×44 7.21 KB

I’ve read all i can find about how safari blocks video autoplay events. Does anybody have any suggestions for how to get Gdevelop to play via videoobjects in a way that safari likes?

Thanks!

here’s a silly video playback test I did to demonstrate the problem (click on the vhs tapes to play video) https://regina.co.nz/viditest/

2

I don’t use Safari, but you can try:
-creating an invisible Sprite object that follows the mouse (set position to MouseX() and MouseY() each frame)
-loading the video with the first click, and clicking a different button to actually play it
-autoplay without sound.

Those might not work, if that’s the case my bad. Hopefully someone knows better!

3

Take care of warnings about video object in the properties of video object.
Have you the same issue on the video example ?

5

I’ve tried all the options I can within gdevelop and file type/server settings. Safari is absolutely seeing the files and loading them (displaying the first frame of each video, and all playable if you just browse to the video file), but spitting out endless errors at every attempt to play them. If anyone else runs into this problem and is researching a solution, these two discussions seem like they might be addressing the same issue. (I’m not savvy enough to know to test if they apply or not)

https://stackoverflow.com/questions/46483001/programmatically-play-video-with-sound-on-safari-and-mobile-chrome

https://stackoverflow.com/questions/47285624/safari-blocks-play-on-video-despite-being-called-from-click-event

Oh, and i’m having the same error with the gdevelop video object example - it also doesn’t play on safari.

6

@4ian can you test or seen what wrong wiith you safari ?

7

Safari block videos from being played if they have an audio track and are not launched by a user gesture. Unfortunately, clicking once on the game is not sufficient. The play() function has to be called from a “onClick” or other JavaScript callback. This is not the case in GDevelop: events are run outside of a JavaScript callback.

See this article explaining how it works: New <video> Policies for iOS | WebKit (" WebKit’s New policies for video" section)

Potential solution:

  • Workaround: remove the audio track from the video, so that it’s not blocked by safari. This means audio must be launched separately.
  • Workaround that we could put in GDevelop: set the video to be muted, if Safari is detected, so that Safari plays it. But this would basically transform the issue into “video sound is not working on Safari”.
  • Find a way to start the video by doing a hack: when a video is tried to be played, but the play method promise is rejected, we register a “onMouseDown”/“onTouchDown” on the document that will play the video (not sure if that would work, but your get the idea). This means that the video will be launched one frame too late. Not a huge deal, but can create some confusion if you try to check with a condition if the video is playing immediately after using the action to play.

EDIT: would be great to make an issue on GitHub to follow this up.

1 Like