Microphone Malfunction: Abrupt End of Input Detected

I have been experimenting with SpeechRecognition to incorporate microphone functionality into one of my projects.

However, when I check the Chrome Console, it displays the error message: Unexpected end of input

    const speechRecognition =
window.webkitSpeechRecognition /*Chrome*/ ||
window.SpeechRecognition;/*Firefox...*/

function startListening() {
const recog = new speechRecognition
recog.start();
recog.onstart = console.log("Started Listening..");

recog.onresult = function (data) { 
handleResults(data);
};
//'data' comes from 'onresult'

function handleResults(data) {
let text = data.result[0][0].transcript;
console.log(text);
}

// Function Call On Page Load

window.addEventListener('DOMContentLoaded', startListening());

Answer №1

The reason behind the unexpected end of input error is due to the improper closure of the startListening function.

function initiateListening() {
  const recognition = new SpeechRecognition();
  recognition.start();
  recognition.onstart = console.log("Listening has begun...");

  recognition.onresult = function (data) { 
    processResults(data);
  }
} // There was a missing closure for this in your code

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Steps to resolve the issue: ERROR Avoid nesting VirtualizedLists inside regular ScrollViews. This error can occur even if you are not using ScrollViews

I'm currently working on a react-native app and I need to create a layout with components arranged vertically, including a transaction history section. However, I'm encountering an issue when trying to display the transaction history data from du ...

Retrieving data from the Vuex store in a Nuxt component

https://i.stack.imgur.com/htnuL.png Seeking guidance on passing a list of button names into a menu component from the Vuex store as per the instructions at https://nuxtjs.org/guide/vuex-store In my /store/store.js: export const state = () => ({ & ...

Dialogue Inventory System

I am in the process of developing a conversation system that includes a page where users can view all of their conversations and select which one they want to reply to. The layout is structured as follows: You can view an image of the layout here. The co ...

Oops! We couldn't locate or access the file you're trying to import: ~bootstrap/scss/bootstrap

Following the steps outlined on getbootstrap.com, I assumed that everything would function smoothly. Unfortunately, that hasn't been the case so far. All seems well until I attempt to load the page, at which point my Express.js app throws a: [[ ...

An error occurred in Node.js while parsing data: Headers cannot be set after they have already been sent to the client

I am currently using a CSV parser to read data from a CSV file. I then pass this data in object format to an EJS template file for printing. However, when I try to stringify the data, I encounter an error. The error message is as follows: Error [ERR_HTTP_ ...

Utilizing TypeORM to selectively choose data in OneToMany relationships

I am looking to create a TypeORM query that pulls data from the database. Specifically, I want to retrieve all clients who have made a purchase but have not initiated a return. Here is the structure of the database: Clients: Id (Int, primary column) Purc ...

Generate random floating numbers at intervals and calculate their sum

I've been given a task to complete. Upon page load, there should be 10 fields labeled as A, B, C, D ... each with the initial value of 3. After the page has loaded, every 2 seconds all field values should change randomly. The change will be a rand ...

typescript tips for incorporating nested types in inheritance

I currently have a specific data structure. type Deposit { num1: number; num2: number; } type Nice { num: number; deposit: Deposit; } As of now, I am using the Nice type, but I wish to enhance it by adding more fields to its deposit. Ultima ...

Using JQuery AJAX to successfully retrieve data and then smoothly applying the fadeIn

Utilizing AJAX, I am loading survey content into a container on a webpage. As part of the transition, I have implemented a fadeOut effect on the container, followed by fadeIn once the content is loaded. This method functions correctly for pages 1-4; howeve ...

Prevent time slots from being selected based on the current hour using JavaScript

I need to create a function that will disable previous timeslots based on the current hour. For example, if it is 1PM, I want all timeslots before 1PM to be disabled. Here is the HTML code: <div class=" col-sm-4 col-md-4 col-lg-4"> <md ...

Tips for updating the value of a key in a JavaScript object when the TextField tag's value changes

Here is the schema I am using for my model: const workoutSchema = mongoose.Schema({ workouts: [ { workoutName: String, sets: Number, reps: Number, weight: Number, }, ], }); Below is the postData referenced in the text f ...

Managing two separate instances with swiper.js

Currently, I have set up two instances of swiper.js and I am looking to scroll both while interacting with just one of them. Update: My primary objective is to replicate the core functionality seen on the swiper homepage. Update 2: I came across this lin ...

Google Chrome successfully transmits two variables with AJAX, whereas Mozilla Firefox does not send them

Having an issue with sending two values through ajax - currently only one value is being sent in Mozilla browser. Ajax script: $('#post_submit').click(function() { event.preventDefault(); var great_id = $("#post_container_supreme:first").attr(" ...

Using jQuery to import an external script into a React JS project

I'm looking to integrate an external JavaScript file (using jQuery) into a ReactJS project. While I found some guidance on this page, I am still encountering errors. The external JS file is named external.js: $(document).ready(function() { docu ...

Ways to update an angular page using the router without resorting to window.location.reload

I have a specific method for resetting values in a component page. The process involves navigating from the "new-edition" page to the "my-editions" component and then returning to the original location at "new-edition". I am currently using this approach ...

Unable to convert the BSON type to a Date in MongoDB

I am currently facing an issue while attempting to filter data stored in MongoDB utilizing parameters from the URL. Whenever I send the request, the server crashes and displays the error message: can't convert from BSON type string to Date I attemp ...

What is the reason behind AngularJS consistently selecting the first TD cell?

I'm a beginner in AngularJS and I'm testing my skills by creating a small game. Here's the table structure I have: <table class="board"> <h1>Table</h1> <input type="number" ng-model="val"><button ng-click="ctrl.f ...

What is the best way to create a select box in React that allows for both single and multiple selections?

I recently started utilizing a new package for generating dynamic forms, which can be found at this link. Upon reading through the documentation, I attempted to create a select box as outlined in the instructions provided here. Despite following the step ...

Plot the components of an array and calculate the instances that JavaScript executes

I have an array containing information about PDF files stored in a buffer. Let's imagine this array holds ten PDF files structured like this: [{ correlative: "G-22-1-06", content: <Buffer 25 50 44 46 2d 31 2e 34 0a 25 d3 eb e9 e1 0a ...

Using d3 to showcase pictures sourced from a csv file

Having recently embarked on a journey to learn javascript, d3, and the polymer project, I am facing a challenge that I hope to get some guidance on. After successfully parsing a csv file containing image information and creating an array specifically for ...