Obtenir la liste des voix dans speechSynthesis de Chrome (Web Speech API)

HTML suivant montre tableau vide dans la console au premier clic:

<!DOCTYPE html>
<html>
    <head>
        <script>
            function test(){
                console.log(window.speechSynthesis.getVoices())
            }
        </script>
    </head>
    <body>
        <a href="#" onclick="test()">Test</a>
    </body>
</html>

En second clic, vous obtiendrez la attendue liste.

Si vous ajoutez onload événement à l'appel de cette fonction (<body onload="test()">), alors vous pouvez obtenir de bon résultat sur le premier clic. Notez que le premier appel sur onload ne fonctionne toujours pas correctement. Elle retourne vide au chargement de la page, mais fonctionne tout de suite après.

Questions:

Car il pourrait être un bug en version beta, j'y ai renoncé question "Pourquoi".

Maintenant, la question est de savoir si vous souhaitez accéder à window.speechSynthesis au chargement de la page:

  • Quel est le meilleur hack pour cette question?
  • Comment pouvez-vous vous assurer qu'il va charger speechSynthesis, au chargement de la page?

De fond et tests:

J'ai été le tester les nouvelles fonctionnalités de Web Speech API, puis j'ai eu ce problème dans mon code:

<script type="text/javascript">
$(document).ready(function(){
    //Browser support messages. (You might need Chrome 33.0 Beta)
    if (!('speechSynthesis' in window)) {
      alert("You don't have speechSynthesis");
    }

    var voices = window.speechSynthesis.getVoices();
    console.log(voices) //[]

    $("#test").on('click', function(){
        var voices = window.speechSynthesis.getVoices();
        console.log(voices); //[SpeechSynthesisVoice, ...]
    });
});
</script>
<a id="test" href="#">click here if 'ready()' didn't work</a>

Ma question était: pourquoi ne window.speechSynthesis.getVoices() retour tableau vide, une fois que la page est chargée et onready fonction est déclenchée? Comme vous pouvez le voir si vous cliquez sur le lien, la même fonction retourne un tableau de voix disponibles de Chrome par onclick triger?

Il semble Chrome charges window.speechSynthesis après le chargement de la page!

Le problème n'est pas dans ready événement. Si je supprime la ligne var voice=... de ready fonction, pour cliquez d'abord il montre la liste vide dans la console. Mais le deuxième clic fonctionne très bien.

Il semble window.speechSynthesis besoin de plus de temps pour charger après le premier appel. Vous avez besoin de l'appeler deux fois! Mais aussi, vous avez besoin d'attendre et de laisser la charge avant le second appel sur window.speechSynthesis. Par exemple, le code suivant montre deux tableaux vides dans la console si vous le lancez pour la première fois:

//First speechSynthesis call
var voices = window.speechSynthesis.getVoices();
console.log(voices);

//Second speechSynthesis call
voices = window.speechSynthesis.getVoices();
console.log(voices);
  • hmmm, juste une supposition, mais avez-vous avez l'attribut html tags liés à la synthèse vocale sur votre page par défaut? Si non, il prend peut-être chrome un peu de temps à travailler qu'une partie de lui-même.
  • aucun autre discours attributs sont là. J'ai une autre mise à jour à ma question. Peut-être que le problème n'est pas avec ready.
  • En Dart, j'ai appelé getVoices() après 5 secondes de retard à l'aide de Timer et a obtenu un peuplé de liste des voix disponibles.
  • Vous devez écrire une réponse à certaines de vos modifications ci-dessus. L'appel de getVoices() deux fois avec une seconde de retard résout le problème.
InformationsquelleAutor Mehdi | 2014-02-02