#ffmpeg

Next.js 에서 fluent-ffmpeg 사용 시 에러 해결 가능할까요?

Next.js 에서 puppeteer를 사용해서 특정 url에 접속하여 애니메이션을 png로 100장 정도 캡처하여 생성하고, fluent-ffmpeg를 사용해서 해당 png 이미지들을 mp4 영상으로 만들려고 하는데요. yarn add puppeteer fluent-ffmpeg @ffmpeg-installer/ffmpeg yarn add --dev @types/fluent-ffmpeg 위와 같이 라이브러리들을 설치했구요. 아래 page.tsx 파일에서 코드를 구현했는데요. dev로 실행해서 해당 페이지에 접속을 하면 아래와 같은 에러가 발생하는데요. 해결이 가능할까요?? 다른 라이브러리를 써야할지 구현한 코드가 문제가 있는지 모르겠네요. 도움 부탁드립니다!! # 에러 코드 # 1 of 1 error Next.js (14.2.3) Server Error Error: Cannot find module '/Users/.../animation-capture/node_modules/@ffmpeg-installer/darwin-arm64/package.json' This error happened while generating the page. Any console logs will be displayed in the terminal window. Call Stack webpackEmptyContext file:///Users/.../animation-capture/.next/server/app/capture/page.js (22:10) eval node_modules/@ffmpeg-installer/ffmpeg/index.js (40:27) (rsc)/./node_modules/@ffmpeg-installer/ffmpeg/index.js file:///Users/.../animation-capture/.next/server/vendor-chunks/@ffmpeg-installer.js (20:1) Next.js eval /./src/app/capture/page.tsx (rsc)/./src/app/capture/page.tsx file:///Users/.../animation-capture/.next/server/app/capture/page.js (286:1) Next.js # 코드 구현부 # import { NextApiRequest, NextApiResponse } from 'next'; import puppeteer from 'puppeteer'; import fs from 'fs'; import path from 'path'; import ffmpeg from 'fluent-ffmpeg'; import ffmpegInstaller from '@ffmpeg-installer/ffmpeg'; ffmpeg.setFfmpegPath(ffmpegInstaller.path); .... 중략.... const outputFilePath = path.resolve("./screenshots/video.mp4"); ffmpeg() .addInput(`${folderPath}/screenshot-%d.png`) .inputFPS(10) .output(outputFilePath) .on("end", () => { res.status(200).send(`Video created successfully at ${outputFilePath}`); }) .on("error", (err) => { console.error("Error generating video:", err); res.status(500).send("Failed to generate video"); }) .run(); } catch (error) { console.error("Error capturing screenshots:", error); res.status(500).send("Failed to capture screenshots"); }

프론트엔드에서 업로드 동영상 된 프레임(fps) 정보 확인하는 법 있나요?

동영상 업로드 후 동영상 이동 버튼에 프레임 단위로 이동하는 버튼을 만들고자 합니다. 그래서 동영상 업로드 이후 24fps 29.97fps 이렇게 추출해서 1/24 1/29.97 이동 버튼으로 1프레임 단위씩 이동하는 것이 목표입니다. 지금 생각 중인 방법은 3가지 입니다. 1. FFmpeg.js 으로 프론트엔드에서 처리 하는 방법 2. 동영상을 백엔드 서버에 전송 후 백엔드 서버에서 로직 처리 후 정확한 값(fps) 요청해서 받아 오는 방법 3. js코드 근사치에 가까운 값 추출해서 사용하기 (정확도 너무 낮습니다. 24fps 인데 추출 결과 10fps, 29.97fps의 경우 17fps)

파일 변환 및 전송에 대한 질문입니다.

영상파일을 서버 - aws s3로 저장하는 로직을 구현중입니다. 서버단에서 영상파일에 대한 편집작업을 한 다음 s3에 원본과 같이 저장시키는 것이 계획이었습니다. 서버에서 ffmpeg, fluent-ffmpeg를 이용한 변환작업은 다음과 같습니다. - 영상 watermark 작업 - hls를 위한 .m3u8파일 변환 작업 - 썸네일 생성 작업(.ts파일의 0초대를 썸네일 및 미리보기로 생성)- 이부분은 테스트중입니다. s3 url을 요청하여 영상파일을 실행시키는 계획을 생각했고 이는 로컬에서 성공했습니다. ec2서버에 배포한다음 위 과정을 실행해보니 변환과정에서 서버단 부하가 너무 심해서 변환하는 시간이 너무길거나 서버가 다운되는 이슈가 생겼습니다. ec2성능 자체를 올리고 업로드 용량 제한도 다시 설정할 계획이나 여전히 많은 유저가 이 기능을 사용할 경우 서버가 견디지 못할 가능성이 있다고 생각합니다. 지금 생각해보고 있는 대안은 두가지입니다. 대안 1: aws mediaConverter를 이용해 변환한다. 1. 원본 영상을 버킷a로 보낸다. 2. 람다 트리거를 이용해 aws mediaConverter로 변환요청을 보낸다. 3. 변환한 영상을 버킷 b에 저장한다. 4. 클라이언트에서 버킷 b에서 cloudFront를 통해 요청한다. 대안 2: 업로드 전용 ec2를 생성하여 따로 변환한다.(처음 계획했던 과정에 ec2를 새로 생성, 성능 고도화하기) mediaConverter의 영상변환에 필요한 작업 생성(또는 작업 프리셋 생성)이 너무 어려웠던 기억이 있어 ffmpeg를 이용할 생각을 하였는데 영상변환에 너무 많은 리소스가 들어간다는 생각을 못했습니다. 영상 변환 및 업로드 작업을 경험해본 분들이 있다면 좋은 공유를 받고싶습니다.

FFMPEG를 활용한 영상 편집이 가능한 플랫폼 개발 환경

FFMPEG를 활용한 영상 편집이 가능한 플랫폼 개발 환경 FFMPEG를 이용하여 영상을 편집할 수 있는 플랫폼을 개발할 예정입니다. 참고는 RUNWAY 입니다. 개발 환경은 NODE.JS + PYTHON - FFMPEG DJANGO + PYTHON - FFMPEG C(RUST) - FFMPEG 정도인 것 같아요. AI 기능도 연동될 테니 한 언어로 개발하면 좋을 것 같아요. 4K 편집이라 너무 무거워서 속도 차이가 걱정이거든요. 별로 상관없나요? 조언 좀 부탁드려요 아직 개발전입니다.

FFMPEG 를 사용해서 영상편집 가능한 플랫폼 개발을 하려는데요..

말그대로 플랫폼을 개발하려고 하는데 프론트는 리엑트를 사용할 예정입니다. 영상편집 기능에 AI관련 기술도 붙을 예정이라 PYTHON을 희망하는데 PYTHON으로 한다고하면 NODE나 DJANGO를 배워야 하는데 장고는 레퍼런스가 없고 노드와 파이썬을 둘다 배우기에는 시간적 여유가 부족하지 않을가 싶기도 합니다. C로 한다면 C만 배우겠지만 요즘 사용하는곳이 적어서 유지 보수가 나중에 힘들것 같구요 인력 구하기도 마찬가지로 말이죠.. RUST도 시간적 여유가 있을지 싶습니다... 4K 영상을 편집하며 동시에 접근이 되어야하기 때문에 가볍지 않다고 생각하는데요 배워야 하는 시간은 뒤로하고 현실적으로 사용해야 할 개발 환경에 대해서 조언 부탁드립니다.

동영상 편집 웹사이트를 만들려고 하는데요 언어를 어떻게 정해야 할까요?

웹사이트에 동영상을 편집해서 저장소에 저장하는 사이트를 만들려고 하는데요 ffmpeg를 사용할 예정이고요 처음에 기획했던 게 java 기반에 웹사이트에 동영상 편집 프로그램을 할 수 있는 사이트를 만들 예정이었습니다. 하지만 동영상 편집 프로그램인 ffmpeg를 조작하려면 C언어이라고 해서 찾아보니 JNA, JAI가 있다는 걸 알게 되었습니다. 하지만 레퍼런스를 찾기가 어렵 더라고요 아직 개발 초반이라 다른 언어를 선택해야 하는지 고민입니다. 외국의 사이트는 vue.js 와 rust를 사용한 것으로 보입니다. python을 활용한 장고도 있다고 하는데(정확하지 않음...) 개인적으로는 java만 배워서 다른 언어를 다시 배워야 하는 입장이고 회사에서는 결과가 중요하니 가능한 쪽으로 선택이 될 것 같은데요. 이런 상황에서는 어떤 개발 환경으로 개발을 해야 할까요? 개인적인 건 빼고 가능한 쪽으로 알려주시면 감사하겠습니다.

클라이언트에서 동영상 압축하는 방법이 있을까요?

react로 프로젝트를 진행 중인데 동영상을 업로드하여 관리해야 하는 부분이 있습니다. 서버 부담을 덜기 위해 web에서 동영상 압축(해상도 조절)을 할 수 있는 방법이 있는지 찾고 있습니다. 클라이언트에서 동영상 압축 방법이 있을까요? @ffmpeg/ffmpeg 라이브러리를 사용하여 진행해 보았는데 속도가 너무 느립니다. 또한 일반적으로는 동영상 파일을 어떤 식으로 관리하는지 알고 싶습니다.

동영상 1분이하로 편집

동영상을 1분 이하로 편집하려 하는데 ffmpeg로 하면 속도가 너무 느립니다.더 빠르고 좋은 방법이 없을까요ㅠㅠ도와주세요