Skip to main content

Solve Uncaught SyntaxError: Unexpected end of JSON input Pratik Sah The Crazy Programmer

We all have tried fetching the data from the server by hitting an API and parsing the response to show it on the website. Chances are, you might have got this error at some point, and this is a common error to get stuck.

If you run the following code you will get this error.

const emptyString = ''
const emptyArray = []

console.log(JSON.parse(emptyString))
console.log(JSON.parse(emptyArray))
Solve Uncaught SyntaxError: Unexpected end of JSON input

I got this error and tried resolving it. Gone through the answers on Stackoverflow and tried debugging the code, and while debugging it, I figured out why this occurs and how you can avoid this error.

This error is because we might be trying to parse an empty string or an empty array using JSON.parse()

And since we are trying to parse an empty string or empty array, end of string is reached before parsing the content of JSON text.

We have to make sure that the JSON we are trying to parse is valid. We might be getting either an empty array or an empty string as the response.

Another reason might be due to the Content-type header. The value of the Content-type header must be application/json.

Even if the server might be sending an empty response, we should be checking that as well.

How to Solve Error?

The easiest way to fix this error is to wrap our code inside a try/catch block which will help us in catching the error and with the help of that, we can show some error message.

const emptyString = ''
const emptyArray = []

try {
        console.log(JSON.parse(emptyString))
        console.log(JSON.parse(emptyArray))
} catch(err) {
        console.log(err.message);
}

I hope you found this post to be helpful. Please share your thoughts in the comments section below. Would love to read your thoughts.

The post Solve Uncaught SyntaxError: Unexpected end of JSON input appeared first on The Crazy Programmer.



from The Crazy Programmer https://ift.tt/hrg7jOo

Comments

Popular posts from this blog

Difference between Web Designer and Web Developer Neeraj Mishra The Crazy Programmer

Have you ever wondered about the distinctions between web developers’ and web designers’ duties and obligations? You’re not alone! Many people have trouble distinguishing between these two. Although they collaborate to publish new websites on the internet, web developers and web designers play very different roles. To put these job possibilities into perspective, consider the construction of a house. To create a vision for the house, including the visual components, the space planning and layout, the materials, and the overall appearance and sense of the space, you need an architect. That said, to translate an idea into a building, you need construction professionals to take those architectural drawings and put them into practice. Image Source In a similar vein, web development and design work together to create websites. Let’s examine the major responsibilities and distinctions between web developers and web designers. Let’s get going, shall we? What Does a Web Designer Do?...

A guide to data integration tools

CData Software is a leader in data access and connectivity solutions. It specializes in the development of data drivers and data access technologies for real-time access to online or on-premise applications, databases and web APIs. The company is focused on bringing data connectivity capabilities natively into tools organizations already use. It also features ETL/ELT solutions, enterprise connectors, and data visualization. Matillion ’s data transformation software empowers customers to extract data from a wide number of sources, load it into their chosen cloud data warehouse (CDW) and transform that data from its siloed source state, into analytics-ready insights – prepared for advanced analytics, machine learning, and artificial intelligence use cases. Only Matillion is purpose-built for Snowflake, Amazon Redshift, Google BigQuery, and Microsoft Azure, enabling businesses to achieve new levels of simplicity, speed, scale, and savings. Trusted by companies of all sizes to meet...

Olive and NTT DATA Join Forces to Accelerate the Global Development and Deployment of AI Solutions

U.S.A., March 14, 2021 — Olive , the automation company creating the Internet of Healthcare, today announced an alliance with NTT DATA , a global digital business and IT services leader. The collaboration will fast track the creation of new healthcare solutions to transform the health experience for humans — both in the traditional healthcare setting and at home. As a member of Olive’s Deploy, Develop and Distribute Partnership Programs , NTT DATA is leveraging Olive’s open platform to innovate, build and distribute solutions to Olive’s customers, which include some of the country’s largest health providers. Olive and NTT DATA will co-develop new Loops — applications that work on Olive’s platform to provide humans real-time intelligence — and new machine learning and robotic process automation (RPA) models. NTT DATA and Olive will devote an early focus to enabling efficiencies in supply chain and IT, with other disciplines to follow. “This is an exciting period of growth at Olive, so...