-1

I'm trying to get data from meta weather API. due to CORS issues, I am using this proxy thing called "crossorigin.me". still, its not letting me get the data. I even included "mode: 'no-cors" after many suggested to do so. 

<!DOCTYPE html>
<html>
<head>
    <title> Fetch Promise </title>
</head>
<body>
<script>
    function getWeather(woeid){
    fetch(`https://crossorigin.me/https://www.metaweather.com/api/location/${woeid}/`,{mode: 'no-cors'})
//fetch always returns a promise
.then(data => {
    console.log(data)
    return data.json()
    // json also returns a promise so we handle that by chaining
})
.then(result => {
const today = result.consolidated_weather[0]
console.log(`temperature in ${result.title} stay between ${today.min_temp} and ${today.max_temp}`)
})
.catch(error => console.log(error)) 
}
getWeather(2487956)
</script>
</body>
</html
  • Inspect the actual request in browser dev tools network. I get a 522 status. You can then inspect the response body and read why. In short, that proxy service appears to be unreliable – charlietfl Sep 28 '19 at 15:11

2 Answers2

1

It's possible the CORS workaround service you're using is unavailable, either due to a heavy traffic load or other reasons.

Thankfully, it's really, really easy to set up your own personal proxy using heroku.

Follow the directions in the first response of this thread: cors-anywhere.herokuapp.com not working (503). What else can I try?

Hope this helps.

Manuel D.
  • 23
  • 4
1

The MetaWeather API doesn't support CORS. You'll need to run your own server application on the same domain as your frontend to make the request and get the API response, and specify the appropriate headers: Access-Controll-Allow-Origin: * for example. See this article: https://jeremyliberman.com/2019/02/11/fetch-has-been-blocked-by-cors-policy.html

Look into Node.js and Express as a place to start.

Developenguin
  • 166
  • 5