How to load a .json file from another website? - javascript

I need to get a json file from a website: "http://fipeapi.appspot.com/api/1/carros/marcas.json" that doesn't implement JSONP callback function, it only returns several errors.
I've tried to get using a JSON call and returns error "200 OK" because of the crossdomain issue, i've already tried JSONP too, but it returns "parsererror" because the remote server doesn't wrap the response on a callback function.
There's some way to get this content or it's impossible?

As suggested by Musa and Kevin B, you can use a proxy server script that will wrap the actual source you're trying to get in JSONP or CORS. For example JSONProxy allows you to request
http://jsonp.jit.su/?callback=myCallback&url=http://fipeapi.appspot.com/api/1/carros/marcas.json
Which will return the data wrapped in a call to myCallback(). The site also supports CORS if you prefer that, there's some examples in the link I provided above.

Related

Why won't $.getJson work with json or jsonp?

I am trying to pull information from Google Finances stock screener. There is no official api, so I am just making a get request to the same URL that they use on the site. I am using the URL at the bottom of the question, it can get a bit long. I can go to the url myself and it will give me a text file with the JSON information. In my javascript I am using $.getJSON on the url to get the screener results. But I get a Access-Control-Allow-Origin error, so I change output=json to output=jsonp&callback=?. But it only returns ();. From what I can tell this means that it is not set up on the other end to respond to a jsonp request and cannot return the proper information.
I have also tried output=json&callback=?, which produces the (); and output=json&callback=callbackFunction and output=json&callback=callbackFunction which both give me Access-Control-Allow-Origin.
Is there any way that I can make this work?
https://www.google.com/finance?output=json&start=0&num=20&noIL=1&q=[currency%20%3D%3D%20%22USD%22%20%26%20%28%28exchange%20%3D%3D%20%22OTCMKTS%22%29%20%7C%20%28exchange%20%3D%3D%20%22OTCBB%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSEMKT%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSEARCA%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSE%22%29%20%7C%20%28exchange%20%3D%3D%20%22NASDAQ%22%29%29%20%26%20%28market_cap%20%3E%3D%200%29%20%26%20%28market_cap%20%3C%3D%200.1%29]&restype=company&ei=GLyhVKmcDpOb8gbm7IGQAQ
If the service doesn't provide a JSONP endpoint or use CORS to grant you permission to access some other kind of endpoint, then there is no way to access the data using client side code.
Use server side code instead. You can use that to present the data to your client side code.

JavaScript REST Request without AJAX (omit JSONP)?

I'm using JSONP to send a REST Request, and I can see the response (json) in the chrome dev tools but can't use the result because I'm getting the error "unexpected token :". As you can read in linked question, this is because a function is expected as response (i get json).
Because I can't modify the webservice I need to access the webservice without AJAX so I dont have those problems with "same origin policy" and can use normal json as the data type. Every Example I can find is using AJAX. Isn't there another possibility?

Access-Control-Allow-Origin headers in GAS

I am sending an (HTTP GET) $.ajax request (from jsfiddle) to my Google Apps Script server and I get the following error:
XMLHttpRequest cannot load https://script.google.com/macros/s/mykey?params.
Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
What is the best way to solve this problem?
I have successfully implemented jsonp $.ajax requests to retrieve json data and javascript using this GAS/jsfiddle configuration. However, I seem unable to accomplish this jsonp success this time. Possibly because I am going through an .updaterow() function (per jqWidgets?)
My research:
This post almost asks a similar question except it is not specific to GAS.
I do not think GAS allows one to set server-side response headers. But surely there must be a way to get my request to execute?
Perhaps this question explains it better? (GAS issue) Is there a workaround solution? (Come on creative people.)
GAS does not allow CORS headers at this time.

Javascript Instagram API showing answer in browser but not in JS

I'm just writing a little Instagram app. In a fact when I try to get response from this url in JS :
https://api.instagram.com/v1/tags/search?q=money&client_id=f40dfb17ddd144598d562a6f58179006
but for some reason I dont get an answer and no error at all. If I call the url in my Browser I got a JSON formated answer.
Here my fiddle
http://jsfiddle.net/XQ28k/
Since you are planning to do a cross domain request, you should try the JSONP variant of the API by adding &callback=? to the end of the URL
https://api.instagram.com/v1/tags/search?q=money&client_id=f40dfb17ddd144598d562a6f58179006&callback=?
You cannot access a different domain from your current domain (where you make the ajax call).
It will give you cross origin error
Ajax calls only works on the same domain!
A workaround for this is to call a page in your server that this page will make the remote call to Instagram servers and make an ajax call to this page:
php example - in your server page.php:
$url = 'https://api.instagram.com/v1/tags/search?q=money&client_id=f40dfb17ddd144598d562a6f58179006';
$content = file_get_contents($url);
echo($content); //no need to json_encode cause the response returning a json already!
and in your client side code just call to page.php (which is in your server - so it's the same domain):
$.getJSON("page.php",function(json){
alert(json.data);
});

Google Geocoding ajax request with Yahoo YUI 3

I understand the way to make an ajax call in YUI 3 is using the IO utility.
I want to get the address of a location from Google's geocoding API.
<script type="text/javascript"><!--
YUI().use('io-base', function(Y) {
function complete(id, o) {
var data = o.responseText; // Response data.
alert(o.responseText);
};
Y.on('io:complete', complete, Y);
var request = Y.io("http://maps.googleapis.com/maps/api/geocode/json?language=en&sensor=false&latlng=12,34);
});
//-->
</script>
I get a reply with method OPTIONS and status code 405 Method Not Allowed.
I believe this is because of some "preflight" permission check. I do not receive the desired response. If I copy and paste the url into the browser, I see the json data.
I could post the ajax request to a php script on my own domain and get the json response with curl.
But why have this extra step if I could just get the data in javascript?
So what can I do to solve this? Is the IO utility not the right library to use?
You're making a cross-domain XHR request, and running into the "Same origin policy", a generic restriction in client-side JavaScript. See for example Why do I still receive 405 errors even though both URLs are from XXXX.com?
There are various ways to work around this problem:
1) Make a server-side request in PHP, as you suggest
2) Use the YUI jsonp module
3) Use the YUI YQL module, which proxies your request through Yahoo! servers and handles JSONP housekeeping for you
There are many other ways to tackle this problem, but those three should get you started.
Y.io has support for cross domain requests. See http://yuilibrary.com/yui/docs/io/#cross-domain-transactions
You need to properly config it with the "xdr" property, and load the "io-xdr" module, etc. This example uses it as well: http://yuilibrary.com/yui/docs/io/weather.html

Categories

Resources