Error: Invalid character "<" found at the beginning of JSON data

I'm struggling with a common error - the link in my browser opens fine with JSON structure, but I keep getting an error when using weatherRequest.json():

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
.

Can someone help me figure out where the problem lies?

let fetchWeather = async () => {
    const weatherRequest = await fetch(`api.openweathermap.org/data/2.5/forecast?q=München,DE&appid=my_key`);
    const weatherStore = await weatherRequest.json();
    console.log('weatherStore', weatherStore);
}

fetchWeather();

Answer №1

I personally encountered this issue and managed to solve it using two simple fixes.

  1. Instead of using fetch, switching to axios resolved the problem (although the reason fetch didn't work remains unknown).

To resolve, simply execute -> npm install axios

Then utilize by importing -> import axios from 'axios';

  1. Adding a prefix of https:// at the beginning of the API url like so
    https://api.openweathermap.org...
    also proved to be effective.

https://i.sstatic.net/uKubD.png

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

Accessing MongoDB documents that are just 24 hours old

Currently, I am attempting to retrieve the previous day's documents from MongoDB by utilizing a bash script along with JavaScript. I have successfully employed JS to send the query to MongoDB. However, I encountered an issue when handling the date fo ...

Generate all possible arrangements of zeros and ones in a two-dimensional matrix with dimensions of n by n

Looking to create a function that will generate an array of all possible 2D arrays consisting of 0s and 1s in JavaScript within a square 2D array. Essentially, this is similar to the question posed here: Make every possible combination in 2D array However ...

Modifying the Trim Function in AngularJS

Using AngularJS version 1.5.6, I encountered a bug in my large application due to the default behavior of trimming input for text type inputs. Wanting to change this behavior globally without manually updating every textarea and text input element, I am se ...

What is the optimal method for iterating through a nested array?

I've been searching like this for quite some time now, and it seems there must be a more efficient approach. The scenario is that I have a double elimination tournament bracket and need to locate a specific game. The brackets for winners and losers ar ...

Searching within a collection for a specific condition using a Mongoose query

I'm trying to clarify the title of this question, so let's skip directly to the schema: const UserSchema = new Schema({ name: String, _events: [{ type: Schema.Types.ObjectId, ref: "Event" }] }); Essentially, a user can have multiple events ...

Combining the power of HTTParty with JSON-LD Content-Type response

What is the best approach for handling HTTP requests that only accept 'application/ld+json'? I have a basic GET request that specifically requires the Content-Type to be application/ld+json. Here is an example of the code: app.rb: (This is a Sin ...

Halt the program's process until the ajax request has finished

Struggling with what seems like a common issue of the "Asynchronous Problem" and finding it difficult to find a solution. Currently, I am working on a custom bootstrap form wizard which functions as tabs/slideshow. Each step in the wizard is represented b ...

What is the process for retrieving the address of the connected wallet using web3modal?

I've been working on an application using next.js and web3. In order to link the user's wallet to the front-end, I opted for web3modal with the following code: const Home: NextPage = () => { const [signer, setSigner] = useState<JsonRpcSig ...

Discover the indices of elements that, when their values are added together, equal x

I have an array with elements structured like this: var x = 17; var arr = [{ value:2, quantity: 4 }, { value:8, quantity: 1 }, { value:3, quantity: 3 }]; How can I identify the indexes of elements that would add up to equal the x number? For example, in ...

Looking to enhance code readability using regular expressions

While I am not a programmer, I enjoy exploring and learning new things. Here is what I have: 1) My URL is structured like this: http://site.com/#!/show/me/stuff/1-12/ 2) I have a jQuery pagination script that displays the number of available pages. Each ...

Parsing a path parameter and a JSON request body simultaneously within a method

Encountering an error when my method is structured like this @POST @Path("/share") @Produces(MediaType.APPLICATION_JSON) @Consumes(MediaType.APPLICATION_JSON) public Response shareit(@PathParam("USERID") String userID,Map<String,String[ ...

Utilize jQuery to locate a specific value within a collapsible Bootstrap 4 table

Is it possible to use a Bootstrap 4 table inside a collapse? I need to search for a specific value in the table and if the value is found, I want to open the collapse and display the row containing that value. <div id="collapseStudents" class="collapse ...

Using a jQuery variable in PHP on the same page without needing to submit the form can easily be achieved

Is there a way to pass a Jquery variable to a php variable on the same page when the selected list item changes? <select name="RegistrationTypeID" class="formselectbox" id="RD" onchange="getText(this.val)"> <option value="">Select Registra ...

Rotating an arrow image on an accordion using jQuery

I have been working on this page located at Unfortunately, my attempts to showcase the issue in a jsfiddle were unsuccessful. The webpage features an accordion-style FAQ section, and I am attempting to make the arrow rotate 90 degrees when a question is ...

What is the best way to incorporate a transition on transform using Styled-components?

I attempted to add a transition on the transform property, but unfortunately, it did not produce any visible changes. I tested other properties such as: background-color, color... and they worked perfectly fine. live code: source code: // styled-compo ...

Finding and removing an element using Jquery

$.ajax({ type: "GET", url: "ajax/getLinks.php?url=" + thisArticleUrl }).done(function (data) { var extractedContent = $(data).find("#content > div > div.entry.clearfix"); extractedContent.find("#content > di ...

Ways to verify the existence of a document with specific fields in a MongoDB database

I'm currently attempting to verify if a document with specific fields already exists in the database. My goal is to ensure that there are no other objects with identical name and surname as the player object already stored in the database. Additional ...

Comparing Jscript's impact on CSS classes to the power of Json

On my HTML page, there is a div that looks like this: <div class="circle active" id="prg_inizio"> bla bla bla </div> After making an Ajax call, I receive a JSON result and need to update the class name from "circle active" to "circle done." ...

JasmineJS: manipulating the DOM to achieve the desired outcome

Currently, I am in the process of writing unit tests for a function that requires fetching values from the DOM for processing. getProducts: function() { //Creating query data var queryData = {}; var location = this.$('#location').val(); ...

Include the referrer header when using the chrome.downloads API

I have been working on developing an extension that replicates the Ctrl+Click to save image functionality from Opera 12. In my extension, I am utilizing chrome.downloads.download() in the background script to trigger downloads, while a content script is re ...