ChatGPTをしゃべらせる方法

Web Speech APIを使うことで、ChatGPTを簡単に喋らせることができる。

const nodes = document.querySelectorAll('main p')
// ここで「最後の要素」と限定せず nodes を for-of で回して全部読み上げも可能
const ai = Array.from(nodes).at(-1)

const tts = new SpeechSynthesisUtterance(ai.textContent || '...')
tts.voice = speechSynthesis.getVoices().find(a => a.name === 'kyoko')
tts.pitch = 1
tts.rate = 1.2

speechSynthesis.speak(tts)

展望

• MutationObserverなどを使ってp要素が追加されたときに読み上げさせれば通常の会話みたいになるかも