การใช้งาน Web Speech API

 


Web Speech API เป็น API ที่อยู่ในเว็บบราวเซอร์และถูกออกแบบมาเพื่อให้สามารถใช้งานการรู้จำเสียงพูด (Speech Recognition) และการสังเคราะห์เสียงพูด (Speech Synthesis) ในเว็บแอปพลิเคชันได้ Web Speech API มีสองส่วนหลักคือ SpeechRecognition และ SpeechSynthesis

การสังเคราะห์เสียงพูด (Speech Synthesis)

การสังเคราะห์เสียงพูด (Speech Synthesis) ใช้สำหรับการเปลี่ยนข้อความให้กลายเป็นเสียงพูด ซึ่งสามารถใช้งานได้ง่ายผ่าน JavaScript

Speech Synthesis

// สร้าง SpeechSynthesisUtterance object
const utterance = new SpeechSynthesisUtterance('Hello, how are you today?');

// ตั้งค่าภาษา
utterance.lang = 'en-US';

// เลือกเสียงที่ต้องการ
const voices = speechSynthesis.getVoices();
const selectedVoice = voices.find(voice => voice.name === 'Microsoft Jenny Online (Natural) - English (United States)');
if (selectedVoice) {
  utterance.voice = selectedVoice;
}

// สั่งให้พูด
speechSynthesis.speak(utterance);


ตัวอย่างการใช้งาน Speech Synthesis


<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <p id="text-voice">Explore the world of Artificial Intelligence (AI) with our 12-week,
24-lesson curriculum! It includes practical lessons, quizzes, and labs.
The curriculum is beginner-friendly and covers tools like TensorFlow and PyTorch,
as well as ethics in AI</p>
    <button onclick="speak()">🔊</button>

    <script>
      function speak() {
        const voiceText = document.querySelector('#text-voice').innerText;
        const utterance = new SpeechSynthesisUtterance(voiceText);
        utterance.lang = 'en-US'; //Your language code
        const voices = speechSynthesis.getVoices();
       
        // Check if the voices array is populated, otherwise wait and try again
        if (voices.length === 0) {
          setTimeout(speak, 100); // Retry after 100ms
          return;
        }
       
        // Find the voice by name
        const selectedVoice = voices.find(voice => voice.name === 'Microsoft Ava Online (Natural) - English (United States)');
        if (selectedVoice) {
          utterance.voice = selectedVoice;
        }
       
        // Speak the utterance
        speechSynthesis.speak(utterance);
      }
    </script>
  </body>
</html>


รายการเสียง (List Voices with Web Speech Synthesis API)

1 ความคิดเห็น

แสดงความคิดเห็น
ใหม่กว่า เก่ากว่า