0

I am making a simple weather application using the Weather API and React. But I am having problems when the user enters a non-existent city because despite trying to deal with it, a "GET 404 (Not Found)" still appears on the console.

Fetch code:

if (evt.key === "Enter") {
    fetch(`${api.base}weather?q=${query}&units=metric&APPID=${api.key}`)
        .then(res => {
            if (res.status === 200) {
                res.json().then(result => {
                    setWeather(result);
                    setQuery('');
                });
            } else {
                console.log('Erro: ', res);
            }
        })
        .catch(err => { console.log('Failure'); });
}

Input code:

<div className="search-box">
    <input
        type="text"
        className="search-bar"
        placeholder="Search..."
        onChange={e => setQuery(e.target.value)}
        value={query}
        onKeyPress={search}
    />
</div>;

Console error:

GET https://api.openweathermap.org/data/2.5/weather?q=kdjklsjdl&units=metric&APPID=f3f25e406a03349031cc25ed16a8196d 404 (Not Found)
Lotus
  • 3
  • 3
  • What's the question? The error shows exactly what is expected. Your response code was 404, not 200, so it went into your `else` block. (you should really include console errors as text, not as a picture of text) – Heretic Monkey Mar 11 '20 at 17:56
  • No, for some reason I am not aware of, the 404 error keeps showing up on the console even if it enters else or catch. But I don't want 404 not found to appear on the console, I just want to show something on the screen to the user. – Lotus Mar 11 '20 at 18:15
  • @Lotus — Debugging tools show that information if the user wants them to. You can't suppress it. – Quentin Mar 11 '20 at 18:25
  • @Quentin I know, I just want to deal with the error – Lotus Mar 11 '20 at 18:29
  • @Quentin Well, I read what you mentioned and maybe I have to do that... Thanks – Lotus Mar 11 '20 at 18:35
  • @Lotus — Deal with the error in the `catch`. Dealing with it is not the same as concealing it from the person using the developer tools though. – Quentin Mar 11 '20 at 19:18

0 Answers0