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 deTimer
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.
Vous devez vous connecter pour publier un commentaire.
Selon Web Speech API Errata (E11 2013-10-17), la voix liste est chargé async à la page. Un
onvoiceschanged
événement est déclenché lorsqu'ils sont chargés.Donc, l'astuce est de placer votre voix à partir de la fonction de rappel pour que l'écouteur d'événement:
onvoiceschanged
événement déclenché plus d'une fois?speechSynthesis.getVoices()
et puis d'attendre pouronvoiceschanged
à feu ou ne l'événement se déclenche à chaque fois, parfois pendant ou après le chargement de la page?speechSynthesis.getVoices()
lorsque la page est chargée et essayer d'obtenir de la voix que je voulais dans laonvoiceschanged
de l'événement, ainsi que chaque fois que je devais synthétiser quelque chose d'aussi bien, jusqu'à ce que j'ai pu obtenir la voix que je voulais et de l'affecter à une variable. Aussi, dans le cas où je ne pouvais pas la voix dans le temps de la synthèse, le réglage de l'énonciationlang
propriété à celui correspondant à la langue que je voulais (pt-BR
dans mon cas) ferait l'affaire dans certaines plates-formes.Vous pouvez utiliser un setInterval attendre jusqu'à ce que la voix chargée avant de l'utiliser, mais vous avez besoin et en désactivant la fonction setInterval:
Au début, j'ai utilisé onvoiceschanged , mais il continuait de tir, même après la voix a été chargé, de sorte que mon but était d'éviter onvoiceschanged à tout prix.
C'est ce que je suis venu avec. Il semble à ce jour, sera mise à jour en cas de casse.
LoadVoices()
référence?heres la réponse
Tout d'abord, merci beaucoup pour cette réponse. Deuxièmement, voici une JSBin si quelqu'un vient sur cette question/réponse encore une fois: http://jsbin.com/gosaqihi/9/edit?js console
utterance.voice = 'Hysterical'
ligne. Voici une version corrigée: jsbin.com/hinafan/edit?js consoleUne autre façon de s'assurer les voix sont chargés avant de vous en avez besoin est de lier leur chargement de l'état de promesse, et puis l'expédition de vos commandes vocales à partir d'un
then
:Lorsque vous appelez
listVoices
, il va attendre la voix de charge en premier, ou l'envoi de votre opération sur le côté de la tique.setInterval solution par Salman Oskooi était parfait
Veuillez voir https://jsfiddle.net/exrx8e1y/
Cela fonctionne très bien sur Chrome pour MAC, Linux(Ubuntu), Windows et Android
Android a non-standard en_GB wile d'autres ont fr comme langue code
Vous aussi, vous allez voir que même langue(lang) a de multiples noms de
Sur Mac Chrome, vous obtenez fr-GB Daniel en outre en-GB Google UK anglais Femelle et n-GO Google UK anglais Mâle
fr-GB Daniel (Mac et iOS)
fr-GO Google UK anglais Femelle
fr-GO Google royaume-UNI de l'homme anglais
en_GB anglais royaume-Uni
hi-DANS Google हिन्दी
hi-DANS Lekha (Mac et iOS)
hi_IN Hindi Inde
J'ai utilisé ce code pour charger les voix avec succès:
...
J'ai trouvé la " onvoiceschanged code de cet article: https://hacks.mozilla.org/2016/01/firefox-and-the-web-speech-api/
Fonctionne dans Firefox/Safari et Chrome (et à Google Apps Script trop - mais seulement dans le code HTML).
J'ai dû faire mes propres recherches pour cela de me faire comprendre correctement, il suffit donc de partage (n'hésitez pas à modifier).
Mon objectif est de:
La fonctionnalité de base est démontré dans MDN, officiel live demo de:
https://github.com/mdn/web-speech-api/tree/master/speak-easy-synthesis
mais je voulais mieux le comprendre.
Pour briser la rubrique en bas...
SpeechSynthesis
Source
onvoiceschanged
Source
Exemple Un
Si ma demande a simplement:
Chrome developer tools console affiche:
Exemple B
Si je change le code:
L'avant et l'après que les etats-mêmes, et
voices
est un tableau vide.Solution
Bien que je ne suis pas confiant la mise en œuvre de Promesses, le suivant a fonctionné pour moi:
Définition de la fonction
L'appel de la fonction
Android Chrome - désactiver les données de veille. Il a été utile pour moi.(Chrome 71.0.3578.99)