javascript - 为什么我在 js 上的语音识别不起作用？

Question

我一直在关注 this并用各种 youtube 视频和堆栈溢出问题对其进行补充。但是，我不确定为什么我的语音识别不起作用。我被问到很少允许麦克风访问。
我希望用户麦克风拾取用户的语音并将其附加到某个输入值。这是我的代码:

const recognition = new SpeechRecognition();
              recognition.interimResults = true;

              var recognition = new SpeechRecognition();
                recognition.onresult = function(event) {
                  if (event.results.length > 0) {
                    name.value = event.results[0][0].transcript;
                  }
                }

              recognition.addEventListener("end", () => {
                recognition.start();
              });

              var recognition = new SpeechRecognition();
                recognition.onresult = function(event) {
                  if (event.results.length > 0) {
                    location.value = event.results[0][0].transcript;
                  }
                }
              
              recognition.addEventListener("end", () => {
                recognition.start();
              });

              var recognition = new SpeechRecognition();
                  recognition.onresult = function(event) {
                    if (event.results.length > 0) {
                      state.value = event.results[0][0].transcript;
                      document.care.submit();
                    }
                  }
              
              recognition.addEventListener("end", () => {
                window.location.pathname = '/care';
                document.care.submit();
              });

以下是我收到的错误:
未捕获的 ReferenceError:未定义识别
在 HTMLButtonElement.onclick
未捕获的语法错误:标识符“识别”已被声明
无法加载资源:net::ERR_FAILED

Answer 1

我使用 SpeechRecogition 已经有一段时间了，一开始可能会非常棘手。但是，我发现这个要点对我很有帮助。希望这段代码可以帮助您更像我对 SpeechRecogition 的理解。
要点:https://gist.github.com/strongSoda/27f4caf1335e3d03accf708e1fcdcbf0
Youtube教程(对应代码):https://www.youtube.com/watch?v=4eIRrowvLRk