js如何在浏览器中分割和裁剪音视频文件保存下载?
网友回复
使用ffmpeg.js实现
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>音视频分割与裁剪</title> <style> body { font-family: Arial, sans-serif; padding: 20px; } button { margin: 5px; padding: 8px 16px; } #output { margin-top: 20px; } </style> </head> <body> <h1>音视频分割与裁剪</h1> <input type="file" id="fileInput" accept="audio/*,video/*" /> <br /> <h3>裁剪</h3> <label>开始时间 (秒): <input type="number" id="startTime" value="10" min="0" /></label> <label>持续时间 (秒): <input type="number" id="duration" value="20" min="1" /></label> <button onclick="trimFile()">裁剪文件</button> <h3>分割</h3> <label>分割间隔 (秒): <input type="number" id="segmentTime" value="10" min="1" /></label> <button onclick="splitFile()">分割文件</button> <div id="output"></div> <!-- 通过 CDN 加载 ffmpeg.wasm --> <script src="https://unpkg.com/@ffmpeg/ffmpeg@0.10.1/dist/ffmpeg.min.js"></script> <script> const { createFFmpeg, fetchFile } = FFmpeg; const ffmpeg = createFFmpeg({ log: true }); // 初始化 ffmpeg 实例 let fileData = null; // 存储上传的文件数据 // 文件选择事件 document.getElementById('fileInput').addEventListener('change', async (e) => { const file = e.target.files[0]; if (file) { fileData = await file.arrayBuffer(); // 读取文件为 ArrayBuffer alert('文件已加载,请选择裁剪或分割操作'); } }); // 加载 ffmpeg async function loadFFmpeg() { if (!ffmpeg.isLoaded()) { await ffmpeg.load(); console.log('ffmpeg.wasm 已加载'); } } // 裁剪文件 async function trimFile() { const startTime = document.get...
点击查看剩余70%
python如何调用openai的api实现知识讲解类动画讲解视频的合成?
html如何直接调用openai的api实现海报可视化设计及文本描述生成可编辑海报?
f12前端调试如何找出按钮点击事件触发的那段代码进行调试?
abcjs如何将曲谱播放后导出mid和wav格式音频下载?
python如何将曲子文本生成音乐mp3或wav、mid文件
python中mp3、wav音乐如何转成mid格式?
js在HTML中如何将曲谱生成音乐在线播放并下载本地?
python如何实现在windows上通过键盘来模拟鼠标操作?
python如何给win10电脑增加文件或文件夹右键自定义菜单?
python如何将音乐mp3文件解析获取曲调数据?