Recherche avancée
Médias (2)
-
SPIP - plugins - embed code - Exemple
2 septembre 2013, par
Mis à jour : Septembre 2013
Langue : français
Type : Image
-
Publier une image simplement
13 avril 2011, par ,
Mis à jour : Février 2012
Langue : français
Type : Video
Autres articles (105)
-
Personnaliser en ajoutant son logo, sa bannière ou son image de fond
5 septembre 2013, parCertains thèmes prennent en compte trois éléments de personnalisation : l’ajout d’un logo ; l’ajout d’une bannière l’ajout d’une image de fond ;
-
Ecrire une actualité
21 juin 2013, parPrésentez les changements dans votre MédiaSPIP ou les actualités de vos projets sur votre MédiaSPIP grâce à la rubrique actualités.
Dans le thème par défaut spipeo de MédiaSPIP, les actualités sont affichées en bas de la page principale sous les éditoriaux.
Vous pouvez personnaliser le formulaire de création d’une actualité.
Formulaire de création d’une actualité Dans le cas d’un document de type actualité, les champs proposés par défaut sont : Date de publication ( personnaliser la date de publication ) (...) -
Publier sur MédiaSpip
13 juin 2013Puis-je poster des contenus à partir d’une tablette Ipad ?
Oui, si votre Médiaspip installé est à la version 0.2 ou supérieure. Contacter au besoin l’administrateur de votre MédiaSpip pour le savoir
Sur d’autres sites (12767)
-
Can't play mp4 video using html5 video tag
7 août 2020, par John DoeI am trying to present an mp4 video (h264) using html5 :


<video width="320" controls="controls">
 <source src="/home/nabil/FWork/hikvision/ch01_00000100068000101.mp4" type="video/mp4">
</source></video>


analyzing video codec with ffmpeg gives the following :


ffprobe ch01_00000100068000101.mp4 
ffprobe version 2.8.17-0ubuntu0.1 Copyright (c) 2007-2020 the FFmpeg developers
 built with gcc 5.4.0 (Ubuntu 5.4.0-6ubuntu1~16.04.12) 20160609
 configuration: --prefix=/usr --extra-version=0ubuntu0.1 --build-suffix=-ffmpeg --toolchain=hardened --libdir=/usr/lib/x86_64-linux-gnu --incdir=/usr/include/x86_64-linux-gnu --cc=cc --cxx=g++ --enable-gpl --enable-shared --disable-stripping --disable-decoder=libopenjpeg --disable-decoder=libschroedinger --enable-avresample --enable-avisynth --enable-gnutls --enable-ladspa --enable-libass --enable-libbluray --enable-libbs2b --enable-libcaca --enable-libcdio --enable-libflite --enable-libfontconfig --enable-libfreetype --enable-libfribidi --enable-libgme --enable-libgsm --enable-libmodplug --enable-libmp3lame --enable-libopenjpeg --enable-libopus --enable-libpulse --enable-librtmp --enable-libschroedinger --enable-libshine --enable-libsnappy --enable-libsoxr --enable-libspeex --enable-libssh --enable-libtheora --enable-libtwolame --enable-libvorbis --enable-libvpx --enable-libwavpack --enable-libwebp --enable-libx265 --enable-libxvid --enable-libzvbi --enable-openal --enable-opengl --enable-x11grab --enable-libdc1394 --enable-libiec61883 --enable-libzmq --enable-frei0r --enable-libx264 --enable-libopencv
 libavutil 54. 31.100 / 54. 31.100
 libavcodec 56. 60.100 / 56. 60.100
 libavformat 56. 40.101 / 56. 40.101
 libavdevice 56. 4.100 / 56. 4.100
 libavfilter 5. 40.101 / 5. 40.101
 libavresample 2. 1. 0 / 2. 1. 0
 libswscale 3. 1.101 / 3. 1.101
 libswresample 1. 2.101 / 1. 2.101
 libpostproc 53. 3.100 / 53. 3.100
Invalid UE golomb code
 Last message repeated 3 times
Input #0, mpeg, from 'ch01_00000100068000101.mp4':
 Duration: 00:09:27.33, start: 35024.106667, bitrate: 507 kb/s
 Stream #0:0[0x1e0]: Video: h264 (Baseline), yuv420p, 1280x720, 10 fps, 10 tbr, 90k tbn, 20 tbc


a possible relevant detail is that playing the video using ubuntu's default video reader (ffmpeg in the background) doesn't show any video controls


-
Fighting with the VP8 Spec
4 juin 2010, par Multimedia Mike — VP8As stated in a previous blog post on the matter, FFmpeg’s policy is to reimplement codecs rather than adopt other codebases wholesale. And so it is with Google’s recently open sourced VP8 codec, the video portion of their Webm initiative. I happen to know that the new FFmpeg implementation is in the capable hands of several of my co-developers so I’m not even worrying about that angle.
Instead, I thought of another of my characteristically useless exercises : Create an independent VP8 decoder implementation entirely in pure Python. Silly ? Perhaps. But it has one very practical application : By attempting to write a new decoder based on the official bitstream documentation, this could serve as a mechanism for validating said spec, something near and dear to my heart.
What is the current state of the spec ? Let me reiterate that I’m glad it exists. As I stated during the initial open sourcing event, everything that Google produced for the initial event went well beyond my wildest expectations. Having said that, the documentation does fall short in a number of places. Fortunately, I am on the Webm mailing lists and am sending in corrections and ideas for general improvement. For the most part, I have been able to understand the general ideas behind the decoding flow based on the spec and am even able to implement certain pieces correctly. Then I usually instrument the libvpx source code with output statements in order to validate that I’m doing everything right.
Token Blocker
Unfortunately, I’m quite blocked right now on the chapter regarding token/DCT coefficient decoding (chapter 13 in the current document iteration). In his seminal critique of the codec, Dark Shikari complained that large segments of the spec are just C code fragments copy and pasted from the official production decoder. As annoying as that is, the biggest insult comes at the end of section 13.3 :While we have in fact completely described the coefficient decoding procedure, the reader will probably find it helpful to consult the reference implementation, which can be found in the file detokenize.c.
The reader most certainly will not find it helpful to consult the file detokenize.c. The file in question implements the coefficient residual decoding with an unholy sequence of C macros that contain goto statements. Honestly, I thought I did understand the coefficient decoding procedure based on the spec’s description. But my numbers don’t match up with the official decoder. Instrumenting or tracing macro’d code is obviously painful and studying the same code is making me think I don’t understand the procedure after all. To be fair, entropy decoding often occupies a lot of CPU time for many video decoders and I have little doubt that the macro/goto approach is much faster than clearer, more readable methods. It’s just highly inappropriate to refer to it for pedagogical purposes.
Aside : For comparison, check out the reference implementation for the VC-1 codec. It was written so clearly and naively that the implementors used an O(n) Huffman decoder. That’s commitment to clarity.
I wonder if my FFmpeg cohorts are having better luck with the DCT residue decoding in their new libavcodec implementation ? Maybe if I can get this Python decoder working, it can serve as a more appropriate reference decoder.
Update : Almost immediately after I posted this entry, I figured out a big problem that was holding me back, and then several more small ones, and finally decoded by first correct DCT coefficient from the stream (I’ve never been so happy to see the number -448). I might be back on track now. Even better was realizing that my original understanding of the spec was correct.
Unrelated
I found this image on the Doom9 forums. I ROFL’d :
It’s probably unfair and inaccurate but you have to admit it’s funny. Luckily, quality nitpickings aren’t my department. I’m just interested in getting codecs working, tested, and documented so that more people can use them reliably.
-
HLS video not playing in Angular using Hls.js
5 avril 2023, par Jose A. MataránI am trying to play an HLS video using Hls.js in an Angular component. Here is the component code :


import { Component, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
import Hls from 'hls.js';

@Component({
 selector: 'app-ver-recurso',
 templateUrl: './ver-recurso.component.html',
 styleUrls: ['./ver-recurso.component.css']
})
export class VerRecursoComponent implements AfterViewInit {
 @ViewChild('videoPlayer') videoPlayer!: ElementRef<htmlvideoelement>;
 hls!: Hls;

 ngAfterViewInit(): void {
 this.hls = new Hls();

 const video = this.videoPlayer.nativeElement;
 const watermarkText = 'MARCA_DE_AGUA';

 this.hls.on(Hls.Events.MEDIA_ATTACHED, () => {
 this.hls.loadSource(`http://localhost:8080/video/playlist.m3u8?watermarkText=${encodeURIComponent(watermarkText)}`);
 });

 this.hls.attachMedia(video);
 }

 loadVideo() {
 const watermarkText = 'Marca de agua personalizada';
 const video = this.videoPlayer.nativeElement;
 const hlsBaseUrl = 'http://localhost:8080/video';

 if (Hls.isSupported()) {
 this.hls.loadSource(`${hlsBaseUrl}/playlist.m3u8?watermarkText=${encodeURIComponent(watermarkText)}`);
 this.hls.attachMedia(video);
 this.hls.on(Hls.Events.MANIFEST_PARSED, () => {
 video.play();
 });
 } else if (video.canPlayType('application/vnd.apple.mpegurl')) {
 video.src = `${hlsBaseUrl}/playlist.m3u8?watermarkText=${encodeURIComponent(watermarkText)}`;
 video.addEventListener('loadedmetadata', () => {
 video.play();
 });
 }
 }
}
</htmlvideoelement>

I'm not sure what's going wrong, as the requests to the playlist and the segments seem to be working correctly, but the video never plays. Is there anything obvious that I'm missing here ?


On the backend side, I have a Spring Boot application that generates and returns the playlist file, as you can see.


@RestController
public class VideoController {
 @Autowired
 private VideoService videoService;

 @GetMapping("/video/{segmentFilename}")
 public ResponseEntity<resource> getHlsVideoSegment(@PathVariable String segmentFilename, @RequestParam String watermarkText) {
 String inputVideoPath = "/Users/jose/PROYECTOS/VARIOS/oposhield/oposhield-back/repo/202204M-20230111.mp4";
 String hlsOutputPath = "/Users/jose/PROYECTOS/VARIOS/oposhield/oposhield-back/repo/temporal";
 String segmentPath = Paths.get(hlsOutputPath, segmentFilename).toString();

 if (!Files.exists(Paths.get(hlsOutputPath, "playlist.m3u8"))) {
 videoService.generateHlsStream(inputVideoPath, watermarkText, hlsOutputPath);
 }

 // Espera a que esté disponible el segmento de video necesario.
 while (!Files.exists(Paths.get(segmentPath))) {
 try {
 Thread.sleep(1000);
 } catch (InterruptedException e) {
 e.printStackTrace();
 }
 }

 Resource resource;
 try {
 resource = new UrlResource(Paths.get(segmentPath).toUri());
 } catch (Exception e) {
 return ResponseEntity.badRequest().build();
 }

 return ResponseEntity.ok()
 .contentType(MediaType.parseMediaType("application/vnd.apple.mpegurl"))
 .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + resource.getFilename() + "\"")
 .body(resource);
 }

 @GetMapping("/video/{segmentFilename}.ts")
 public ResponseEntity<resource> getHlsVideoTsSegment(@PathVariable String segmentFilename) {
 String hlsOutputPath = "/Users/jose/PROYECTOS/VARIOS/oposhield/oposhield-back/repo/temporal";
 String segmentPath = Paths.get(hlsOutputPath, segmentFilename + ".ts").toString();

 // Espera a que esté disponible el segmento de video necesario.
 while (!Files.exists(Paths.get(segmentPath))) {
 try {
 Thread.sleep(1000);
 } catch (InterruptedException e) {
 e.printStackTrace();
 }
 }

 Resource resource;
 try {
 resource = new UrlResource(Paths.get(segmentPath).toUri());
 } catch (Exception e) {
 return ResponseEntity.badRequest().build();
 }

 return ResponseEntity.ok()
 .contentType(MediaType.parseMediaType("video/mp2t"))
 .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + resource.getFilename() + "\"")
 .body(resource);
 }
</resource></resource>

package dev.mataran.oposhieldback.service;


import org.springframework.stereotype.Service;

import java.io.BufferedReader;
import java.io.InputStreamReader;

import java.util.concurrent.ExecutorService;
import java.util.concurrent.Executors;

@Service
public class VideoService {
 private Process process;
 private ExecutorService executorService = Executors.newSingleThreadExecutor();

 public void generateHlsStream(String inputVideoPath, String watermarkText, String outputPath) {
 Runnable task = () -> {
 try {
 if (process != null) {
 process.destroy();
 }

 String hlsOutputFile = outputPath + "/playlist.m3u8";
 String command = String.format("ffmpeg -i %s -vf drawtext=text='%s':x=10:y=10:fontsize=24:fontcolor=white -codec:v libx264 -crf 21 -preset veryfast -g 50 -sc_threshold 0 -map 0 -flags -global_header -hls_time 4 -hls_list_size 0 -hls_flags delete_segments+append_list -f hls %s", inputVideoPath, watermarkText, hlsOutputFile);
 process = Runtime.getRuntime().exec(command);
 BufferedReader reader = new BufferedReader(new InputStreamReader(process.getErrorStream()));
 String line;
 while ((line = reader.readLine()) != null) {
 System.out.println(line);
 }
 } catch (Exception e) {
 e.printStackTrace();
 }
 };
 executorService.submit(task);
 }
}


Syndiquer tout le site
