Electron项目中使用fluent-ffmpeg转换格式并在渲染层生成进度条

        fluent-ffmpeg只是一个命令库,他不携带所有ffmpeg的功能

  1.所以我们想用他要先下载一个ffmpeg的可执行文件:

import ffmpeg from 'fluent-ffmpeg';
//可执行文件的地址 asar打包后路径有所变化
const ffmpegPath = './resources/service/ffmpeg.exe';
//设置地址,注意:版本大于2才有这个方法
ffmpeg.setFfmpegPath(ffmpegPath);

2.不知道为什么,官方文档在监听progress回调中有百分比,我实际用的时候是没有的,但是有已完成的秒数,所以我的方法是用秒数来计算百分比

const timemark = progress.timemark.replace(".",":");;
const completedLsit = timemark.split(':');
const completed =
Number(completedLsit[0]) * 1000000 +
Number(completedLsit[1]) * 10000 +
Number(completedLsit[2]) * 100 +
Number(completedLsit[3]);
//totalTime 为总时间,也是像上面一样在codecData回调中计算出来的
(completed / totalTime * 100).toFixed(1) //算出来就是百分比

可以通过创建多个 `BrowserWindow` 实例来实现同时下载多个文件,并显示多个进度条。每个窗口实例都可以使用 `electron-dl` 模块来下载文件,并通过 IPC 通信机制将下载进度传递给主进程,主进程再将进度传递给渲染进程来更新进度条。 以下是示例代码: ``` // 主进程代码 const { app, BrowserWindow, ipcMain } = require('electron'); const { download } = require('electron-dl'); let mainWindow; function createWindow() { mainWindow = new BrowserWindow({ width: 800, height: 600 }); mainWindow.loadFile('index.html'); } app.on('ready', () => { createWindow(); }); ipcMain.on('download', (event, { url, filename }) => { const win = new BrowserWindow({ show: false }); // 创建一个新窗口 download(win, url, { directory: '/path/to/save', filename: filename }) .then(dl => { // 下载完成 win.close(); event.sender.send('download-complete', { filename }); }) .catch(error => { // 下载失败 win.close(); event.sender.send('download-error', { filename, error }); }); // 显示下载进度 win.webContents.session.on('will-download', (event, item, webContents) => { item.on('updated', () => { if (item.isInProgress()) { event.sender.send('download-progress', { filename, progress: item.getReceivedBytes() / item.getTotalBytes() }); } }); }); }); ``` 在渲染进程,可以监听 `download-progress`、`download-complete` 和 `download-error` 事件来更新进度条的状态。示例代码如下: ``` // 渲染进程代码 const { ipcRenderer } = require('electron'); ipcRenderer.on('download-progress', (event, { filename, progress }) => { // 更新进度条 }); ipcRenderer.on('download-complete', (event, { filename }) => { // 下载完成 }); ipcRenderer.on('download-error', (event, { filename, error }) => { // 下载失败 }); ``` 通过这种方式,您可以同时下载多个文件,并显示多个进度条,而不会影响应用程序的性能或稳定性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值