Api Working In Browser But Not In Fetch Javascript?

I am using openweather api to create a weather application but my fetch api call is not working. My api call is working in browser but not in my code. handleSubmit(){ var city

Solution 1:

Problem 1

Your URL is wrong.

var url = 'api.apixu.com...

You forgot the scheme (https:// or something should be at the front of that).

Problem 2

You said mode: "no-cors" which means:

I want to make this HTTP request, but I am not going to do anything that requires permission, so don't ask for permission, don't do anything that needs permission, and don't throw errors if I don't get permission

Reading data from a different origin requires permission. Since you said you didn't want permission, you can't read the data and it fails silently.

Remove mode: "no-cors". Use mode: "cors" instead.

Solution 2:

I had the same issue and the only thing that worked for me was to send my request to a proxy server. This redirect did not work too:

const baseUrl = 'https://cors-anywhere.herokuapp.com'

After troubleshooting this issue for a long time, I redirected the response to another website and finally works.

constApp = () => {
  ....

  const baseUrl = 'https://thingproxy.freeboard.io/fetch/';