XMLHttpRequest for Video Tag?

The HTML5 file Blob.slice() method is useful for creating a Blob object containing the data. This data is in the specified range of bytes of the source Blob. It uses XMLHttpRequest as in the below example.

Let us see an example to send and receive binary data using slice(). This example sends a text and uses the POST method to send the "file" to the server:

var val = new XMLHttpRequest();

val.open("POST", url, true);
val.onload = function (event) {
};
var blob = new Blob(['demo'], {type: 'text/plain'});
val.send(blob);

For video:

req.onload = function () {
   var blob_uri = URL.createObjectURL(this.response);
   myElement.appendChild(document.createElement("source")).src = blob_uri;
};
req.responseType = "blob";

karthikeya Boyini

Updated on 29-Jan-2020 08:14:09

• Related Questions & Answers
• Play local (hard-drive) video file with HTML5 video tag?
• Hide a video tag on a web page - JavaScript
• HTML5 Video Tag in Chrome - Why is currentTime ignored when video downloaded from my webserver?
• How to generate captions for a video?
• Using FFMPEG with HTML5 for online video hosting
• ffmpeg settings for converting to mp4 and ogg for HTML5 video
• HTML Viewport meta tag for Responsive Web Design
• Use CSS width property for a responsive video player
• Use CSS max-width property responsive for video player
• How to send a file and parameters within the same XMLHttpRequest
• Video Ads for Mobile Devices – A Successful Recipe for Your Digital Campaign
• Commonly used Video formats while using HTML5 video
• HTML5 <audio> tag on Android for PhoneGap application
• What HTML5 tag should be used for filtering search results.
• HTML canvas Tag