I’m trying to build the random quote generator and have trouble getting JSON object from the API. I’m using an extremely basic html and javascript just to see if the API is returning something and get nada when pressing button. Any ideas?
Hey there! It looks like you haven’t added a script for jquery in the javascript settings so by default it won’t be recognized. Just a tip, use your console, it’s a really powerful tool for debugging. It was showing that “$” is not defined, a dead giveaway that the jquery syntax wasn’t being processed.
Thanks! Console has proven to be awesome. I didn’t realize that it outputs error messages. I fixed the two issues but now I get a new one: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
Google seems to tell me that it is a cross domain issue and for security reasons Chrome is blocking that request. Do you have any advice on what to use to go around this issue? CORS and jsonp are the terms I noticed being thrown around.
The forismatic APi responds to GET using JSONP (https://en.wikipedia.org/wiki/JSONP) This particular API wants the callback to be named jsonp. You should add &jsonp=? to your request url. format should also be set to jsonp.
Try this $.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=?", function(json){...})
You might also want to look into [CORS Anywhere] (https://github.com/Rob--W/cors-anywhere), a NodeJS proxy server that adds the required headers to requests. I spun up a version on heroku with my domain whitelisted for the production version of my projects, along with an embedded dev version for localhost.