I am a developer/creator of a Video Streaming Service, in order to server the movies I am using
createObjectURL() (BLOB URL).
The Blob Url is created and served to the html5 video element
after the video is rendered the blob URL is revoked in order to prevent the user from accessing the private movie file, however is result of this when I try to seek through the video I get an error file not found.
Would i need to recreate the blob every time I seek the video or am I declaring my blob wrong?
async renderBlob(url){
const myPlayer = this.player.current;
var xhr = new XMLHttpRequest();
xhr.open('GET', 'movie.mp4', true);
xhr.responseType = 'blob';
xhr.onload = () => {
this.setState({src: URL.createObjectURL(xhr.response)})
myPlayer.src = this.state.src
myPlayer.play()
};
xhr.onerror = function(e) {
alert("Error " + e.target.status + " occurred while receiving the document.");
};
xhr.send();
}
after the video is playing:
URL.revokeObjectURL(this.state.src)
Short videos SEEK okay where as Longer Videos 1) to longer to load and 2 do not seek
GET blob:http://localhost:3000/e5fd2c07-3f8a-407e-815f-7b9314d9156d net::ERR_FILE_NOT_FOUND