webkitSpeechRecognition 不显示中间结果

webkitSpeechRecognition does not show interim results

我正在尝试实现此语音识别服务,如 HERE and display results with INTERIM (the text that alternates before the final result) similar to THIS 示例所述。您可以看到文本在到达最终结果之前交替出现。我正在关注的教程(第一个 link)也给出了一个实现此功能的示例,但它只给了我最终答案,并没有显示单词迭代动画。

  <span id="final_span"></span>
   <span id="interim_span" style="color: grey"></span>

   <button id="button" type="button" onclick="toggleStartStop()"></button>

和Javascript:

 <script type="text/javascript">
                var recognizing;
                var recognition = new webkitSpeechRecognition();
                recognition.continuous = true;
                recognition.interim = true;
                reset();
                recognition.onend = reset;

                recognition.onresult = function (event) {
                    var final = "";
                    var interim = "";
                    for (var i = 0; i < event.results.length; ++i) {
                        if (event.results[i].final) {
                            final += event.results[i][0].transcript;
                        } else {
                            interim += event.results[i][0].transcript;
                        }
                    }
                    final_span.innerHTML = final;
                    interim_span.innerHTML = interim;
                }

                function reset() {
                    recognizing = false;
                    button.innerHTML = "Click to Speak";
                }

                function toggleStartStop() {
                    if (recognizing) {
                        recognition.stop();
                        reset();
                    } else {
                        recognition.start();
                        recognizing = true;
                        button.innerHTML = "Click to Stop";
                        final_span.innerHTML = "";
                        interim_span.innerHTML = "";
                    }
                }
            </script>

我做错了什么?我需要创建与 THIS

完全相同的东西

根据 documentation

你需要

    recognition.interimResults = true;

与您当前的来源不同

    recognition.interim = true;

如果您检查所链接页面的源代码,您也可以弄清楚这一点。