Impossible de sauvegarder/télécharger l'objet de données blob du navigateur

Question

J'ai une page web où l'utilisateur télécharge un fichier vidéo en utilisant la balise "input type = file" de html, j'attrape ce fichier vidéo téléchargé dans la variable de fonction JavaScript où il arrive comme URL blob. "BLOB: https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c". Je ne suis pas en mesure de sauvegarder cette URL blob dans mon système.

code HTML:

<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> 

code JavaScript:

function postVideo(){ 
    var blobURL = document.querySelector('video').src; 
} 

variables blobURL contient l'URL suivante blob, qui joue vidéo correctement si je mets cela sur un onglet séparé de ce navigateur.

blob:https://www.myownsite.com:8080/2e8cfd32-abf2-4db3-b396-91f76cc3b40c 

Comment puis-je sauvegarder ce fichier vidéo blob dans mon système. J'ai essayé le nombre de méthodes JavaScript et aussi les méthodes back-end dans mon code Perl comme

decode_base64($cgi->{blobURL}) ; 

Rien n'a fonctionné. Toute aide sera très appréciée.

Answer 1

Pour convertir un Blob URL à un Blob-POST au serveur, vous pouvez utiliser fetch() et 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); 
 
});