Esta página foi traduzida do inglês pela comunidade. Saiba mais e junte-se à comunidade MDN Web Docs.
SpeechSynthesis
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since setembro de 2018.
Experimental: Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.
A interface SpeechSynthesis da Web Speech API é a interface controladora para o serviço de fala; este pode ser usado para obter informações sobre as vozes sintetizadas disponíveis no dispositivo, reproduzir e pausar uma elocução, além de outros comandos.
Propriedades
SpeechSynthesis também herda propriedades da sua interface pai, EventTarget.
SpeechSynthesis.pausedSomente leitura-
Um
Booleanque retornatruese o objetoSpeechSynthesisestá em estado de pausa. SpeechSynthesis.pendingSomente leitura-
Um
Booleanque retornatruese a fila de elocuções contém falas que ainda não foram reproduzidas. SpeechSynthesis.speakingSomente leitura-
Um
Booleanque retornatruese uma elocução está sendo reproduzida atualmente — mesmo queSpeechSynthesisesteja em estado de pausa.
Tratamento de eventos
SpeechSynthesis.onvoiceschanged-
Disparado quando a lista de objetos
SpeechSynthesisVoiceque pode ser retornada pelo métodoSpeechSynthesis.getVoices()mudou.
Métodos
SpeechSynthesis também herda métodos da sua interface pai, EventTarget.
SpeechSynthesis.cancel()-
Remove todas as elocuções da fila para reprodução.
SpeechSynthesis.getVoices()-
Retorna uma lista de objetos
SpeechSynthesisVoicerepresentando todas as vozes disponíveis no dispositivo atuall SpeechSynthesis.pause()-
Deixa o objeto
SpeechSynthesisem estado de pausa. SpeechSynthesis.resume()-
Retira o estado de pausa do objeto
SpeechSynthesis: retoma a reprodução se ele estiver pausado. SpeechSynthesis.speak()-
Adiciona uma
utteranceà fila de reprodução; ela será reproduzida assim que todas as elocuções enfileiradas anteriormente tenham sido reproduzidas.
Exemplos
Na nossa demonstração básica Speech synthesiser demo, nós primeiro pegamos uma referência para o controlador SpeechSynthesis usando window.speechSynthesis. Após definir algumas variáveis necessárias, nós obtemos uma lista de vozes disponíveis usando o método SpeechSynthesis.getVoices() usando-as para popular um menu de seleção de forma que o usuário possa escolher a voz que desejar.
Dentro do tratamento inputForm.onsubmit, nós impedimos a submissão do formulário com preventDefault(), instanciamos uma SpeechSynthesisUtterance contendo o texto presente no <input>, atribuímos a voz da elocução para a voz selecionada no elemento <select>, e iniciamos a reprodução da elocução através do método SpeechSynthesis.speak().
var synth = window.speechSynthesis;
var inputForm = document.querySelector("form");
var inputTxt = document.querySelector(".txt");
var voiceSelect = document.querySelector("select");
var pitch = document.querySelector("#pitch");
var pitchValue = document.querySelector(".pitch-value");
var rate = document.querySelector("#rate");
var rateValue = document.querySelector(".rate-value");
var voices = [];
function populateVoiceList() {
voices = synth.getVoices();
for (i = 0; i < voices.length; i++) {
var option = document.createElement("option");
option.textContent = voices[i].name + " (" + voices[i].lang + ")";
if (voices[i].default) {
option.textContent += " -- DEFAULT";
}
option.setAttribute("data-lang", voices[i].lang);
option.setAttribute("data-name", voices[i].name);
voiceSelect.appendChild(option);
}
}
populateVoiceList();
if (speechSynthesis.onvoiceschanged !== undefined) {
speechSynthesis.onvoiceschanged = populateVoiceList;
}
inputForm.onsubmit = function (event) {
event.preventDefault();
var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
var selectedOption = voiceSelect.selectedOptions[0].getAttribute("data-name");
for (i = 0; i < voices.length; i++) {
if (voices[i].name === selectedOption) {
utterThis.voice = voices[i];
}
}
utterThis.pitch = pitch.value;
utterThis.rate = rate.value;
synth.speak(utterThis);
inputTxt.blur();
};
Especificações
| Specification |
|---|
| Web Speech API> # tts-section> |
Compatibilidade com navegadores
Loading...