YuichirouSeitoku
commented
1 month ago <!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Screen Recorder</title>
</head>
<body>
<h1>画面録画アプリ</h1>
<button id="start">録画開始</button>
<script>
const { ipcRenderer } = require('electron');
document.getElementById('start').addEventListener('click', () => {
ipcRenderer.send('start-recording');
});
ipcRenderer.on('recording-finished', (event, outputPath) => {
alert(`録画が完了しました: ${outputPath}`);
});
</script>
</body>
</html>const { app, BrowserWindow, ipcMain, desktopCapturer } = require('electron');
const { createWriteStream } = require('fs');
const ffmpeg = require('fluent-ffmpeg');
const path = require('path');
let mainWindow;
function createWindow() {
mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
},
});
mainWindow.loadFile('index.html');
}
app.whenReady().then(createWindow);
ipcMain.on('start-recording', async (event) => {
const sources = await desktopCapturer.getSources({ types: ['screen'] });
const screenSource = sources[0];
const outputPath = path.join(app.getPath('videos'), 'recording.mp4');
const outputStream = createWriteStream(outputPath);
ffmpeg(screenSource.thumbnail.toPNG())
.format('mp4')
.pipe(outputStream);
outputStream.on('finish', () => {
event.reply('recording-finished', outputPath);
});
});
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit();
}
});
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
yumetodo
https://www.electronjs.org/ja/docs/latest/api/desktop-capturer