--- title: Speech Recognition API - The Ultimate Guide description: There are hundreds of speech recognition API like Google Speech, IBM Watson, etc. but our modern browser already has built-in Web Speech API. image: https://www.terasoltechnologies.com/hubfs/The-Ultimate-Guide-on-Speech-Recognition-API-for-You.jpg --- Want to know how much it costs to create an app? Here's a link to our free **[App Cost Calculator.](https://www.terasoltechnologies.com/how-much-to-make-a-mobile-app-calculator?hsLang=en)** [![Terasol-Technologies-logo](https://www.terasoltechnologies.com/hubfs/Terasol-Technologies-logo.svg "Terasol-Technologies-logo")](https://www.terasoltechnologies.com/) - Who we are - [About us](https://www.terasoltechnologies.com/about-terasol-technologies) - [Our Work](https://www.terasoltechnologies.com/our-work) - [Career with us](https://www.terasoltechnologies.com/jobs-in-noida) - What we do - [Product Engineering](https://www.terasoltechnologies.com/product-engineering-services) - [Digital Transformation](https://www.terasoltechnologies.com/digital-transformation-agency) - [Enterprise Application Modernization](https://www.terasoltechnologies.com/enterprise-application-modernization) - How we do - [Full Cycle - Full Stack Development](https://www.terasoltechnologies.com/managed-services) - [Staff Augmentation](https://www.terasoltechnologies.com/staff-augmentation) - [Maintenance as a Service](https://www.terasoltechnologies.com/application-maintenance) - Insights - [Blog](https://www.terasoltechnologies.com/blog) - [Case Studies](https://www.terasoltechnologies.com/case-study) - [Use Cases](https://www.terasoltechnologies.com/use-case) - [App Cost Calculator](https://www.terasoltechnologies.com/how-much-to-make-a-mobile-app-calculator) - [Website Grader](https://www.terasoltechnologies.com/website-grader) [Request a Quote](https://www.terasoltechnologies.com/?hsLang=en#footer-enquiry-form) [![Terasol-Technologies](https://www.terasoltechnologies.com/hs-fs/hubfs/Website%20Pages%20Images/Terasol%20Logo.png?width=168&height=42&name=Terasol%20Logo.png "Terasol-Technologies")](https://www.terasoltechnologies.com/) [Request a Quote](https://www.terasoltechnologies.com/?hsLang=en#footer-enquiry-form) [![Terasol-Technologies-logo](https://www.terasoltechnologies.com/hubfs/Terasol-Technologies-logo.svg "Terasol-Technologies-logo")](https://www.terasoltechnologies.com/) - Who we are - [About us](https://www.terasoltechnologies.com/about-terasol-technologies) - [Our Work](https://www.terasoltechnologies.com/our-work) - [Career with us](https://www.terasoltechnologies.com/jobs-in-noida) - What we do - [Product Engineering](https://www.terasoltechnologies.com/product-engineering-services) - [Digital Transformation](https://www.terasoltechnologies.com/digital-transformation-agency) - [Enterprise Application Modernization](https://www.terasoltechnologies.com/enterprise-application-modernization) - How we do - [Full Cycle - Full Stack Development](https://www.terasoltechnologies.com/managed-services) - [Staff Augmentation](https://www.terasoltechnologies.com/staff-augmentation) - [Maintenance as a Service](https://www.terasoltechnologies.com/application-maintenance) - Insights - [Blog](https://www.terasoltechnologies.com/blog) - [Case Studies](https://www.terasoltechnologies.com/case-study) - [Use Cases](https://www.terasoltechnologies.com/use-case) - [App Cost Calculator](https://www.terasoltechnologies.com/how-much-to-make-a-mobile-app-calculator) - [Website Grader](https://www.terasoltechnologies.com/website-grader) [Request a Quote](https://www.terasoltechnologies.com/?hsLang=en#footer-enquiry-form) [![Terasol-Technologies](https://www.terasoltechnologies.com/hs-fs/hubfs/Website%20Pages%20Images/Terasol%20Logo.png?width=168&height=42&name=Terasol%20Logo.png "Terasol-Technologies")](https://www.terasoltechnologies.com/) [Request a Quote](https://www.terasoltechnologies.com/?hsLang=en#footer-enquiry-form) # The Ultimate Guide on Speech Recognition API for You By [Sanjay](https://www.terasoltechnologies.com/blog/author/sanjay) Jan 28, 2019 12:00:00 AM 2 Minutes Read Recently, I got a task to make a [Voice-Controlled Web Application.](https://www.terasoltechnologies.com/web-development) Although I was never familiar with such things and their working. So, I started doing my homework in the field of Speech Recognition. It was all overwhelming in the beginning but I found some useful resources on the Internet. I got a blog on [code burst](https://codeburst.io/html5-speech-recognition-api-670846a50e92) by [Kai Wedekind](https://medium.com/@kai_wedekind), and after reading his blog, more of the doubt on Speech Recognition was cleared. Before, getting started to code my very first voice-enabled web application. I have done a little bit of research on Speech Recognition. There are hundreds of [APIs](https://www.terasoltechnologies.com/blog/what-is-api-development-guide) available for voice recognition like Google Speech, IBM Watson, and many more but our modern browser is already loaded with built-in Web Speech API. ![Speech Recognition API](https://www.terasoltechnologies.com/hs-fs/hubfs/Imported_Blog_Media/rsz_screenshot_1-1.png?width=1120&height=541&name=rsz_screenshot_1-1.png) [Source: https://caniuse.com/#search=Speech](https://caniuse.com/#search=Speech) Web Speech API is an experimental API available in Google Chrome and Mozilla Firefox. If ever made any AJAX call in javascript, this is going to be very simple for you. Let's Start first by checking the support of Web Speech API in our browser(recommend using **Google Chrome**). Basically, after invoking the above function you can check that your browser is ready for further development. *Still with me, means you have a modern browser.* Now create a new speech recognition object. ``` let recognition = new window.SpeechRecognition(); ``` This recognition object has many properties, methods, and event handlers. You can read the API documentation [here.](https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition) We will talk following the `recognition.onresult`event handlers which come out as the response from the API. It will ask for permission to access the microphone, and a browser's dialog will appear. (of course, allow it) Now, Whatever you speak from the microphone will appear on the `console.log()` ``` recognition.onresult = function() { const transcript = Array.from(e.results) .map(result=>result[0]) .map(result=>result.transcript) .join(''); console.log('You Said: ',transcript); }; ``` ## **Important Properties** Now, from the above snippet result will be logged after the end of the speech end. There are various properties available so that you can stream transcripts as you want. Let's talk about a few of them `recognition.interimResults = true`(by default it's false). This will allow you to log the transcript while you are speaking. You will notice after the speech ends recognition system stops. So you can make it continuous listening by activating the `recognition.continuous = true` Now it's always ready to understand your speech. If the transcript does not appear that much correct you can collect a bunch of alternative transcripts too, by setting up the number of alternatives you want `recognition.maxAlternatives = 2`(by default it's 1). ## **Handling Accents during Speech Recognition** If you are developing your app in a different language other than English, you can improve the result by changing the `recognition.lang = "hi-IN"` ( hi-Hindi IN-India). By default, it's "en-US". Here's my Git Repository: [https://github.com/imshivamgupta/speechrecognitionapi.git](https://github.com/imshivamgupta/speechrecognitionapi.git) APIs have been shown to increase business earnings by facilitating technology connectivity. You can also create and integrate the necessary API for your company with our [software development company](https://www.terasoltechnologies.com/). **[Feel free to contact us](https://terasoltechnologies.com/enquiryform/?source=blog)** if you want to get a Voice-Controlled Web Application.   ![linkedin-sharing](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/linkedin-sharing.svg) ![twitter-sharing](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/twitter-sharing.svg) ![facebook-sharing](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/facebook-sharing.svg) ## Recommended For You [![](https://www.terasoltechnologies.com/hubfs/Modernize-Legacy-System-for-the-Digital-Future.jpg)](https://www.terasoltechnologies.com/blog/modernize-legacy-system-for-the-digital-future) 4 Min Read ### [Modernize Legacy System for the Digital Future](https://www.terasoltechnologies.com/blog/modernize-legacy-system-for-the-digital-future) [Kanika Mar 7, 2022 4:51:43 PM](https://www.terasoltechnologies.com/blog/author/kanika) [![](https://www.terasoltechnologies.com/hubfs/Perks-of-Outsourcing-IT-Services.jpg)](https://www.terasoltechnologies.com/blog/top-8-perks-of-outsourcing-it-service) 5 Min Read ### [8 Amazing Perks of Outsourcing IT Services for Your Business](https://www.terasoltechnologies.com/blog/top-8-perks-of-outsourcing-it-service) [Kanika Nov 19, 2021 12:00:00 AM](https://www.terasoltechnologies.com/blog/author/kanika) [![API Development, Tools, Working, & Best 6 Practices](https://www.terasoltechnologies.com/hubfs/Terasol%20Blogs/API%20Development%2c%20Tools%2c%20Working%2c%20%26%20Best%206%20Practices.jpg)](https://www.terasoltechnologies.com/blog/what-is-api-development-guide) [Business](https://www.terasoltechnologies.com/blog/tag/business) 10 Min Read ### [What is API Development, Tools, Working, & Best 6 Practices?](https://www.terasoltechnologies.com/blog/what-is-api-development-guide) [Kanika May 13, 2022 12:45:33 PM](https://www.terasoltechnologies.com/blog/author/kanika)  Share the details of your project ##### Give us a brief insight into your idea, requirement, and budget. We will carefully analyze your business needs and craft the perfect solution for you! ## Company - [About Us](https://www.terasoltechnologies.com/about-terasol-technologies) - [Blog](https://www.terasoltechnologies.com/blog) - [Our Work](https://www.terasoltechnologies.com/our-work) - [App Cost Calculator](https://www.terasoltechnologies.com/how-much-to-make-a-mobile-app-calculator) - [Careers](https://www.terasoltechnologies.com/jobs-in-noida) - [Privacy Policy](https://www.terasoltechnologies.com/privacy-policy) [Follow us on Facebook](https://www.facebook.com/terasoltechnologies/) [Follow us on LinkedIn](https://www.instagram.com/terasol_technologies/?hl=en) [Follow us on Twitter](https://twitter.com/Terasol_app) [Follow us on Instagram](https://www.behance.net/terasol-technologies/) [Follow us on Facebook](https://www.linkedin.com/company/terasol-technologies-pvt-ltd) [Follow us on Facebook](https://www.youtube.com/channel/UCJ2d9c4_IgLcOhCFCJkDA3A) ## Services - [Mobile App Development](https://www.terasoltechnologies.com/mobile-app-development) - [Web App Development](https://www.terasoltechnologies.com/web-development) - [Product Design](https://www.terasoltechnologies.com/product-design) - [Application Maintenance](https://www.terasoltechnologies.com/application-maintenance) - [Managed Services](https://www.terasoltechnologies.com/managed-services) - [Staff Augmentation](https://www.terasoltechnologies.com/staff-augmentation) ## Contacts **Head Office:** I.T. Tower, Plot No 29, Sector 142, Noida, Uttar Pradesh 201301   **Sales Office:**75 Water Street New York City, NY 10005 United States [![Terasol-technologies-US](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/Terasol-technologies-US.svg)](https://www.terasoltechnologies.com/dedicated-custom-software-development-company-in-india)     [![Terasol-technologies-uk-1](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/Terasol-technologies-uk-1.svg) ](https://www.terasoltechnologies.com/dedicated-bespoke-app-developers-in-uk) [![Clutch-Terasol](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/Clutch-Terasol.jpg "Clutch-Terasol")](https://clutch.co/profile/terasol-technologies) [![GoodFirm](https://www.terasoltechnologies.com/hubfs/Website%20Pages%20Images/GoodFirm.jpg "GoodFirm")](https://www.goodfirms.co/company/terasol-technologies) ###### [![Terasol-Technologies-DMCA](https://www.terasoltechnologies.com/hs-fs/hubfs/Website%20Pages%20Images/dmca-badge-w150-5x1-06.png?width=150&name=dmca-badge-w150-5x1-06.png)](https://www.dmca.com/Protection/Status.aspx?ID=87ca5d2f-f73e-4e0d-af1a-086f426197f6&refurl=https://terasoltechnologies.com/)      Copyright © 2014 -22. All Rights Reserved