Hi, I just try to play a video file from blob, I tested chrome, firefox and chromium on desktop and all are working, the problem appear to be in LG browser and webapp (no matter is hosted or local app).
Tried html5 player and shaka player and both report error 4 for video player:
MEDIA_ELEMENT_ERROR: Format error - on shaka player
DOMException: Failed to load because no supported source was found - on native html5 player
- I have tried mp4, webm, mp3, all of them do to the same error.
- Blob location exists because i tried with img and image is loading
- Blob size is not on limit because video have 16MB and image IMG 25MB
- Blob have video/mp4 type
- The same video works if loaded as mp4 from root webserver or url
- CORS is not involved because blob image is working
How to reproduce the error:
add beside the index.html file a mp4 file (ex test.mp4)
index .html →
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<video width="400" id="video" controls >
<source src="" type="video/mp4">
Your browser does not support HTML video.
</video>
</body>
</html>
javascript code (from console or on script part):
var video = document.getElementById('video');
let blob = await fetch("test.mp4").then(r => r.blob());
url = window.URL.createObjectURL(blob);
video.src = url;
video.load();
video.play();
the most important thing is that I have converted the blob to base64 and seems to work, but is not a solution because use a lot of resources.