Проблема с API распознавания речи в React для включения голосовой команды

Question

Я создаю приложение React с голосовым управлением, которое будет включать и выключать лампу с помощью модуля распознавания речи при включении и выключении голосовой команды. Все работает, как ожидалось, однако есть одна проблема, с которой я столкнулся: приложение слушает мой голос дважды или более, даже если я один раз произнес свою команду. Было бы здорово, если бы кто-нибудь поделился своим предложением по этому поводу. Вот мой код,

      //This component will listen my command (ON/OFF) and pass the corresponding command value 28/-28
// to the next component which is RetrieveCommand
// The problem is, even I'm saying 'ON/OFF' once, in the console log printing I can see the APP is 
// listening it twice or more

import React from 'react';
import { Button, Row,Col } from 'antd';
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition';
import RetrieveCommand from './RetrieveCommand';



const StartApplication = () => {

const buttonDiv = {
   marginTop : '100px',
    marginLeft : '400px',
};

const lampOffDiv = {
    border: '5px solid #ffebcc',
    backgroundColor: '#666666',
    height : '300px',
    width : '60%',
    marginLeft: '200px',
};

const lampOnDiv = {
  border: '5px solid #ffebcc',
  backgroundColor: '#adebad',
  height : '300px',
  width : '60%',
  marginLeft: '200px',
};

enum BUTTON {
    START = "Start Application",
    STOP = "Stop Application"
};

enum LAMP_STATE{
  ON = 28,
  OFF = -28,
  INITIAL = 0
}

const [buttonName, setButtonName] = React.useState(BUTTON.START);
const [commandNumber, setCommandNumber] = React.useState(LAMP_STATE.INITIAL);


const [lightOnOnce, setLightOnOnce] = React.useState(false);
const [lightOffOnce, setLightOffOnce] = React.useState(false);

React.useEffect(() => {
  if (!SpeechRecognition.browserSupportsSpeechRecognition()) {
    alert("Ups, your browser is not supported!");
  }  
}, []);

const onRegex = new RegExp('^on$','i');
const offRegex = new RegExp('^off$','i');


const commands = [
    {
      command: onRegex,
      callback: () => {
          console.log("on command");
        
          if(commandNumber === LAMP_STATE.ON){
            setLightOnOnce(false);
          }else{
            
            setCommandNumber(LAMP_STATE.ON);
            setLightOnOnce(true);
          }
          
        },
      
      matchInterim: true
    },
    {
      command: offRegex,
      callback: () => {
          
          if(lightOnOnce){
            
            if(commandNumber === LAMP_STATE.OFF){
              setLightOffOnce(false);
            }else{
              setCommandNumber(LAMP_STATE.OFF);
              setLightOffOnce(true);
            } 
          }
                       
          
        },
      matchInterim: true
    },
  ]

  const { transcript } = useSpeechRecognition({commands});
  //console.log("this is transcript :",transcript);



const handleListening = () => {
  if(buttonName === BUTTON.START){
    console.log("button start is clicked");
    setButtonName(BUTTON.STOP);
    SpeechRecognition.startListening({ continuous: true });
  }else if(buttonName === BUTTON.STOP){
    SpeechRecognition.stopListening();
    setCommandNumber(LAMP_STATE.OFF);
    setLightOnOnce(false);
    if(lightOffOnce){
      setLightOffOnce(false);
    }else{
      setLightOffOnce(true);
    }
    
    
    setButtonName(BUTTON.START);
    setCommandNumber(LAMP_STATE.INITIAL);
  }
}


return(
    <>
        <div style={commandNumber === LAMP_STATE.ON ? lampOnDiv : lampOffDiv}>
        {((commandNumber === LAMP_STATE.ON && lightOnOnce) || (commandNumber === LAMP_STATE.OFF && lightOffOnce)) && <RetrieveCommand commandNumber={commandNumber}/>}
        </div>
        <div style={buttonDiv}>
            <Button type="primary" size={'large'} onClick={handleListening}>{buttonName}</Button>
        </div>
        
    </>
);
}


export default StartApplication;

Итак, я заметил, что обратный вызов, например, для команды 'on' вызывается как минимум дважды, даже когда я говорю только один раз 'ON'.

Может ли кто-нибудь помочь мне в этом? Возможно ли, что я говорю один раз, а команда принимается один раз?

Спасибо, что заглянули!

Answer 1

Проблема в настройке matchInterim что вы установили на true.

Измените его на false, и команда будет распознана только один раз, как и должна.

Это из документации по распознаванию речи :

• matchInterim: логическое значение, определяющее, должны ли «промежуточные» результаты сопоставляться с командой. Это заставит ваш компонент быстрее реагировать на команды, но также повысит вероятность ложных срабатываний, т. Е. Команда может быть обнаружена, когда она не произносится. По умолчанию это false, и его следует устанавливать только для простых команд.

Если вам абсолютно необходимо установить для временной опции значение true (потому что она отвечает быстрее), вы можете проверить стенограмму, чтобы увидеть, действительно ли была добавлена ​​новая команда, и ответить только в таких случаях.