I have a web page where user uploads a video file using html's "input type = file" tag, I am catching that uploaded video file in JavaScript function variable where it is coming as blob URL. "blob: https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c ". I am not able to save this blob URL in my system.
HTML code:
<input type="file" name="video_file_name" accept="video/*">
<input type="submit" value="Upload Video" id="customVideoSubmit">
<button onClick="postVideo();" id="customVideoSubmit" aria- hidden="true">Upload Video</button>
JavaScript code:
function postVideo(){
var blobURL = document.querySelector('video').src;
}
variable blobURL contains following blob URL, which plays video properly if I put this on a separate tab of that browser.
blob:https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c
How can I save this blob video file in my system. I have tried number of JavaScript methods and also back end methods in my Perl code like
decode_base64($cgi->{blobURL}) ;
Nothing worked though. Any help will be much appreciated.
To convert a Blob URL
to a Blob
to POST
to server you can use fetch()
and Response.blob()
const blobURL = URL.createObjectURL(new Blob([123])); fetch(blobURL) .then(response => response.blob()) .then(blob => { // do stuff with `blob`: `Blob` console.log(blob); });
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.