So, things were going great (for a change) with my weather app until things came crashing down inexplicably. The weather and all the info i queried from the api used to load perfectly but suddenly everything went blank and i got this error on the console: XMLHttpRequest cannot load https://api.wunderground.com/api/c1d9333a91ec52f6/conditions/q/25.594094700000003,85.1375645.json. The 'Access-Control-Allow-Origin' header has a value 'http://www.wunderground.com' that is not equal to the supplied origin. Origin 'https://s.codepen.io' is therefore not allowed access.
Here is my pen
Anybody got any idea what’s wrong?
Update: Turns out that my API key has been disabled.
This is known as a CORS (Cross Origin Resource Sharing) issue. The usual solution to this is to either request JSONP instead of JSON, or to use a proxy like http://crossorigin.me.
@jaytsecan has written a good explanation of this linked below. You can also search the forums for plenty of discussions of this problem. The way you request JSONP can differ from provider to provider, so check their documentation to see how they suggest sending your request.