SpeechSynthesisUtterance
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2018.
* Some parts of this feature may have varying levels of support.
Giao diện SpeechSynthesisUtterance của Web Speech API đại diện cho một yêu cầu phát âm.
Nó chứa nội dung mà dịch vụ giọng nói cần đọc và các thông tin về cách đọc (ví dụ: ngôn ngữ, cao độ và âm lượng).
Hàm khởi tạo
SpeechSynthesisUtterance()-
Trả về một đối tượng
SpeechSynthesisUtterancemới.
Thuộc tính phiên bản
SpeechSynthesisUtterance cũng kế thừa các thuộc tính từ giao diện cha của nó là EventTarget.
SpeechSynthesisUtterance.lang-
Lấy và đặt ngôn ngữ của yêu cầu phát âm.
SpeechSynthesisUtterance.pitch-
Lấy và đặt cao độ mà yêu cầu phát âm sẽ được nói.
SpeechSynthesisUtterance.rate-
Lấy và đặt tốc độ mà yêu cầu phát âm sẽ được nói.
SpeechSynthesisUtterance.text-
Lấy và đặt văn bản sẽ được tổng hợp khi yêu cầu phát âm được nói.
SpeechSynthesisUtterance.voice-
Lấy và đặt giọng nói sẽ được dùng để đọc yêu cầu phát âm.
SpeechSynthesisUtterance.volume-
Lấy và đặt âm lượng mà yêu cầu phát âm sẽ được nói.
Sự kiện
Lắng nghe các sự kiện này bằng cách sử dụng addEventListener() hoặc bằng cách gán một trình xử lý sự kiện vào thuộc tính oneventname của giao diện này.
boundary-
Kích hoạt khi yêu cầu phát âm đang được nói đến ranh giới từ hoặc câu. Cũng có thể truy cập qua thuộc tính
onboundary. end-
Kích hoạt khi yêu cầu phát âm đã kết thúc. Cũng có thể truy cập qua thuộc tính
onend. error-
Kích hoạt khi xảy ra lỗi ngăn yêu cầu phát âm được nói thành công. Cũng có thể truy cập qua thuộc tính
onerror. mark-
Kích hoạt khi yêu cầu phát âm đang được nói đến thẻ SSML "mark" được đặt tên. Cũng có thể truy cập qua thuộc tính
onmark. pause-
Kích hoạt khi yêu cầu phát âm bị tạm dừng giữa chừng. Cũng có thể truy cập qua thuộc tính
onpause. resume-
Kích hoạt khi yêu cầu phát âm đã bị tạm dừng được tiếp tục. Cũng có thể truy cập qua thuộc tính
onresume. start-
Kích hoạt khi yêu cầu phát âm bắt đầu được nói. Cũng có thể truy cập qua thuộc tính
onstart.
Ví dụ
Trong bản demo cơ bản Speech synthesizer demo, trước tiên chúng ta lấy tham chiếu đến bộ điều khiển SpeechSynthesis bằng cách sử dụng window.speechSynthesis.
Sau khi định nghĩa một số biến cần thiết, chúng ta lấy danh sách các giọng nói có sẵn bằng SpeechSynthesis.getVoices() và điền vào menu select để người dùng có thể chọn giọng nói mình muốn.
Bên trong trình xử lý inputForm.onsubmit, chúng ta ngăn form gửi đi bằng preventDefault(), dùng hàm khởi tạo để tạo một đối tượng utterance mới chứa văn bản từ <input>, đặt voice của utterance thành giọng nói đã chọn trong phần tử <select>, và bắt đầu phát âm qua phương thức SpeechSynthesis.speak().
const synth = window.speechSynthesis;
const inputForm = document.querySelector("form");
const inputTxt = document.querySelector("input");
const voiceSelect = document.querySelector("select");
let voices;
function loadVoices() {
voices = synth.getVoices();
for (const [i, voice] of voices.entries()) {
const option = document.createElement("option");
option.textContent = `${voice.name} (${voice.lang})`;
option.value = i;
voiceSelect.appendChild(option);
}
}
// in Google Chrome the voices are not ready on page load
if ("onvoiceschanged" in synth) {
synth.onvoiceschanged = loadVoices;
} else {
loadVoices();
}
inputForm.onsubmit = (event) => {
event.preventDefault();
const utterThis = new SpeechSynthesisUtterance(inputTxt.value);
utterThis.voice = voices[voiceSelect.value];
synth.speak(utterThis);
inputTxt.blur();
};
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Web Speech API> # speechsynthesisutterance> |