Como obter a lista de vozes no discursoSíntese do Chrome (Web Speech API)
O HTML a seguir mostra a matriz vazia no console no primeiro clique:
<!DOCTYPE html>
<html>
<head>
<script>
function test(){
console.log(window.speechSynthesis.getVoices())
}
</script>
</head>
<body>
<a href="#" onclick="test()">Test</a>
</body>
</html>
No segundo clique, você receberá a lista esperada.
Se você adicionaronload
evento para chamar esta função (<body onload="test()">
), então você pode obter o resultado correto no primeiro clique. Observe que a primeira chamada emonload
ainda não funciona corretamente. Ele retorna vazio no carregamento da página, mas funciona depois.
Questões:
Uma vez que pode serum inseto na versão beta, desisti das perguntas "Por que".
Agora, a questão é se você deseja acessarwindow.speechSynthesis
no carregamento da página:
speechSynthesis
, no carregamento da página?Antecedentes e testes:
Eu estava testando os novos recursos da Web Speech API, e cheguei a esse problema no meu código:
<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>
Minha pergunta era: por quewindow.speechSynthesis.getVoices()
retornar matriz vazia, depois que a página for carregada eonready
função é acionada? Como você pode ver se clicar no link, a mesma função retorna uma variedade de vozes disponíveis do Chrome,onclick
tigre?
Parece que o Chrome carregawindow.speechSynthesis
após o carregamento da página!
O problema não está emready
evento. Se eu remover a linhavar voice=...
deready
função, para o primeiro clique, mostra uma lista vazia no console. Mas o segundo clique funciona bem.
Parecewindow.speechSynthesis
precisa de mais tempo para carregar após a primeira chamada. Você precisa chamá-lo duas vezes! Além disso, você precisa esperar e deixá-lo carregar antes da segunda chamadawindow.speechSynthesis
. Por exemplo, o código a seguir mostra duas matrizes vazias no console se você executá-lo pela primeira vez:
// First speechSynthesis call
var voices = window.speechSynthesis.getVoices();
console.log(voices);
// Second speechSynthesis call
voices = window.speechSynthesis.getVoices();
console.log(voices);