
Recherche avancée
Médias (2)
-
Core Media Video
4 avril 2013, par
Mis à jour : Juin 2013
Langue : français
Type : Video
-
Video d’abeille en portrait
14 mai 2011, par
Mis à jour : Février 2012
Langue : français
Type : Video
Autres articles (78)
-
Encoding and processing into web-friendly formats
13 avril 2011, parMediaSPIP automatically converts uploaded files to internet-compatible formats.
Video files are encoded in MP4, Ogv and WebM (supported by HTML5) and MP4 (supported by Flash).
Audio files are encoded in MP3 and Ogg (supported by HTML5) and MP3 (supported by Flash).
Where possible, text is analyzed in order to retrieve the data needed for search engine detection, and then exported as a series of image files.
All uploaded files are stored online in their original format, so you can (...) -
MediaSPIP Player : problèmes potentiels
22 février 2011, parLe lecteur ne fonctionne pas sur Internet Explorer
Sur Internet Explorer (8 et 7 au moins), le plugin utilise le lecteur Flash flowplayer pour lire vidéos et son. Si le lecteur ne semble pas fonctionner, cela peut venir de la configuration du mod_deflate d’Apache.
Si dans la configuration de ce module Apache vous avez une ligne qui ressemble à la suivante, essayez de la supprimer ou de la commenter pour voir si le lecteur fonctionne correctement : /** * GeSHi (C) 2004 - 2007 Nigel McNie, (...) -
Supporting all media types
13 avril 2011, parUnlike most software and media-sharing platforms, MediaSPIP aims to manage as many different media types as possible. The following are just a few examples from an ever-expanding list of supported formats : images : png, gif, jpg, bmp and more audio : MP3, Ogg, Wav and more video : AVI, MP4, OGV, mpg, mov, wmv and more text, code and other data : OpenOffice, Microsoft Office (Word, PowerPoint, Excel), web (html, CSS), LaTeX, Google Earth and (...)
Sur d’autres sites (4926)
-
Playing 120fps in browser between original and re-made video, original is normal speed, new video is slo-mo
1er mars 2023, par Patrick VelliaI used my GoPro Hero10 to record at 4k 120fps on a green screen. This original video plays slo-mo in QuickTime but "normal" speed in the browser. I want it playing normal speed, and if end user wants to slow it down they have the extra frames for that to maintain clarity, which is why I record at 120.


I then used FFMPEG to create an image sequence of the video.


Then I ran Image Magic to create the transparent frames.


Then I put it back together with the following command for a HEVC mov file :


ffmpeg -r 120 -f image2 -i transparent/image_transparent_%08d.png -vcodec hevc_videotoolbox -crf 28 -alpha_quality 1 -tag:v hvc1 output.mov



I am still on an Intel MacBook Pro running FFMPEG 4.6 (as I've found 5+ was buggy with one of my commands a few months ago but can't remember which one, I think it was the videotoolbox).


The GoPro video has the following stream data as input to the FFMPEG :


Duration: 00:00:08.15, start: 0.000000, bitrate: 60160 kb/s
 Stream #0:0(eng): Video: hevc (Main) (hvc1 / 0x31637668), yuvj420p(pc, bt709), 3840x2160 [SAR 1:1 DAR 16:9], 59891 kb/s, 119.88 fps, 119.88 tbr, 120k tbn, 119.88 tbc (default)
 Metadata:
 creation_time : 2023-02-28T19:06:41.000000Z
 handler_name : GoPro H.265
 vendor_id : [0][0][0][0]
 encoder : GoPro H.265 encoder
 timecode : 19:05:32:105
 Stream #0:1(eng): Audio: aac (LC) (mp4a / 0x6134706D), 48000 Hz, stereo, fltp, 189 kb/s (default)
 Metadata:
 creation_time : 2023-02-28T19:06:41.000000Z
 handler_name : GoPro AAC 
 vendor_id : [0][0][0][0]
 timecode : 19:05:32:105
 Stream #0:2(eng): Data: none (tmcd / 0x64636D74), 0 kb/s (default)
 Metadata:
 creation_time : 2023-02-28T19:06:41.000000Z
 handler_name : GoPro TCD 
 timecode : 19:05:32:105
 Stream #0:3(eng): Data: bin_data (gpmd / 0x646D7067), 76 kb/s (default)
 Metadata:
 creation_time : 2023-02-28T19:06:41.000000Z
 handler_name : GoPro MET 



Whereas the re-constructed video has the following data :


Duration: 00:00:08.13, start: 0.000000, bitrate: 763650 kb/s
 Stream #0:0: Video: hevc (Main) (hvc1 / 0x31637668), yuv420p(tv, progressive), 3840x2160 [SAR 1:1 DAR 16:9], 763696 kb/s, 120 fps, 120 tbr, 15360 tbn, 15360 tbc (default)
 Metadata:
 handler_name : VideoHandler
 vendor_id : FFMP
 encoder : Lavc58.134.100 hevc_videotoolbo



When this re-constructed video plays in the browser, it is in slow-mo and I need to set the playbackRate to 4.0 for it to play "normally".


Is there something I need to add to the video for the browser to play it at "normal" speed ?


-
Convert Blob audio file to mp3 type in typescript
6 avril 2022, par I. AlbuquerqueI'm trying to convert a blob audio file to .mp3 type which is generated from MediaRecorder it is returning with webm type and I have tried other types in MimeType(attribute in MediaRecorder to set the type) but they are not supported so I have tried ffmpeg npm library but it was asking for path of the file but i'm not saving it so that also didn't work for me. Any suggestion and answer that will help !!


Here is how i get audio


getAudio(){
 navigator.mediaDevices.getUserMedia({ audio: true})
 .then( stream => {
 console.log(stream)
 this.mediaRecord = new MediaRecorder(stream)

 this.mediaRecord.ondataavailable = (data: { data: any; }) => {
 console.log(data)
 this.chunks.push(data.data)
 }

 this.mediaRecord.onstop = () => {
 const blob = new Blob(this.chunks, { type: 'audio/mp3'})
 const reader = new window.FileReader()
 reader.readAsDataURL(blob)
 reader.onloadend = () => {
 const teste:any = this.$el.querySelector('#teste')
 teste.src = reader.result //render.result e o local onde o audio fica armazenado
 this.ArquivoAudio = blob
 console.log(reader.result)
 }
 }
 }, err => {
 console.log(err)
 alert('voce deve permitir a captura de audio')
 })
},



-
set MediaRecorder to record 1 frame every N seconds
19 août 2022, par The Blind HawkSummary


I have a version of my code already working on Chrome and Edge, but I need some fixes for it to work on Safari.

My objective is to record around 25 minutes and download a timelapse version of the recording.

final product requirements :

speed: 3fps
length: ~25s

(I need to record one frame every 20 seconds for 25 mins)



this.secondStream settings :


this.secondStream = await navigator.mediaDevices.getUserMedia({
 audio: false,
 video: {width: 430, height: 430, facingMode: "user"}
});



My code for IOS so far :


startIOSVideoRecording: function() {
 console.log("setting up recorder");
 var self = this;
 this.data = [];

 if (MediaRecorder.isTypeSupported('video/mp4')) {
 // IOS does not support webm, so I will be using mp4
 var options = {mimeType: 'video/mp4', videoBitsPerSecond : 1000000};
 } else {
 console.log("ERROR: mp4 is not supported, trying to default to webm");
 var options = {mimeType: 'video/webm'};
 }
 console.log("options settings:");
 console.log(options);

 this.recorder = new MediaRecorder(this.secondStream, options);

 this.recorder.ondataavailable = function(evt) {
 if (evt.data && evt.data.size > 0) {
 self.data.push(evt.data);
 console.log('chunk size: ' + evt.data.size);
 }
 }

 this.recorder.onstop = function(evt) {
 console.log('recorder stopping');
 var blob = new Blob(self.data, {type: "video/mp4"});
 self.download(blob, "mp4");
 self.sendMail(videoBlob);
 }

 console.log("finished setup, starting")
 this.recorder.start(1200);

 function sleep(ms) { return new Promise(resolve => setTimeout(resolve, ms));}

 async function looper() {
 // I am trying to pick one second every 20 more or less
 await sleep(500);
 self.recorder.pause();
 await sleep(18000);
 self.recorder.resume();
 looper();
 }
 looper();
 },



Issues


Only one call to getUserMedia()


I am already using
this.secondstream
elsewhere, and I need the settings to stay as they are for the other functionality.

On Chrome and Edge, I could just callgetUserMedia()
again with different settings, and the issue would be solved, but on IOS callinggetUserMedia()
a second time kills the first stream.

The settings that I was planning to use (works for Chrome and Edge) :

navigator.mediaDevices.getUserMedia({
 audio: false,
 video: { 
 width: 360, height: 240, facingMode: "user", 
 frameRate: { min:0, ideal: 0.05, max:0.1 } 
 },
}



The timelapse library I am using does not support mp4 (ffmpeg as alternative ?)


I am forced to use mp4 on IOS apparently, but this does not allow me to use the library I was relying on so I need an alternative.

I am thinking of usingffmpeg
but cannot find any documentation to make it interact with the blob before the download.

I do not want to edit the video after downloading it, but I want to be able to download the already edited version, so no terminal commands.

MediaRecorder pause and resume are not ideal


On Chrome and Edge I would keep one frame every 20 seconds by setting the frameRate to 0.05, but this does not seem to work on IOS for two reasons.

First one is related to the first issue of not being able to change the settings ofgetUserMedia()
without destroying the initial stream in the first place.

And even after changing the settings, It seems that setting the frame rate below 1 is not supported on IOS. Maybe I wrote something else wrong, but I was not able to open the downloaded file.

Therefore I tried relying on pausing and resuming the MediaRecorder, but this brings forth another two issues :

I am currently saving 1 second every 20 seconds and not 1 frame every 20 seconds, and I cannot find any workarounds.

Pause and Resume take a little bit of time, making the code unreliable, as I sometimes pick 2/20 seconds instead of 1/20, and I have no reliability that the loop is actually running every 20 seconds (might be 18 might be 25).