<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Speech Recognition API | ウダ2Blog</title>
	<atom:link href="https://uda2.com/blog/tag/speech-recognition-api/feed/" rel="self" type="application/rss+xml" />
	<link>https://uda2.com/blog</link>
	<description>大阪でフリーランスとしてWEB制作している管理人が気になった技術をメモったり、作ったツールの紹介などを綴っているブログです。</description>
	<lastBuildDate>Fri, 07 Jul 2023 07:22:40 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9</generator>
	<item>
		<title>WEBで音声操作</title>
		<link>https://uda2.com/blog/speechme/</link>
					<comments>https://uda2.com/blog/speechme/#respond</comments>
		
		<dc:creator><![CDATA[uda2]]></dc:creator>
		<pubDate>Thu, 06 Oct 2022 14:46:45 +0000</pubDate>
				<category><![CDATA[制作日記]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Speech Recognition API]]></category>
		<guid isPermaLink="false">https://uda2.com/blog/?p=2555</guid>

					<description><![CDATA[<p>昔、「しゃべる！DSお料理ナビ」というゲームがあって調理中でも音声でレシピの手順を進める事が出来た。今やDSは使わないけどiPadとかで音声操作できるブラウザがあったら便利かもと検索したら「Speech Recognit</p>
The post <a href="https://uda2.com/blog/speechme/">WEBで音声操作</a> first appeared on <a href="https://uda2.com/blog">ウダ2Blog</a>.]]></description>
										<content:encoded><![CDATA[<p>昔、「しゃべる！DSお料理ナビ」というゲームがあって調理中でも音声でレシピの手順を進める事が出来た。<br>今やDSは使わないけどiPadとかで音声操作できるブラウザがあったら便利かもと検索したら「<a href="https://developer.mozilla.org/ja/docs/Web/API/SpeechRecognition" target="_blank" rel="noopener">Speech Recognition API</a>」というJavaScriptのAPIが見つかったので試して見ることにした。</p>



<span id="more-2555"></span>



<p>「Speech Recognition API」は昔は限られた環境でしか利用できなかったようですが最近はiOSでも使えるみたいなので試して見ました。<br><a href="https://uda2.com/speechme/">https://uda2.com/speechme/</a><br>右上のマイクボタン（音声操作START）を押すと音声操作が開始します。（非対応なブラウザではボタンが現れません。）<br>「次へ」で次のステップに進んで「戻る」で前のステップに戻って「終了」で音声認識を終了します。<br>recognition.interimResultsをtrueにする事で聞きながら音声解読するので反応が早くなります。<br>resultイベント（音声が確認できたら）の最後に毎度停止再開をしてるのはコマンドが短いのに「まだ何か言うかも」と待機するのを抑止する為です。<br>上の方法で永続化はされてるのですがスタートしてから5分間と任意でストップするまで永続化したかったのでタイマーを仕掛けて状態を維持するようにしています。<br>他に誤認識を考慮してワードをセレクトしています。<br>「戻る」は何度か「本」「婆」「保存」と謎な誤認識をされたので入れてます。</p>



<pre><code>var speechme = () => {
  const recbtnObj = document.getElementById('recbtn');
  const recognition = new webkitSpeechRecognition() || new SpeechRecognition();
  if (typeof recognition === 'undefined') return;
  recbtnObj.style.display = "block";
  var recognizing = false;
  var rectime = 0;
  recognition.interimResults = true;
  recognition.maxAlternatives = 10;
  recognition.addEventListener('result', function(event) {
    const results = event.results;
    let strs = [];
    let command = "";
    paragraph: for (let i = event.resultIndex; i < results.length; i++) {//文節（今回は0だけ）
      for (let j = 0; j < results[i].length; j++){//候補
        const result = results[i][j].transcript;
        if (results[i].isFinal) {
          recognition.stop();
          recognizing = false;
        }
        strs.push({c: results[i][j].confidence, s: result});
        if (result == "ストップ" || result == "止めて" || result == "停止" || result == "終了") command = "stop";
        if (result == "次へ" || result == "次" || result == "月" || result == "進む" || result == "進んで" || result == "そんで" || result == "そして" || result == "それから" || result == "オッケー") command = "next";
        if (result == "戻る" || result == "本" || result == "婆" || result == "保存" || result == "戻って" || result == "バック") command = "back";
        if (command != "") break paragraph;
      }
    }
    if (command == "stop") return recStop();
    if (command == "next") stepxstep(1);
    if (command == "back") stepxstep(-1);
    //console.log(JSON.stringify(strs));
    document.getElementById('debug').innerText = JSON.stringify(strs);
    recognition.stop();
    recognition.start();
  });
  recbtnObj.addEventListener('click', () => {
    if (recbtn.textContent == 'START') {
      rectime = Date.now(); 
      recStart();
    } else {
      recStop();
    }
  });
  recognition.addEventListener('start', () => {
    recbtnObj.className = "online";
  });
  recognition.addEventListener('end', () => {
    recbtnObj.className = "offline";
    recognizing = false;
  });
  function recStop() {
    recognition.stop();
    recognizing = false;
    recbtn.textContent = 'START';
  }
  function recStart() {
    recognition.start();
    recognizing = true;
    recbtn.textContent = 'STOP';
  }
  setInterval(() => {
    if (recbtn.textContent == 'STOP' && recognizing === false) {//録音状態なのにAPI停止
      const mysec = Math.floor((Date.now() - rectime) / 1000);
      if (mysec < 60*5) {
        recognition.start();
        recognizing = true;
      } else {
        recStop();
      }
    }
  }, 1000);
};
speechme();
</code></pre>The post <a href="https://uda2.com/blog/speechme/">WEBで音声操作</a> first appeared on <a href="https://uda2.com/blog">ウダ2Blog</a>.]]></content:encoded>
					
					<wfw:commentRss>https://uda2.com/blog/speechme/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
