CreateJS/PreloadJS

LoadQueue timeouts when tag-loading mp4 videos

alebianco-doxee opened this issue · 1 comments

TODO

  • Is this a question or bug? Stack Overflow is a much better place to ask any questions you may have.

  • Did you search the issues to see if someone else has already reported your issue? If yes, please add more details if you have any!

  • If you're using an older version, have you tried the latest?

  • If you're requesting a new feature; provide as many details as you can. Why do you want this feature? Do you have ideas for how this feature should be implemented? Pseudocode is always welcome!

Issue Details

  • Version used: 1.0

  • Describe whats happening (Include any relevant console errors, a Gist is preferred for longer errors):

When using a LoadQueue to tag-load (const queue = new createjs.LoadQueue(true);) mp4 videos on iOS, the queue goes in timeout because the video loading never completes.

This happens because the browser suspends the loading after the video metadata is received. The canplaythrough event is never dispatched and so the MediaTagRequest used by the VideoLoader never completes and timeouts after a while. On desktop this does not happen since Safari fully loads the file automatically.

Loading through XHR is not an option, because then Safari keeps "reloading" the blob resource while the media is playing and ends up consuming so much memory that slows down and then crashes the application. This is done by Safari as a sort of media streaming (https://blog.logrocket.com/streaming-video-in-safari/) but apparently with blob resources doesn't work very well ...

Basically, the preload = "auto" attribute of the video tag, behaves differently on desktop and mobile. On desktop it lets the browser fully load the file; On mobile it behaves as if it was set to metadata instead and requires manual intervention to fully load the file.

  • OS & Browser version (Please be specific) (Ex; Windows 10 Home, Chrome 62.0.3202.94):

iPhone 13 iOS 15, both Safari anche Chrome
also tested and confirmed in previous versions of hardware and software

  • Do you know of any workarounds?

Explicitly calling this._tag.load(); in the MediaTagRequest's load method, forces the browser to fully load the media file and dispatch the necessary events once the resource is ready.

Hi @alebianco-doxee - sorry for the delay. I forgot to keep track of preloadjs issues. We are maintaining here with the help of the community. Is there a chance that you could adjust preloadjs to solve the problem? Ideally then this would be done through a pull request and we can implement the request. Cheers.