Problem with api in react

Hi, I have a mistake when I try to run component with updateByGeo.

I can’t look at this in more detail, but re the error message, you’re getting an error response to the request (404, 500, whatever) and it’s returning an HTML error page. That’s why you get the JSON parse error, it’s trying to decode HTML, not JSON, and throwing an error.

1 Like

when I change this.sendRequest(updateByGeo) to this.sendRequest(updateByGeo()) it returns 400 error

updateByGeo takes two args. So if you don’t pass them, you’re going to get a malformed URL string, as lat and long will be undefined, thence a 400

1 Like

I rewrite my code, but there is no defined lat and lon, maybe something with navigator ?

You’re not [a]waiting on the response for the latitude/longitude, so lat and long will be undefined - you want something like [sorry, not tested]:

const data = await getGeodata(lat, lon);
const city = await data.city.name;
1 Like

Thanks bro :slightly_smiling_face:, but still not working

Bloody hell, I forgot how much of a PITA the navigator API is. It isn’t built for promises so you have to wrap it and I always forget how to do it: I just copy pasted a solution from Stack Overflow. Once that was fixed, adding the awaits fixes it.

https://codesandbox.io/s/yv04y3w41v

Note because the browser is going to ask if you want to allow access, you won’t get the location straightaway

2 Likes

thanks a lot :slightly_smiling_face: