Recherche avancée
Médias (1)
-
Publier une image simplement
13 avril 2011, par ,
Mis à jour : Février 2012
Langue : français
Type : Video
Autres articles (70)
-
Mise à jour de la version 0.1 vers 0.2
24 juin 2013, parExplications des différents changements notables lors du passage de la version 0.1 de MediaSPIP à la version 0.3. Quelles sont les nouveautés
Au niveau des dépendances logicielles Utilisation des dernières versions de FFMpeg (>= v1.2.1) ; Installation des dépendances pour Smush ; Installation de MediaInfo et FFprobe pour la récupération des métadonnées ; On n’utilise plus ffmpeg2theora ; On n’installe plus flvtool2 au profit de flvtool++ ; On n’installe plus ffmpeg-php qui n’est plus maintenu au (...) -
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 ) (...)
Sur d’autres sites (10796)
-
avcodec/mediacodec : Add VP8 encoder
19 avril 2023, par Samuel Miraavcodec/mediacodec : Add VP8 encoder
Connected FFmpeg to Mediacodec VP8 encoder.
Signed-off-by : Samuel Mira <samuel.mira@qt.io>
Signed-off-by : Zhao Zhili <zhilizhao@tencent.com> -
avcodec/mediacodec : Add AV1 encoder
25 avril 2023, par Samuel Miraavcodec/mediacodec : Add AV1 encoder
Connected FFmpeg to Mediacodec AV1 encoder
Signed-off-by : Samuel Mira <samuel.mira@qt.io>
Signed-off-by : Zhao Zhili <zhilizhao@tencent.com> -
html display video file binary buffer
15 mai 2022, par MartinI am working on an example of ffmpeg-wasm which will accept 3 files as input [song1.mp3, song2.mp3, image.png] and combine them into a video file [cool-output-video.mkv] which I want to be displayed as a playable video for the user in the html webpage.


https://github.com/MartinBarker/ffmpeg-wasm-node


My code is hosted in the above repo, right now I have a placeholder video element, which I want to change to the finished video after the user uploads the 3 files and clicks the render button.




inside server.js, I have the route
app.post('/render', which will render the video using ffmpeg, and return the video using the lineres.end(Buffer.from(outputData, 'binary'));

outputData = ffmpeg.FS('readFile', outputFileName);
 ffmpeg.FS('unlink', outputFileName);

 res.writeHead(200, {
 'Content-Type': 'image/png',
 'Content-Disposition': `attachment;filename=${outputFileName}`,
 'Content-Length': outputData.length
 });
 //res.end(btoa(Buffer.from(outputData, 'binary')));
 //res.end(outputData)
 res.end(Buffer.from(outputData, 'binary'));


I can see in my node server console log that the ffmpeg command finished and successfully renders the mkv video file




and inside client.js is where my code recieves the binary buffer for my outputted video file, and tries to make it appear on the webpage by changing the src attribute for the html video element, but no matter what code I try, I cant get the video file to appear on the html page


<video width="320" height="240" controls="controls">
 <source src="" type="video/mp4">
 Your browser does not support the video tag.
 </source></video>
...

const mp4source = document.querySelector('#mp4source')

...

 console.log('call renderVideo()')
 const renderResult = await renderVideo(files);
 console.log('renderVideo() finished. renderResult=',renderResult)
 mp4source.src = renderResult


I can see in my html file in my chrome webpage devtools console, that data is being returned and gets printed out, I'm just not sure how to handle this string data for my video file to make it appear on the webpage :


renderVideo() finished. renderResult= data:image/png;base64,GkXfo6NChoEBQveBAULygQRC84EIQoKIbWF0cm9za2FCh4EEQoWBAhhTgGcBAAAAC0APWxFNm3TCv4T+wiwATbuLU6uEFUmpZlOsgaFNu4tTq4QWVK5rU6yB8U27jFOrhBJUw2dTrIIB1E27jlOrhBxTu2tTrIQLQA797AEAAAAAAABRAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFUmpZsu/hLA0O5Qq17GDD0JATYCNTGF2ZjU4LjQ1LjEwMFdBjUxhdmY1OC40NS4xMDBzpJAgTn1WHXX52GUlw+lW90wkRImIQRzeoAAAAAAWVK5rQN2/hEsGuLSuAQAAAAAAAD3XgQFzxYjtk28iSHTlJJyBACK1nIN1bmSGj............. long text was truncated etc




EDIT changed my ffmpeg command to export an mp4 video, changed header to be video/mp4, and verified it is getting added to the html src element but the video still does not appear




Syndiquer tout le site
