PHP Code Editor
<?php // 1. HEADER WAJIB UNTUK FFMPEG WASM header("Cross-Origin-Embedder-Policy: require-corp"); header("Cross-Origin-Opener-Policy: same-origin"); // 2. DAFTAR FILE YANG DIBUTUHKAN $libDir = 'lib/'; if (!is_dir($libDir)) mkdir($libDir, 0777, true); $files = [ "ffmpeg.min.js" => "https://cdnjs.cloudflare.com/ajax/libs/ffmpeg/0.12.15/umd/ffmpeg.min.js", "util.min.js" => "https://cdnjs.cloudflare.com", "ffmpeg-core.js" => "https://unpkg.com", "ffmpeg-core.wasm" => "https://unpkg.com" ]; // 3. AUTO DOWNLOAD LOGIC (CURL -> WGET -> ARIA2) foreach ($files as $name => $url) { $path = $libDir . $name; if (!file_exists($path)) { $commands = [ "curl -L -o $path $url", "wget -O $path $url", "aria2c -o $path $url" ]; foreach ($commands as $cmd) { shell_exec($cmd); if (file_exists($path) && filesize($path) > 0) break; } } } // 4. LOGIC SIMPAN HASIL UPLOAD if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['video_blob'])) { $uploadDir = 'uploads/'; if (!is_dir($uploadDir)) mkdir($uploadDir, 0777, true); $target = $uploadDir . 'processed_' . time() . '.mp4'; if (move_uploaded_file($_FILES['video_blob']['tmp_name'], $target)) { echo "Sukses: Tersimpan di $target"; } else { echo "Gagal simpan file."; } exit; } ?> <!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <title>FFmpeg Lokal Auto-Downloader</title> <!-- LOAD DARI LOCAL SERVER --> <script src="lib/ffmpeg.min.js"></script> <script src="lib/util.min.js"></script> <style> body { font-family: sans-serif; text-align: center; padding: 50px; } #log { background: #eee; padding: 10px; margin-top: 10px; font-size: 12px; height: 100px; overflow-y: auto; text-align: left; } </style> </head> <body> <h2>Client-Side Resizer (Max 720p)</h2> <input type="file" id="uploader" accept="video/*"> <p id="status">Status: Menunggu file...</p> <progress id="progress" value="0" max="100" style="width:100%; display:none;"></progress> <div id="log"></div> <script> const { FFmpeg } = FFmpegWasm; const { toBlobURL, fetchFile } = FFmpegUtil; let ffmpeg = null; async function startResize() { const uploader = document.getElementById('uploader'); if (uploader.files.length === 0) return; const status = document.getElementById('status'); const logDiv = document.getElementById('log'); if (!ffmpeg) { status.innerText = "Menginisialisasi FFmpeg..."; ffmpeg = new FFmpeg(); // LOAD DARI FOLDER LOKAL PHP await ffmpeg.load({ coreURL: await toBlobURL('lib/ffmpeg-core.js', 'text/javascript'), wasmURL: await toBlobURL('lib/ffmpeg-core.wasm', 'application/wasm') }); } status.innerText = "Sedang Memproses ke 720p..."; ffmpeg.on('log', ({ message }) => { logDiv.innerHTML += message + "<br>"; logDiv.scrollTop = logDiv.scrollHeight; }); await ffmpeg.writeFile('input', await fetchFile(uploader.files[0])); // Scale ke 720p jika video asli lebih besar await ffmpeg.exec([ '-i', 'input', '-vf', 'scale=-2:min(720\\,ih)', '-c:v', 'libx264', '-preset', 'veryfast', 'output.mp4' ]); status.innerText = "Mengunggah ke server..."; const data = await ffmpeg.readFile('output.mp4'); const blob = new Blob([data.buffer], { type: 'video/mp4' }); const fd = new FormData(); fd.append('video_blob', blob, 'video.mp4'); const res = await fetch('', { method: 'POST', body: fd }); const result = await res.text(); status.innerText = result; } document.getElementById('uploader').addEventListener('change', startResize); </script> </body> </html>
Run Code
<?php // 1. HEADER WAJIB UNTUK FFMPEG WASM header("Cross-Origin-Embedder-Policy: require-corp"); header("Cross-Origin-Opener-Policy: same-origin"); // 2. DAFTAR FILE YANG DIBUTUHKAN $libDir = 'lib/'; if (!is_dir($libDir)) mkdir($libDir, 0777, true); $files = [ "ffmpeg.min.js" => "https://cdnjs.cloudflare.com/ajax/libs/ffmpeg/0.12.15/umd/ffmpeg.min.js", "util.min.js" => "https://cdnjs.cloudflare.com", "ffmpeg-core.js" => "https://unpkg.com", "ffmpeg-core.wasm" => "https://unpkg.com" ]; // 3. AUTO DOWNLOAD LOGIC (CURL -> WGET -> ARIA2) foreach ($files as $name => $url) { $path = $libDir . $name; if (!file_exists($path)) { $commands = [ "curl -L -o $path $url", "wget -O $path $url", "aria2c -o $path $url" ]; foreach ($commands as $cmd) { shell_exec($cmd); if (file_exists($path) && filesize($path) > 0) break; } } } // 4. LOGIC SIMPAN HASIL UPLOAD if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_FILES['video_blob'])) { $uploadDir = 'uploads/'; if (!is_dir($uploadDir)) mkdir($uploadDir, 0777, true); $target = $uploadDir . 'processed_' . time() . '.mp4'; if (move_uploaded_file($_FILES['video_blob']['tmp_name'], $target)) { echo "Sukses: Tersimpan di $target"; } else { echo "Gagal simpan file."; } exit; } ?> <!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <title>FFmpeg Lokal Auto-Downloader</title> <!-- LOAD DARI LOCAL SERVER --> <script src="lib/ffmpeg.min.js"></script> <script src="lib/util.min.js"></script> <style> body { font-family: sans-serif; text-align: center; padding: 50px; } #log { background: #eee; padding: 10px; margin-top: 10px; font-size: 12px; height: 100px; overflow-y: auto; text-align: left; } </style> </head> <body> <h2>Client-Side Resizer (Max 720p)</h2> <input type="file" id="uploader" accept="video/*"> <p id="status">Status: Menunggu file...</p> <progress id="progress" value="0" max="100" style="width:100%; display:none;"></progress> <div id="log"></div> <script> const { FFmpeg } = FFmpegWasm; const { toBlobURL, fetchFile } = FFmpegUtil; let ffmpeg = null; async function startResize() { const uploader = document.getElementById('uploader'); if (uploader.files.length === 0) return; const status = document.getElementById('status'); const logDiv = document.getElementById('log'); if (!ffmpeg) { status.innerText = "Menginisialisasi FFmpeg..."; ffmpeg = new FFmpeg(); // LOAD DARI FOLDER LOKAL PHP await ffmpeg.load({ coreURL: await toBlobURL('lib/ffmpeg-core.js', 'text/javascript'), wasmURL: await toBlobURL('lib/ffmpeg-core.wasm', 'application/wasm') }); } status.innerText = "Sedang Memproses ke 720p..."; ffmpeg.on('log', ({ message }) => { logDiv.innerHTML += message + "<br>"; logDiv.scrollTop = logDiv.scrollHeight; }); await ffmpeg.writeFile('input', await fetchFile(uploader.files[0])); // Scale ke 720p jika video asli lebih besar await ffmpeg.exec([ '-i', 'input', '-vf', 'scale=-2:min(720\\,ih)', '-c:v', 'libx264', '-preset', 'veryfast', 'output.mp4' ]); status.innerText = "Mengunggah ke server..."; const data = await ffmpeg.readFile('output.mp4'); const blob = new Blob([data.buffer], { type: 'video/mp4' }); const fd = new FormData(); fd.append('video_blob', blob, 'video.mp4'); const res = await fetch('', { method: 'POST', body: fd }); const result = await res.text(); status.innerText = result; } document.getElementById('uploader').addEventListener('change', startResize); </script> </body> </html>
Run Code New Tab
Result