Spaces:
Sleeping
Sleeping
| <html lang="vi"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>F5-TTS Suy Luận Tiếng Việt</title> | |
| <style> | |
| body { font-family: Arial, sans-serif; margin: 20px; } | |
| .container { max-width: 600px; margin: auto; } | |
| textarea, input[type="file"], button { width: 100%; margin: 10px 0; padding: 10px; } | |
| #result { margin-top: 20px; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <h2>F5-TTS Suy Luận Tiếng Việt</h2> | |
| <p>Chọn file âm thanh tham chiếu và nhập văn bản để tạo giọng nói.</p> | |
| <input type="file" id="refAudio" accept="audio/*"> | |
| <textarea id="refText" rows="3" placeholder="Văn bản tham chiếu (nếu có)..."></textarea> | |
| <textarea id="genText" rows="3" placeholder="Văn bản cần tạo giọng nói..."></textarea> | |
| <button onclick="generateSpeech()">Tạo Giọng Nói</button> | |
| <div id="result"></div> | |
| </div> | |
| <script> | |
| async function generateSpeech() { | |
| const refAudio = document.getElementById('refAudio').files[0]; | |
| const refText = document.getElementById('refText').value; | |
| const genText = document.getElementById('genText').value; | |
| const resultDiv = document.getElementById('result'); | |
| if (!refAudio || !genText) { | |
| resultDiv.innerHTML = "Vui lòng chọn file âm thanh và nhập văn bản!"; | |
| return; | |
| } | |
| const formData = new FormData(); | |
| formData.append('ref_audio', refAudio); | |
| formData.append('ref_text', refText); | |
| formData.append('gen_text', genText); | |
| formData.append('model', 'F5TTS_Base'); | |
| formData.append('speed', 1.0); | |
| resultDiv.innerHTML = "Đang xử lý..."; | |
| try { | |
| const response = await fetch('/api/generate', { | |
| method: 'POST', | |
| body: formData | |
| }); | |
| if (response.ok) { | |
| const data = await response.blob(); | |
| const audioUrl = URL.createObjectURL(data); | |
| resultDiv.innerHTML = `<audio controls><source src="${audioUrl}" type="audio/wav">Trình duyệt của bạn không hỗ trợ âm thanh.</audio>`; | |
| } else { | |
| const errorText = await response.text(); | |
| resultDiv.innerHTML = `Lỗi: ${errorText}`; | |
| } | |
| } catch (error) { | |
| resultDiv.innerHTML = `Lỗi: ${error.message}`; | |
| } | |
| } | |
| </script> |