Recherche avancée

Médias (91)

Autres articles (70)

  • Participer à sa traduction

    10 avril 2011

    Vous pouvez nous aider à améliorer les locutions utilisées dans le logiciel ou à traduire celui-ci dans n’importe qu’elle nouvelle langue permettant sa diffusion à de nouvelles communautés linguistiques.
    Pour ce faire, on utilise l’interface de traduction de SPIP où l’ensemble des modules de langue de MediaSPIP sont à disposition. ll vous suffit de vous inscrire sur la liste de discussion des traducteurs pour demander plus d’informations.
    Actuellement MediaSPIP n’est disponible qu’en français et (...)

  • Menus personnalisés

    14 novembre 2010, par

    MediaSPIP utilise le plugin Menus pour gérer plusieurs menus configurables pour la navigation.
    Cela permet de laisser aux administrateurs de canaux la possibilité de configurer finement ces menus.
    Menus créés à l’initialisation du site
    Par défaut trois menus sont créés automatiquement à l’initialisation du site : Le menu principal ; Identifiant : barrenav ; Ce menu s’insère en général en haut de la page après le bloc d’entête, son identifiant le rend compatible avec les squelettes basés sur Zpip ; (...)

  • Les autorisations surchargées par les plugins

    27 avril 2010, par

    Mediaspip core
    autoriser_auteur_modifier() afin que les visiteurs soient capables de modifier leurs informations sur la page d’auteurs

Sur d’autres sites (12982)

  • how to get 120fps encoded video to play at "normal" speed instead of slow mo

    1er mars 2023, par Patrick Vellia

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

    


    EDIT

    


    I just compared the two video streams :

    


    original:
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)

Reconstructed:
 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)


    


    I don't quit understand all of this though. so here's what I notice :

    


    original.         reconstructed
--------------------------------
bt709             progressive
89871 kb/s.       763696 kb/s
119.88 fps.       120 fps
119.88 tbr.       120 tbr
120k tbr.         15360 tbr
11960 tbr.        15360 tbc


    


    Hmm. I suspect it has something to do with tbr and tbc whatever those are, or perhaps the progressive vs the bt709 ? the pirates are also vastly different.

    


  • Playing 120fps in browser between original and re-made video, original is normal speed, new video is slo-mo

    1er mars 2023, par Patrick Vellia

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

    


  • Video streamign with FFMpeg and Nest.js+Next.js

    17 septembre 2024, par Aizen

    Here is my problem : I have one video src 1080p (on the frontend). On the frontend, I send this video-route to the backend :

    


    const req = async()=>{try{const res = await axios.get('/catalog/item',{params:{SeriesName:seriesName}});return {data:res.data};}catch(err){console.log(err);return false;}}const fetchedData = await req();-On the backend i return seriesName.Now i can make a full path,what the video is,and where it is,code:


    


    const videoUrl = 'C:/Users/arMori/Desktop/RedditClone/reddit/public/videos';console.log('IT VideoURL',videoUrl);


    


    const selectedFile = `${videoUrl}/${fetchedData.data.VideoSource}/${seriesName}-1080p.mp4`
console.log(`ITS'S SELECTED FILE: ${selectedFile}`);


    


    Ok, I have my src 1080p, now is the time to send it to the backend :

    


    const response = await axios.post('/videoFormat', {videoUrl:selectedFile})console.log('Это консоль лог путей: ',response.data);const videoPaths = response.data;


    


    Backend takes it and FFMpqg makes two types of resolution,720p and 480p,save it to the temp storage on backend, and then returns two routes where these videos stores

    


    async videoUpload(videoUrl:string){try{const tempDir = C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp;const inputFile = videoUrl;console.log('VIDEOURL: ',videoUrl);


    


            const outputFiles = [];&#xA;        &#xA;        await this.createDirectories(tempDir);        &#xA;        outputFiles.push(await this.convertVideo(inputFile, &#x27;1280x720&#x27;, &#x27;720p.mp4&#x27;));&#xA;        outputFiles.push(await this.convertVideo(inputFile, &#x27;854x480&#x27;, &#x27;480p.mp4&#x27;));&#xA;        console.log(&#x27;OUTUPT FILES SERVICE: &#x27;,outputFiles);&#xA;        &#xA;        return outputFiles;&#xA;&#xA;    }catch(err){&#xA;        console.error(&#x27;VideoFormatterService Error: &#x27;,err);&#xA;        &#xA;    }&#xA;}&#xA;&#xA;private convertVideo(inputPath:string,resolution:string,outputFileName:string):Promise<string>{&#xA;    const temp = `C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp`;&#xA;    return new Promise(async(resolve,reject)=>{&#xA;        const height = resolution.split(&#x27;x&#x27;)[1];&#xA;        console.log(&#x27;HIEGHT: &#x27;,height);&#xA;        &#xA;        const outputDir = `C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp/${height}p`;&#xA;        const outputPath = join(outputDir, outputFileName);&#xA;        const isExists = await fs.access(outputPath).then(() => true).catch(() => false);&#xA;        if(isExists){ &#xA;            console.log(`File already exists: ${outputPath}`);&#xA;            return resolve(outputPath)&#xA;        };&#xA;        ffmpeg(inputPath)&#xA;        .size(`${resolution}`)&#xA;        .videoCodec(&#x27;libx264&#x27;) // Кодек H.264&#xA;        .audioCodec(&#x27;aac&#x27;) &#xA;        .output(outputPath)&#xA;        .on(&#x27;end&#x27;,()=>resolve(outputPath))&#xA;        .on(&#x27;error&#x27;,(err)=>reject(err))&#xA;        .run()&#xA;            &#xA;    })&#xA;}&#xA;&#xA;private async createDirectories(temp:string){&#xA;    try{&#xA;        const dir720p = `${temp}/720p`;&#xA;        const dir480p = `${temp}/480p`;&#xA;        const dir720pExists = await fs.access(dir720p).then(() => true).catch(() => false);&#xA;        const dir480pExists = await fs.access(dir480p).then(() => true).catch(() => false);&#xA;        if(dir720pExists &amp;&amp; dir480pExists){&#xA;            console.log(&#x27;FILES ALIVE&#x27;);&#xA;            return;&#xA;        }&#xA;        if (!dir720pExists) {&#xA;            await fs.mkdir(dir720p, { recursive: true });&#xA;            console.log(&#x27;Папка 720p создана&#x27;);&#xA;        }&#xA;        &#xA;        if (!dir480pExists) {&#xA;            await fs.mkdir(dir480p, { recursive: true });&#xA;            console.log(&#x27;Папка 480p создана&#x27;);&#xA;        }&#xA;    } catch (err) {&#xA;        console.error(&#x27;Ошибка при создании директорий:&#x27;, err);&#xA;    }&#xA;}&#xA;</string>

    &#xA;

    Continue frontentd code :

    &#xA;

    let videoPath;&#xA;&#xA;if (quality === &#x27;720p&#x27;) {&#xA;        videoPath = videoPaths[0];&#xA;} else if (quality === &#x27;480p&#x27;) {&#xA;        videoPath = videoPaths[1];&#xA;}&#xA;&#xA;if (!videoPath) {&#xA;        console.error(&#x27;Video path not found!&#x27;);&#xA;        return;&#xA;}&#xA;&#xA;// Получаем видео по его пути&#xA;console.log(&#x27;VIDEOPATH LOG: &#x27;,videoPath);&#xA;    &#xA;const videoRes = await axios.get(&#x27;/videoFormat/getVideo&#x27;, { &#xA;        params: { path: videoPath } ,&#xA;        headers: { Range: &#x27;bytes=0-&#x27; },&#xA;        responseType: &#x27;blob&#x27;&#xA;    });&#xA;    console.log(&#x27;Video fetched: &#x27;, videoRes);&#xA;    const videoBlob = new Blob([videoRes.data], { type: &#x27;video/mp4&#x27; });&#xA;    const videoURL = URL.createObjectURL(videoBlob);&#xA;    return videoURL;&#xA;    /* console.log(&#x27;Видео успешно загружено:&#x27;, response.data); */&#xA;    } catch (error) {&#xA;    console.error(&#x27;Ошибка при загрузке видео:&#x27;, error);&#xA;    }&#xA;}&#xA;

    &#xA;

    Here I just choose one of the route and make a new GET request (VideoRes), now in the controller in the backend, I'm trying to do a video streaming :

    &#xA;

    @Public()&#xA;    @Get(&#x27;/getVideo&#x27;)&#xA;    async getVideo(@Query(&#x27;path&#x27;) videoPath:string,@Req() req:Request,@Res() res:Response){&#xA;        try {&#xA;            console.log(&#x27;PATH ARGUMENT: &#x27;,videoPath);&#xA;            console.log(&#x27;VIDEOPATH IN SERVICE: &#x27;,videoPath);&#xA;        const videoSize = (await fs.stat(videoPath)).size;&#xA;        const CHUNK_SIZE = 10 ** 6;&#xA;        const range = req.headers[&#x27;range&#x27;] as string | undefined;&#xA;        if (!range) {&#xA;            return new ForbiddenException(&#x27;Range не найденно&#x27;);&#xA;        }&#xA;        const start = Number(range.replace(/\D/g,""));&#xA;        const end = Math.min(start &#x2B; CHUNK_SIZE,videoSize - 1);&#xA;&#xA;        const contentLength = end - start &#x2B; 1;&#xA;        const videoStream = fsSync.createReadStream(videoPath, { start, end });&#xA;        const headers = {&#xA;            &#x27;Content-Range&#x27;:`bytes ${start}-${end}/${videoSize}`,&#xA;            &#x27;Accept-Ranges&#x27;:&#x27;bytes&#x27;,&#xA;            &#x27;Content-Length&#x27;:contentLength,&#xA;            &#x27;Content-Type&#x27;:&#x27;video/mp4&#x27;&#xA;        }&#xA;        &#xA;        res.writeHead(206,headers);&#xA;&#xA;        // Передаем поток в ответ&#xA;        videoStream.pipe(res);&#xA;        &#xA;&#xA;        // Если возникнет ошибка при стриминге, логируем ошибку&#xA;        videoStream.on(&#x27;error&#x27;, (error) => {&#xA;            console.error(&#x27;Ошибка при чтении видео:&#x27;, error);&#xA;            res.status(500).send(&#x27;Ошибка при чтении видео&#x27;);&#xA;        });&#xA;        } catch (error) {&#xA;            console.error(&#x27;Ошибка при обработке запросов:&#x27;, error);&#xA;            return res.status(400).json({ message: &#x27;Ошибка при обработке getVideo запросов&#x27; });&#xA;        }&#xA;    }&#xA;

    &#xA;

    Send to the frontend

    &#xA;

    res.writeHead(206,headers);&#xA;

    &#xA;

    In the frontend, I make blob url for video src and return it

    &#xA;

    const videoBlob = new Blob([videoRes.data], { type: &#x27;video/mp4&#x27; });const videoURL = URL.createObjectURL(videoBlob);return videoURL;&#xA;

    &#xA;

    And assign src to the video :

    &#xA;

    useVideo(seriesName,quality).then(src => {&#xA;                if (src) {&#xA;                    console.log(&#x27;ITS VIDEOLOGISC GOIDA!&#x27;);&#xA;                    if(!playRef.current) return;&#xA;                    &#xA;                    const oldURL = playRef.current.src;&#xA;                    if (oldURL &amp;&amp; oldURL.startsWith(&#x27;blob:&#x27;)) {&#xA;                        URL.revokeObjectURL(oldURL);&#xA;                    }&#xA;                    playRef.current.pause();&#xA;                    playRef.current.src = &#x27;&#x27;;&#xA;                    setQuality(quality);&#xA;                    console.log(&#x27;SRC: &#x27;,src);&#xA;                    &#xA;                    playRef.current.src = src;&#xA;                    playRef.current.load();&#xA;                    console.log(&#x27;ITS VIDEOURL GOIDA!&#x27;);&#xA;                    togglePlayPause();&#xA;                }&#xA;            })&#xA;            .catch(err => console.error(&#x27;Failed to fetch video&#x27;, err));&#xA;

    &#xA;

    But the problem is :

    &#xA;

    &#xA;

    Vinland-Saga:1 Uncaught (in promise) NotSupportedError : Failed to load because no supported source was found

    &#xA;

    &#xA;

    And I don't know why...

    &#xA;

    I tried everything, but I don't understand why src is incorrect..

    &#xA;