CcClip讨论小组🍻 | Flutter 学习讨论📝 | CcView开发者小组🎨 | 打赏(赠送学习资料:webNote) 🎊 |
---|---|---|---|
关于我👷🏼:
- 🛠️ Vue2, Vue3, React, Flutter, Nodejs, WebGl, JAVA, css, html
- 💼 兴趣方向是 Wasm、WebGl、工业软件、深度学习、图片处理、音视频处理 😋
- 📫 [email protected]
支持作者🎁:
- 打赏任意金额可以加入赞助者行列啦 🥰
vue and ffmpeg based tool for video clips. 使用vue(vue3) + ffmpeg + wasm 实现纯前端音视频编辑,功能包括:视频剪辑、音频剪辑、音频合成裁剪、音波展示、视频抽帧、gif抽帧、帧播放器、字幕、贴图、时间轴、素材轨道
License: Other
CcClip讨论小组🍻 | Flutter 学习讨论📝 | CcView开发者小组🎨 | 打赏(赠送学习资料:webNote) 🎊 |
---|---|---|---|
关于我👷🏼:
支持作者🎁:
如果视频是一秒60帧的话轨道里的视频长度就会出问题,视频的时长也算错了
视频播放的时候禁音然后取消禁音视频还是没有声音
500start了,快点更新
500start了,快点更新
500start了,快点更新
500start了,快点更新
500start了,快点更新
如题
请问一下vue2的老项目可以引入ffmpeg有报错,ffmpeg不支持vue2项目吗?
描述
拖动一个视频文件到中间位置,剪切会出错,数据计算有误
因为offset计算的时候直接和剪切点计算的,但是视频不一定是顶格从0开始的;
除此之外,frameCount和time也未更新
TrackContro文件中剪切的操作应该修改为
active.end = splitTime;
active.offsetR = active.frameCount - active.end + active.start; // offset减去前面的空白量
active.frameCount -= active.offsetR; // 重新计算frameCount 和time
active.time = parseInt(`${active.frameCount / baseFps * 1000}`);
copy.start = splitTime;
copy.offsetL = splitTime - 1 - active.start;
copy.frameCount -= copy.offsetL;
copy.time = parseInt(`${copy.frameCount / baseFps * 1000}`);
copy.id = getId();
trackStore.addTrack(copy, trackStore.selectTrackItem.line, false, 0);
剪辑好的视频如何导出呢
方案来源
wasm文件过大,且性能不如webcodecs
问题:配置了请求头 'Cross-Origin-Opener-Policy': 'same-origin', 'Cross-Origin-Embedder-Policy': 'require-corp' 会导致图片跨域,但是如果不配置这个请求头的话会报错 SharedArrayBuffer is not defined
找了很多种方法但是目前没解决掉。
将视频添加到轨道里面加载有点慢,我用了一个5s的视频差不多要加载3分钟左右。
runtime-core.esm-bundler.js:236 Uncaught SyntaxError: Unexpected end of JSON input
at JSON.parse ()
at addTrack (TrackList.vue:186:5)
at callWithErrorHandling (runtime-core.esm-bundler.js:173:22)
at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:182:21)
at HTMLDivElement.invoker (runtime-dom.esm-bundler.js:345:9)
裁剪完视频发现撤销、前进按钮无效。
想在我们的项目中集成视频剪辑工具,能否接受定制或者赞助?
配置了请求头 'Cross-Origin-Opener-Policy': 'same-origin', 'Cross-Origin-Embedder-Policy': 'require-corp' 会导致图片跨域,但是如果不配置这个请求头的话会报错 SharedArrayBuffer is not defined
在视频里添加一个文本删掉文本内容,轨道里的视频居然也被删除了
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.