How to fectch API in React JS?

Question

I am trying to fetch Data form OpenWeather API.According to the docs the response is JSON.However I am getting an error of :

SyntaxError: Unexpected token < in JSON at position 0

useEffect(() => {
fetch(`api.openweathermap.org/data/2.5/weather?q=${CITY_NAME}&appid=${API_KEY}`)
.then(
  (res)=> res.json()
  .then((data)=>{
    console.log(data)
  })
  .catch((error)=>{
    console.log(error)
  })
)
}, [])

I also have a status code of 304: Not Modified when I looked through the developers tool.

There were few question which matched my problem but none of them solve my problem like: Fetching JSON returns error Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 and

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

@yudhiesh Yes!! It is valid – IcanCode Jun 21 '21 at 15:18 — IcanCode, Jun 21 '21 at 15:18

score 1 · Accepted Answer · answered Jun 21 '21 at 15:19

1

The path to the API is incorrect and should be http://api.openweathermap.org/data/2.5/weather?q=${CITY_NAME}&appid=${API_KEY} instead.

answered Jun 21 '21 at 15:19

yudhiesh

6,383
3
16
49

How to fectch API in React JS?

1 Answers1