TypeScript 中的语音识别和语音合成

SpeechRecognition and SpeechSynthesis in TypeScript

我能够通过创建如下界面在 TypeScript 中 运行 SpeechRecognition,它工作正常:

namespace CORE{
    export interface IWindow extends Window{
        webkitSpeechRecognition: any;
    }
}

我尝试对 SpeechSynthesis 使用相同的方法,但是字段,下面的代码不起作用:

namespace CORE{
    export interface IWindow extends Window{
        SpeechSynthesisUtterance: any;
        speechSynthesis: any;
    }
}

我的问题是:

  1. 是我以前定义的方式SpeechRecognition是最好的 练习要遵循 TypeScript,或者有更好的方法。
    1. 如何在 TypeScript 中使用 SpeechSynthesis

供参考,下面是我的 SpeechRecognition:

的工作代码
namespace CORE{
    export interface IWindow extends Window{
        webkitSpeechRecognition: any;
    }
}

namespace CORE{
     export class speakRecognation{
    //    spoken:string;
        constructor(input:HTMLInputElement){
            var audio = new Audio('/sounds/sound.mp3');
            //Voice recognition

            const {webkitSpeechRecognition}: IWindow = <IWindow>window;
            const recognition = new webkitSpeechRecognition();
            recognition.continuous = false;
            recognition.interimResults = true;

            input.addEventListener("click", function(){
                audio.play();
                recognition.start();
                });

            recognition.onstart = function () {
                recognition.recognizing = true;
            };

            recognition.onresult = function (event) {
            var interim_transcript = '';
                for (var i = event.resultIndex; i < event.results.length; ++i) {
                    if (event.results[i].isFinal) {
                        var result = event.results[i][0].transcript;
                        input.value = result;
                      //  input.disable=false;
                        Program.execute(result);
                        recognition.stop();

                    } else {
                        interim_transcript += event.results[i][0].transcript;
                        input.value = interim_transcript;
                    }
                    }
            };

           recognition.onerror = function (event) {
                input.value = "Something went wrong. Try reloading the page.";
            }

            recognition.onnomatch = function (event) {
                input.value = "no match";
            }

           input.addEventListener("blur", function(e) {
                recognition.stop();
                input.value='';
            });

            input.addEventListener('keypress', function (e) {
                recognition.stop();
                var key = e.which || e.keyCode;
                if (key === 13) { // 13 is enter
                    Program.execute(input.value);
                }
            });
        }
    }
}

低于我的尝试SpeachSynthesis;

namespace CORE{
    export interface IWindow extends Window{
        SpeechSynthesisUtterance: any;
        SpeechSynthesis: any;
    }
}

namespace CORE{
     export class speakSynthesis{
         constructor(input:String){
                 if ('speechSynthesis' in window) {
                    console.log('Your browser supports speech synthesis.');
                // speak('hi');
                } else {
                    alert('Sorry your browser does not support speech synthesis. Try this in <a href="https://www.google.com/chrome/browser/desktop/index.html">Google Chrome</a>.');
                }
        const {SpeechSynthesisUtterance}: IWindow = <IWindow>window;
        const {SpeechSynthesis}: IWindow = <IWindow>window;

       // Create a new instance of SpeechSynthesisUtterance.
        var msg = new SpeechSynthesisUtterance();
        // Set the text.
        msg.text = input;
       // Set the attributes.
        msg.lang = 'en-US';
       // msg.voice = 'native'; msg.voice = 'Google US English'; //  'Google UK English Female' 
        msg.voice = 'Google US English' 
        msg.volume = 1;
        msg.rate = 1;
        msg.pitch = 1;
       //  msg.onend = function(event) { console.log('Speech complete'); }
        // Queue this utterance.
        var talk = new SpeechSynthesis();
        window.talk.speak(msg);
        }
     }
}

到目前为止我得到的确切错误如图所示。

感谢 this,我找到了将 speechSynthesis 添加到 Window 变量的解决方案:

(<any>window).speechSynthesis.speak(msg);
// OR
(window as any).talk.speak(msg);

此外,我在我的代码中发现了另一个错误,即: speechSynthesis 应该以小 s 开头,我的错误是大写 S

我喜欢 post 这个答案,以防将来有人需要它。