Manage to get the snapshot with these settings on Safari:
Now the returned base64 images are black (jpeg) or blank (set to webp, got png).
API works fine on other browsers.
Safari 16.2 on Mac mini M1 2020, MacOS 12.6.2 - NOT WORKING
Safari 16.1 on MacBook Air 2019, MacOS 13 - WORKING
Tried to set directly base64 to the lower-canvas element, tried to set the video element in the same canvas with drawImage, and set background-image CSS prop until realized that getSnapshot is not returning a valid snapshots in above mentioned case.
As you already know from the thread you linked, browsers can prevent access to the video frames (e.g. in the default setup of Safari, we’re getting The operation is insecure reject message from the browser).
I can’t really reproduce the problem with the black or blank image though (using Safari 16.3 on macOS 13.2). Could you please let me know if you see this problem also on Bitmovin Player Demo? Thanks!
Hi Daniel, thank you for the updates.
The first configuration with mac mini is not displaying frame. The console outputs the img element and the img element is present in HTML. But the base64 set as the src is transparent PNG.
The use case is capturing a frame from video so it can be edited/annotated by a user in a canvas element (drawing arrows, writing text on the image, etc…)
After further looking into this, I’m afraid there’s not much we can do. It seems that some system/browser configurations don’t allow this use case. I haven’t seen the transparent PNG myself though, in my tests it either works, or the browser throws an error at us.