First time posting to stackoverflow.
I'm just trying to get the data from a json url using jquery.
First problem was the cross origin request block, even with libraries that are supposed to stop this issue, like ajax cross origin js (sorry not to provide this link, I'm too new to have more than 2 links on here), I was still having no luck, same cross origin error.
so I moved to JSONP.
url = "http://take-home-test.herokuapp.com/api/v1/works.json?callback=?"
$.ajaxSetup({ dataType: "jsonp" });
$.getJSON(url, function(json) {
console.log(data);
});
The problem: The server (http://take-home-test.herokuapp.com) does not have 'Access-Control-Allow-Origin' headers set. If you have access to the server, start it with the '--cors' option. Aka: node bin/http-server --cors ... This will enable CORS via the Access-Control-Allow-Origin header and should resolve your problem.
If you do not have access to the server. Here's a quick solution: proxy your request through http://cors.io. See below.
url = 'http://take-home-test.herokuapp.com/api/v1/works.json?callback=?';
new_url = "http://cors.io/?u=" + encodeURIComponent( url );
$.ajaxSetup({ dataType: "jsonp" });
$.getJSON(new_url, function(json) {
console.log(json);
});
JSFiddle: http://jsfiddle.net/davemeas/4rt3s7ta/1/ (note: you have to add jQuery to that fiddle :) )