All geek questions in one place

Setting blob property for src HTML 5 video tag for devices

I am trying to play a video by setting the src property of an HTML 5 video tag in Blob (using the createObjectURL (blob) function). It seems to work fine on desktops, but not on devices. Below is the code stream:

  • I saved the .txt file that contains the video in Base64 format (its requirement, therefore, cannot be changed).
  • When I click the button, I upload the .txt file using the file system API and convert the Base64 string to Blob.
  • Then create a url for Blob using createObjectURL (blob).
  • Set the url generated by createObjectURL (blob) to the src property of the video tag.

I also added listeners "onerror", "loadstart" and "loadmetadata" for the video. The "loadstart" and "loadedmetadata" events are triggered on Android devices, but the video does not play after clicking on the default control for the video, while on the IOS devices the "loadstart" and "loaded metadata" devices do not fire.

+4
source share
1 answer

I had the same problem and could not find a simple solution. However, I noticed that the new Media Source API works in Android Chrome, and this will allow you to get around this problem, although on some devices and with great difficulty.

- API: http://html5-demos.appspot.com/static/media-source.html

0

Source: https://habr.com/ru/post/1539523/

More articles:


All Articles