6

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

  1. I have kept a .txt file which contains a video in Base64 format (Its a requirement, so can't change).
  2. On click of a button I load the .txt file using filesystem API and convert the Base64 string to Blob.
  3. Then create the url for the Blob using createObjectURL(blob).
  4. Set the url generated by createObjectURL(blob) to src property of video tag.

I have also attached listeners "onerror", "loadstart" and "loadedmetadata" for the video. "loadstart" and "loadedmetadata" events are fired on Android devices but video doesn't play after clicking the default control of video, whereas on IOS device "loadstart" and "loadedmetadata" events don't get fired.

kapilkmr8
  • 61
  • 1
  • 2
  • currently I am checking it on ios6, though I can test it on ios7 as well. – kapilkmr8 May 07 '14 at 08:59
  • according to http://caniuse.com/bloburls, IO6 six needs a webkit-prefix, and i'm not sure that the video tag will play nice with a window.URL until iOS7. – dandavis May 07 '14 at 17:52
  • Actually, it's iOS7 and it's still not working (at least on my tests). Have anyone found a solution for this? – Unapedra Jul 25 '14 at 13:46

1 Answers1

0

I have had the same issue and were unable to find a simple solution. However, I have noticed that the new Media Source API seems to work in Android Chrome and this would allow you to work around this problem - although only on some devices and with a lot of effort.

Here an example of the media source API: http://html5-demos.appspot.com/static/media-source.html

Joel
  • 15,496
  • 7
  • 52
  • 40