Video Streaming: Using Blob URL, -Video Seek casting 404 file not found

722 Views Asked by At

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
0

There are 0 best solutions below