AndroidとSafariデバイスでSpeechSynthesis APIを起動する

Question

SpeechSynthesis APIを使用してWebアプリケーションを作成し、スタートボタンをクリックしてからプログラムを実行してから、AndroidおよびiOSデバイスでユーザーの聴き取りを開始しようとしています。ユーザーはプログラムを実行するために何かを話すことができました。その後、3秒ごとにオーディオファイルを再生できます。以下は私のコードです。私の論理は間違っていますか？クリック後にプログラムを起動してサウンドを聞くことができません。

このSpeechSynthesis APIはAndroidとiOSデバイスをサポートすることができますが、「サウンドスタートイベント」などのイベントを見たときにSafari Mobileはサポートされません。彼らの関係は何ですか？私は本当に混乱した。 SpeechRecognition APIはChromeブラウザのみをサポートしていますが、サウンドスタートのようなイベントをユーザーにする必要はありませんか？

ありがとうございました。ほんとうにありがとう。

<p id="msg" align="center"></p> 

    <script> 
     var utterance = new SpeechSynthesisUtterance("Hello"); 
     //window.speechSynthesis.speak(utterance); 

     var supportMsg = document.getElementById('msg'); 

     if ('speechSynthesis' in window) 
     { 
      supportMsg.innerHTML = 'Your browser <strong>supports</strong> speech synthesis.'; 
      console.log("Hi"); 

      utterance.onstart = function(event) 
      { 
       console.log('Hhhh') 
      }; 


      var playList = ["1_hello", "2_how_old", "3_what_did_you_make"]; 
      var dir = "sound/"; 
      var extention = ".wav"; 
      audio.src = dir + playList[audioIndex] + extention; 
      audio.load(); 

      var audioIndex = 0; 
      setTimeout(function(){audio.play();}, 1000); 


      window.speechSynthesis.speak(utterance); 

     } 
     else 
     { 



      supportMsg.innerHTML = 'Sorry your browser <strong>does not support</strong> speech synthesis.<br>Try this in <a href="https://www.google.co.uk/intl/en/chrome/browser/canary.html">Chrome Canary</a>.'; 
     } 

     //window.speechSynthesis(utterance); 

    </script> 
    <div class="container"> 
     <button id="runProgram" onclick='utterance.onstart();' 
     class="runProgram-button">Start</button> 
    </div> 

Answer 1

これは機能しますか？

function playAudio() { 
 
    var msg = new SpeechSynthesisUtterance('Help me with this code please?'); 
 
    msg.pitch = 0; 
 
    msg.rate = .6; 
 
    window.speechSynthesis.speak(msg); 
 

 

 

 
    var msg = new SpeechSynthesisUtterance(); 
 
    var voices = window.speechSynthesis.getVoices(); 
 
    msg.voice = voices[10]; // Note: some voices don't support altering params 
 
    msg.voiceURI = 'native'; 
 
    msg.volume = 1; // 0 to 1 
 
    msg.rate = 1.2; // 0.1 to 10 
 
    msg.pitch = 2; //0 to 2 
 
    msg.text = 'Sure. This code plays "Hello World" for you'; 
 
    msg.lang = 'en-US'; 
 

 
    msg.onend = function(e) { 
 
    var msg1 = new SpeechSynthesisUtterance('Now code plays audios for you'); 
 
    msg1.voice = speechSynthesis.getVoices().filter(function(voice) { return voice.name == 'Whisper'; })[0]; 
 
    msg1.pitch = 2; //0 to 2 
 
    msg1.rate= 1.2; //0 to 2 
 
    // start your audio loop. 
 
    speechSynthesis.speak(msg1); 
 
    console.log('Finished in ' + e.elapsedTime + ' seconds.'); 
 
    }; 
 

 
    speechSynthesis.speak(msg); 
 
}

<div class="container"> 
 
    <button id="runProgram" onclick='playAudio();' class="runProgram-button">Start</button> 
 
</div>