Created
July 28, 2020 18:29
-
-
Save hackergrrl/968d694c3bffa055cfd3a4d9b1b13380 to your computer and use it in GitHub Desktop.
Voice recognition in the browser with webkitSpeechRecognition (chrom{e,ium} only)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <body> | |
| <p class="output">output will appear here</p> | |
| </body> | |
| <script> | |
| var recognition = new webkitSpeechRecognition(); | |
| // use a pre-defined grammar | |
| //var grammar = '#JSGF V1.0; grammar colors; public <color> = aqua | azure | beige | bisque | black | blue | brown | chocolate | coral | crimson | cyan | fuchsia | ghostwhite | gold | goldenrod | gray | green | indigo | ivory | khaki | lavender | lime | linen | magenta | maroon | moccasin | navy | olive | orange | orchid | peru | pink | plum | purple | red | salmon | sienna | silver | snow | tan | teal | thistle | tomato | turquoise | violet | white | yellow ;' | |
| //var speechRecognitionList = new webkitSpeechGrammarList(); | |
| //speechRecognitionList.addFromString(grammar, 1); | |
| //recognition.grammars = speechRecognitionList; | |
| recognition.continuous = false; | |
| recognition.lang = 'en-US'; | |
| recognition.interimResults = false; | |
| recognition.maxAlternatives = 1; | |
| var diagnostic = document.querySelector('.output'); | |
| var bg = document.querySelector('html'); | |
| document.body.onclick = function() { | |
| recognition.start(); | |
| console.log('Ready to receive a command.'); | |
| } | |
| // This also seems to work, even without an initial event. | |
| // recognition.start(); | |
| recognition.onresult = function(event) { | |
| var color = event.results[0][0].transcript; | |
| diagnostic.textContent = 'Result received: ' + color; | |
| bg.style.backgroundColor = color; | |
| } | |
| recognition.onend = function() { | |
| console.log('ended') | |
| } | |
| recognition.onerror = function(err) { | |
| console.log('error', err) | |
| } | |
| </script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var https = require('https') | |
| var pem = require('https-pem') | |
| const ecstatic = require('ecstatic')({ | |
| root: '.', | |
| showDir: true, | |
| autoIndex: true | |
| }) | |
| var server = https.createServer(pem, ecstatic) | |
| server.listen(4430, function () { | |
| console.log('The server is running on https://localhost:4430') | |
| }) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The API seems to require that HTTPS be used.