Recherche avancée

Sur d’autres sites (3935)

• How to render or convert animation to video format ?

  29 novembre 2018, par user9964622

  I have created animation using tweenjs and createjs libraries createjs and tweenjs, now, I’d like to convert these animations to video files (MPEG4, or other, doesn’t matter) or how can I render it in the backend using nodejs ?

  I have animation looking like this : Animated

  Here is solution I have tried so far using nodejs and ffmpeg module

  var express = require('express');
  
  var cors = require('cors')
  
  var path = require('path');
  
  var app = express();
  
  var ffmpeg = require('ffmpeg');
  
  //Cors Middleware
  
  app.use(cors());
  
  // Body Parser Middleware
  
  app.use(bodyParser.json())
  
  // Port Number
  
  const port = process.env.PORT || 8000;
  
  //video processing
  
  
  
  try {
  
      var process = new ffmpeg('/path/to/your_movie.mp4');
  
      process.then(function (video) {
  
  
  
          video
  
          .setVideoSize('640x?', true, true, '#fff')
  
          .audioCodec('libmp3lame')
  
          .videoCodec('libx264')
  
          .setAudioCodec('libfaac')
  
          .setAudioChannels(2)
  
          .save('/path/to/save/your_movie.mp4', function (error, file) {
  
              if (!error)
  
                  console.log('Video file: ' + file);
  
          });
  
  
  
      }, function (err) {
  
          console.log('Error: ' + err);
  
      });
  
  } catch (e) {
  
      console.log(e.code);
  
  
  
  
  
  
  
  app.use('/video', video);
  
  app.get('/', (req, res) => {
  
    res.send('invaild endpoint');
  
  });
  
  
  
  app.get('*', (req, res) => {
  
    res.sendFile(path.join(__dirname + '/video-client/dist/video-client/index.html'));
  
  });
  
  
  
  // Start Server
  
  app.listen(port, () => {
  
    console.log('Server started on port '+port);
  
  });

  Here is sample of what I am trying to archive check this website logo animation , in this website as u can see when u click preview u can see the message that waits for its rendering after finish rendering it gives the option to download the rendered video file, on my side I am able to create animation but am not able to render it so that it can convert to video format .

  I am new to nodejs and backend stuff in general, unfortunately, my solution does not work so far, and I am stuck. I need help

  Is this the right way to create video from animation if not what is the best way ? ,

  please help, any suggestion or tutorials will be appreciated, thanks

• record video from website using puppeteer + ffmpeg

  8 novembre 2020, par rudolfninja

  I'm trying to record video from website using the way similar to puppeteer-recorder, but I want to stop recording by myself and then save it to file (after I stopped it). I wrote simple web service for this purpose :

  


  var express = require('express');
var app = express();
const { spawn } = require('child_process');
const puppeteer = require('puppeteer');
var record = true;


app.get('/startRecord', function (req, res)
{
const frun_record = async () => {
    console.log("Start recording");
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto('http://worldfoodclock.com/', { waitUntil: 'networkidle2' });
    var ffmpegPath = 'ffmpeg';
    var fps = 60;

    var outFile = 'E:\\Code\\video-record\\output.webm';

    const args = ffmpegArgs(fps);

    args.push(outFile);

    const ffmpeg = spawn(ffmpegPath, args);

    const closed = new Promise((resolve, reject) => {
        ffmpeg.on('error', reject);
        ffmpeg.on('close', resolve);
    });

    console.log("Entering loop");

    while (record) {
        let screenshot = await page.screenshot({ omitBackground: true });
        await write(ffmpeg.stdin, screenshot);
    }
    ffmpeg.stdin.end();
    console.log("Recording stopped");
    await closed;
};
frun_record();
res.end( "starting recording" );
})

app.get('/stopRecord', function (req, res) {
 record = false;
 res.end( "stopped" );
})

const ffmpegArgs = fps => [
  '-y',
  '-f',
  'image2pipe',
  '-r',
  `${+fps}`,
  '-i',
  '-',
  '-c:v',
  'libvpx',
  '-auto-alt-ref',
  '0',
  '-pix_fmt',
  'yuva420p',
  '-metadata:s:v:0',
  'alpha_mode="1"'
];

const write = (stream, buffer) =>
    new Promise((resolve, reject) => {
        stream.write(buffer, error => {
            if (error) reject(error);
            else resolve();
        });
    });

var server = app.listen(8081, function () {
var host = server.address().address
var port = server.address().port
console.log("Example app listening at http://%s:%s", host, port)
})


  


  But it always record only 1 second video, looks like stream is just overwritten. I tried just save screenshots on disk and it was more than 1 second of video.
So the main question is how to put all the screenshots into the stream and then save it on disk ? And another thing I'd like to know is what the frequency of taking screenshots from web page ?

  


• Livestream screen capture to frontend website with low latency [closed]

  3 juin 2021, par Eddie Huang

  for a project I want to livestream my desktop on my Ubuntu server onto the frontend website (running on the same server using Node/Express).

  


  It would be the same effect as livestreaming with OBS/ffmpeg to Youtube/Twitch and embedding into my own website.&#xA;It has to be low latency (<1 second)

  &#xA;

  Could anyone point me in what protocols/applications/tutorials to use as an outline ?

  &#xA;