Using Google Text-To-Speech in Javascript

后端 未结 6 2030
一生所求
一生所求 2020-12-12 10:58

I need to play Google text-to-speech in JavaScript.
The idea is to use the web service:

http://translate.google.com/translate_t

相关标签:
6条回答
  • 2020-12-12 11:05

    Another option now may be HTML5 text to speech, which is in Chrome 33+ and many others.

    Here is a sample:

    var msg = new SpeechSynthesisUtterance('Hello World');
    window.speechSynthesis.speak(msg);
    

    With this, perhaps you do not need to use a web service at all.

    0 讨论(0)
  • 2020-12-12 11:10

    Here is the code snippet I found:

    var audio = new Audio();
    audio.src ='http://translate.google.com/translate_tts?ie=utf-8&tl=en&q=Hello%20World.';
    audio.play();
    
    0 讨论(0)
  • 2020-12-12 11:17

    You can use the SpeechSynthesisUtterance with a function like say:

    function say(m) {
      var msg = new SpeechSynthesisUtterance();
      var voices = window.speechSynthesis.getVoices();
      msg.voice = voices[10];
      msg.voiceURI = "native";
      msg.volume = 1;
      msg.rate = 1;
      msg.pitch = 0.8;
      msg.text = m;
      msg.lang = 'en-US';
      speechSynthesis.speak(msg);
    }
    

    Then you only need to call say(msg) when using it.

    Update: Look at Google's Developer Blog that is about Voice Driven Web Apps Introduction to the Web Speech API.

    0 讨论(0)
  • 2020-12-12 11:21

    Very easy with responsive voice. Just include the js and voila!

    <script src='https://code.responsivevoice.org/responsivevoice.js'></script>
    
    <input onclick="responsiveVoice.speak('This is the text you want to speak');" type='button' value='                                                                    
    0 讨论(0)
  • 2020-12-12 11:23

    Run this code it will take input as audio(microphone) and convert into the text than audio play.

    <!doctype HTML>
    <head>
    <title>MY Echo</title>
    <script src="http://code.responsivevoice.org/responsivevoice.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.1/css/font-awesome.min.css" />
    <style type="text/css">
        body {
            font-family: verdana;
        }
    
        #result {
            height: 100px;
            border: 1px solid #ccc;
            padding: 10px;
            box-shadow: 0 0 10px 0 #bbb;
            margin-bottom: 30px;
            font-size: 14px;
            line-height: 25px;
        }
    
        button {
            font-size: 20px;
            position: relative;
            left: 50%;
        }
    </style>
    

    Speech to text converter in JS var r = document.getElementById('result');

        function startConverting() {
            if ('webkitSpeechRecognition' in window) {
                var speechRecognizer = new webkitSpeechRecognition();
                speechRecognizer.continuous = true;
                speechRecognizer.interimResults = true;
                speechRecognizer.lang = 'en-IN';
                speechRecognizer.start();
                var finalTranscripts = '';
                speechRecognizer.onresult = function(event) {
                    var interimTranscripts = '';
                    for (var i = event.resultIndex; i < event.results.length; i++) {
                        var transcript = event.results[i][0].transcript;
                        transcript.replace("\n", "<br>");
                        if (event.results[i].isFinal) {
                            finalTranscripts += transcript;
                            var speechresult = finalTranscripts;
                            console.log(speechresult);
                            if (speechresult) {
                                responsiveVoice.speak(speechresult, "UK English Female", {
                                    pitch: 1
                                }, {
                                    rate: 1
                                });
                            }
                        } else {
                            interimTranscripts += transcript;
                        }
                    }
                    r.innerHTML = finalTranscripts + '<span style="color:#999">' + interimTranscripts + '</span>';
                };
                speechRecognizer.onerror = function(event) {};
            } else {
                r.innerHTML = 'Your browser is not supported. If google chrome, please upgrade!';
            }
        }
    </script>
    </body>
    
    </html>
    
    0 讨论(0)
  • 2020-12-12 11:30

    I don't know of Google voice, but using the javaScript speech SpeechSynthesisUtterance, you can add a click event to the element you are reference to. eg:

    const listenBtn = document.getElementById('myvoice');
    
    listenBtn.addEventListener('click', (e) => {
      e.preventDefault();
    
      const msg = new SpeechSynthesisUtterance(
        "Hello, hope my code is helpful"
      );
      window.speechSynthesis.speak(msg);
    
    });
    <button type="button" id='myvoice'>Listen to me</button>

    0 讨论(0)
提交回复
热议问题