Recherche avancée
Médias (1)
-
The pirate bay depuis la Belgique
1er avril 2013, par
Mis à jour : Avril 2013
Langue : français
Type : Image
Autres articles (78)
-
Participer à sa traduction
10 avril 2011Vous 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 (...) -
MediaSPIP v0.2
21 juin 2013, parMediaSPIP 0.2 est la première version de MediaSPIP stable.
Sa date de sortie officielle est le 21 juin 2013 et est annoncée ici.
Le fichier zip ici présent contient uniquement les sources de MediaSPIP en version standalone.
Comme pour la version précédente, il est nécessaire d’installer manuellement l’ensemble des dépendances logicielles sur le serveur.
Si vous souhaitez utiliser cette archive pour une installation en mode ferme, il vous faudra également procéder à d’autres modifications (...) -
Mise à disposition des fichiers
14 avril 2011, parPar défaut, lors de son initialisation, MediaSPIP ne permet pas aux visiteurs de télécharger les fichiers qu’ils soient originaux ou le résultat de leur transformation ou encodage. Il permet uniquement de les visualiser.
Cependant, il est possible et facile d’autoriser les visiteurs à avoir accès à ces documents et ce sous différentes formes.
Tout cela se passe dans la page de configuration du squelette. Il vous faut aller dans l’espace d’administration du canal, et choisir dans la navigation (...)
Sur d’autres sites (16151)
-
why do andorid camera and gopros not use b-frames ?
26 août 2021, par Photo_SurveyI am using ffmpeg to extract the gop-structure of videos, which I recorded with my Smartphone (Samsung Galaxy A51) and my GoPro (Hero 7 Black).
The gop-structures I get all look like this : IPPPPPPPPPPPPPP. The videos of the different devices only differ in the number of P-Frame per gop-structure. The ffmpeg code I used fpr this is the following :


ffprobe -show_frames inputvideo.mp4 -print_format json
Now my question is why the encoders of both devices don't use B-Frames ? Is is it because the encoding of B-Frames is more complicated for the Hardwar or something like this ?

-
Audio lag in Ffmpeg on Android 360P vide capture after 30 minutes
15 août 2019, par Jagadish ChannagiriWe are currently run video capture on Android Samsung S9 and few other Android devices, FFmpeg version 4.0.1, Javacversion 1.4.2, Android minSdkVersion 21, and compileSdkVersion 28. After 30 minutes or so, between the range 33 - 36 minutes, the audio lags video. I really do not understand why this happens. Any ideas or suggestions would be highly appreciated.
-
RTSP to HLS via FFMPEG, latency issues
28 juin 2024, par Pabl0The following are all the steps that I took to render a RTSP stream in my web app :


How to display RTSP stream in browser using HLS


Situation and Problem
You have an RTSP stream that you want to display in a browser using HLS (HTTP Live Streaming). However, when you try to play the RTSP stream in the browser using hls.js, you encounter the error "Unsupported HEVC in M2TS found." This error indicates that the HLS stream uses the HEVC (H.265) codec, which is not widely supported by many browsers and HLS players, including hls.js.


The most reliable solution is to transcode the stream from H.265 to H.264 using FFmpeg, which is more broadly supported. Here's how to transcode the stream :


Step 1 : Transcode the Stream Using FFmpeg


Run the following FFmpeg command to transcode the RTSP stream from H.265 to H.264 and generate the HLS segments :


ffmpeg -i rtsp://192.168.144.25:8554/main.264 -c:v libx264 -c:a aac -strict -2 -hls_time 10 -hls_list_size 0 -f hls C:\path\to\output\index.m3u8


c:v libx264 sets the video codec to H.264.


c:a aac sets the audio codec to AAC.


hls_time 10 sets the duration of each segment to 10 seconds.


hls_list_size 0 tells FFmpeg to include all segments in the playlist.


f hls specifies the output format as HLS.


C :\path\to\output\ is the directory where the HLS files will be saved. Ensure that C :\path\to\output\ is the directory where you want to save the HLS files.


Step 2 : Verify the HLS Files


After running the FFmpeg command, verify that the following files are generated in the output directory :


index.m3u8 (HLS playlist file)


Multiple .ts segment files (e.g., index0.ts, index1.ts, etc.)


Step 3 : Serve the HLS Files with an HTTP Server


Navigate to the directory containing the HLS files and start the HTTP server :


cd C :\path\to\output
python -m http.server 8000
Step 4 : Update and Test the HTML File
Ensure that hls_test.html file is in the same directory as the HLS files and update it as needed :


hls_test.html :




 
 
 
 
 
 
 <h1>HLS Stream Test</h1>
 <button>Play Stream</button>
 <video controls="controls" style="width: 100%; height: auto;"></video>
 <code class="echappe-js"><script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script>&#xA; document&#xA; .getElementById(&#x27;playButton&#x27;)&#xA; .addEventListener(&#x27;click&#x27;, () => {&#xA; const video = document.getElementById(&#x27;video&#x27;);&#xA; if (Hls.isSupported()) {&#xA; const hls = new Hls();&#xA; hls.loadSource(&#x27;http://localhost:8000/index.m3u8&#x27;);&#xA; hls.attachMedia(video);&#xA; hls.on(Hls.Events.MANIFEST_PARSED, function () {&#xA; video.play().catch((error) => {&#xA; console.error(&#xA; &#x27;Error attempting to play:&#x27;,&#xA; error,&#xA; );&#xA; });&#xA; });&#xA; hls.on(Hls.Events.ERROR, function (event, data) {&#xA; console.error(&#x27;HLS Error:&#x27;, data);&#xA; });&#xA; } else if (&#xA; video.canPlayType(&#x27;application/vnd.apple.mpegurl&#x27;)&#xA; ) {&#xA; video.src = &#x27;http://localhost:8000/index.m3u8&#x27;;&#xA; video.addEventListener(&#x27;canplay&#x27;, function () {&#xA; video.play().catch((error) => {&#xA; console.error(&#xA; &#x27;Error attempting to play:&#x27;,&#xA; error,&#xA; );&#xA; });&#xA; });&#xA; } else {&#xA; console.error(&#x27;HLS not supported in this browser.&#x27;);&#xA; }&#xA; });&#xA; </script>
 



Step 5 : Open the HTML File in Your Browser


Open your browser and navigate to :


http://localhost:8000/hls_test.html


Click the "Play Stream" button to start playing the HLS stream. If everything is set up correctly, you should see the video playing in the browser.


Conclusion


By transcoding the RTSP stream from H.265 to H.264 and serving it as an HLS stream, you can display the video in a browser using hls.js. This approach ensures broader compatibility with browsers and HLS players, allowing you to stream video content seamlessly.


PART 2 : Add this method to the react app


We are assuming that the ffmpeg command is running in the background and generating the HLS stream. Now, we will create a React component that plays the HLS stream in the browser using the video.js library.


If not, please refer to the previous steps to generate the HLS stream using FFmpeg. (steps 1-3 of the previous section)


Step 1 : Create the Camera Component


import { useRef } from 'react';
import videojs from 'video.js';
import 'video.js/dist/video-js.css';

const Camera = ({ streamUrl }) => {
 const videoRef = useRef(null);
 const playerRef = useRef(null);

 const handlePlayClick = () => {
 const videoElement = videoRef.current;
 if (videoElement) {
 playerRef.current = videojs(videoElement, {
 controls: true,
 autoplay: false,
 preload: 'auto',
 sources: [
 {
 src: streamUrl,
 type: 'application/x-mpegURL',
 },
 ],
 });

 playerRef.current.on('error', () => {
 const error = playerRef.current.error();
 console.error('VideoJS Error:', error);
 });

 playerRef.current.play().catch((error) => {
 console.error('Error attempting to play:', error);
 });
 }
 };

 return (
 
 <button>Play Stream</button>
 
 
 );
};

export default Camera;


Note : This component uses the video.js library to play the HLS stream. Make sure to install video.js using npm or yarn :


npm install video.js

Step 2 : Use the Camera Component in Your App


Now, you can use the Camera component in your React app to display the HLS stream. Here's an example of how to use the Camera component :


<camera streamurl="http://localhost:8000/index.m3u8"></camera>

Note : see we are pointing to the HLS stream URL generated by FFmpeg in the previous steps.


Step 3 : Create the Cors Proxy Server and place it where the HLS files are being stored.


from http.server import HTTPServer, SimpleHTTPRequestHandler
import socketserver
import os

class CORSRequestHandler(SimpleHTTPRequestHandler):
 def end_headers(self):
 if self.path.endswith('.m3u8'):
 self.send_header('Content-Type', 'application/vnd.apple.mpegurl')
 elif self.path.endswith('.ts'):
 self.send_header('Content-Type', 'video/MP2T')
 super().end_headers()

if __name__ == '__main__':
 port = 8000
 handler = CORSRequestHandler
 web_dir = r'C:\Video_cam_usv'
 os.chdir(web_dir)
 httpd = socketserver.TCPServer(('', port), handler)
 print(f"Serving HTTP on port {port}")
 httpd.serve_forever()


Note : Change the web_dir to the directory where the HLS files are stored.


Also, note that the server is sending the correct MIME types for .m3u8 and .ts files. For example :


.m3u8 should be application/vnd.apple.mpegurl or application/x-mpegURL.
.ts should be video/MP2T.


Step 4 : Start the CORS Proxy Server


Open a terminal, navigate to the directory where the CORS proxy server script is located (same as the HLS files are being saved), and run the following command :


python cors_proxy_server.py


This will start the CORS proxy server on port 8000 and serve the HLS files with the correct MIME types.


Step 5 : Start the React App
Start your React app using the following command :


npm run dev

I have tried everything above (it´s my own doc to keep with the steps Ive taken so far) and I get the stream to render on my web app but the latency is very high, at least of 5-10 secs, how can i make it be real time or close to that ?


Syndiquer tout le site
