Webエンジニアの泰です。
7月にteratailのイベントにてLTをやらせていただきました。
今回はWeb Speech APIを使用して擬似的な対話アプリを作ってみました。
Web Speech APIとは
Web Speech APIはブラウザから音声の処理ができるAPIです。
今回のデモでは音声入力を行うことができるHTML5のSpeech Recognitionと音声出力を行うことができるSpeech Synthesisを使用しました。
これらのAPIはPC/SP版のChromeで動作します。
HTML5でブラウザと対話してみた
LTのスライドはSlideshareにて公開しています。
対話するまでのフローとしては以下の様な処理になっています。
- ユーザからマイクによる音声入力を行う
- javascriptのSpeech Recognition APIで文字列を取得
- Ajaxで入力文字列をサーバサイドへ送信
- サーバサイドでteratail APIにリクエストしタグ情報を取得。レスポンスとして返却。
- 受け取ったタグ情報をSpeech Synthesis APIで読み上げる
デモページはこちら
HTML5でteratailと対話してみた!
About The Author
Shohei Tai | 2016年入社
CTO
フルスタックエンジニア。Webサービスやポータルサイトの開発、マネジメントをしています。フロントエンドの開発、高速化、SEOが得意です。外部のイベントでたまにLTをやっています。趣味はダーツ(ハード・ソフト)とバイク。