3000文字Tips - 知ると便利なTipsをみんなへ届けよう 向けのイベント記事です。
Web Speech API
Web Speech API は ブラウザ上でSpeechSynthesis(音声合成)とSpeechRecognition(音声認識)の機能を提供する API です。
使い方は下記記事がわかりやすいです。
詳細の仕様は公式のドキュメントをご参照ください。
ブックマークレット
私はメインブラウザを Vivaldi にしています。
クイックコマンド を使うとブックマークレットが呼び出しやすいため、ちょっとした JavaScript のコードを登録して実行できるようにしています。
読み上げたいテキストを元に SpeechSynthesisUtterance のオブジェクトを作成、speechSynthesis.speak()を呼び出せば再生されます。
speak() は SpeechSynthesisUtterance を再生のキューにつむようになっていて、停止するときはcancel() を呼び出してキューの削除をすると停止されます。
読み上げの開始
javascript:speechSynthesis.speak(new SpeechSynthesisUtterance(document.getElementById('personal-public-article-body').innerText))
停止（読み上げキューの削除）
javascript:speechSynthesis.cancel()
読み上げブックマークレットはいろんなところで使えると思うので、ぜひご活用ください。