Tengo un formulario donde los usuarios pueden grabarse con su cámara web usando getUserMedia, y necesito enviar el archivo que graban a otra página antes de guardar el archivo en el servidor.
Mi pregunta es ¿cómo puedo lograr esto? Hasta ahora he generado un blob del video, ¿cómo envío esto a través de mi formulario a la página siguiente para poder acceder al archivo y luego almacenarlo en el servidor?
Actualmente estoy generando el blob así, que funciona:
let videoURL = window.URL.createObjectURL(blob, {autoRevoke: false});
Pero no estoy seguro de cómo puedo enviar este archivo como parte de la solicitud POST del formulario sin usar AJAX y FormData. ¿Es posible o me estoy acercando a esto incorrectamente?
Cree un archivo a partir de su blob, agréguelo a una lista de archivos y luego sobrescriba la lista de archivos de una entrada de archivo en el formulario.
<form> ... <input type="file" name="myvideo" id="fileinput"> ... </form> var input = document.querySelector('#fileinput'); //the file input var file = new File(blob, 'video_file.mp4'); // create new file // Need to use a data transfer object to get a new FileList object var datTran = new ClipboardEvent('').clipboardData || new DataTransfer(); datTran.items.add(file); // Add the file to the DT object input.files = datTran.files; // overwrite the input file list with ours