Discussion :

[Allan43]

Bonjour à tous,
Je suis nouveau sur le forum, je me présente donc succinctement, je m'appelle Allan, je suis dév web depuis 2ans et mentor sur OC depuis 1an.
Je suis actuellement sur le développement d'un projet sur lequel j'aimerais envoyer une vidéo enregistrée via js, vers le serveur en vue de la transmettre à l'api Vimeo.
Mon soucis est le suivant:
J'ai bien une vidéo blob, je peux la lire et la télécharger etc.. Je tente plusieurs manipulations, celle qui me semble la plus pertinente est la suivante : Je passe mon blob en fichier Js via un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

new File([monBlob], "uploaded_video.mp4", {type: "video/mpeg", lastModified: Date.now()});

J'ai testé avec différents format/type, sans succès.
Je n'ai pas d'erreurs mais le file est à 63octets quoi que je fasse.

Quelqu'un est déjà par là ou à une idée ?

Merci à vous

[Watilin]

C’est bizarre
Mais si ton blob vient d’un stream, l’explication serait que du coup, seul le premier bloc est transmis. Comment est produit ton blob ?

[Allan43]

J'enregistre un stream dans un premier temps :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
let mediaRecorder = new MediaRecorder(monStream, options);
    mediaRecorder.ondataavailable = function(ev) {
        recordData.push(ev.data);
    }
    mediaRecorder.start();

Une fois l'enregistrement terminé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
mediaRecorder.onstop = (ev)=>{
        let blob = new Blob(recordData, { 'type' : 'video/mp4;' });
        recordData = [];
        let videoURL = window.URL.createObjectURL(blob);
        vidSave.src = videoURL;
        vidUp = videoURL;
    }

La création du blob ou l'enregistrement pose problème ?

[Watilin]

J’ai rencontré le même problème récemment. La balise <video> sait lire les flux comme par magie, mais en JS on ne peut pas les manipuler, ou alors on prend le risque de faire déborder la mémoire du navigateur.
Le projet StreamSaver résoud le problème en utilisant un service worker, mais il y a des contraintes (même domaine, https obligatoire). Je te laisse jeter un œil, en particulier l’exemple Saving audio or video stream using mediaRecorder.

[Allan43]

Je regarderai de ce côté, problème résolu, je ne passais pas le bon blob ( enfin je passais le lien plutôt que le blob, erreur d’inattention, après deux jours dessus :p )
Grâce à ta piste du premier bloc.
Merci à toi
Bon maintenant j'ai des soucis avec l'api Vimeo m'enfin c'est une autre histoire
Bye !