I have some problem with $.getJSON response in Chrome
The query is
$.getJSON("http://www.askgeo.com/api/428014/sf2t36ujv1tsf325t5734gstr4/timezone.json?callback=?&points=55.77184,37.623553",
function(json){
<some code>
}
);
if you click on this link you'll get an json text.
By when I run this query Chrome shows an error:
Resource interpreted as Script but transferred with MIME type application/json
SyntaxError: Unexpected token : timezone.json:1
Does it try to convert json response to JavaScript object? If it is so why it cann't do that? Is there any way of resolving this problem?
in Chrome debugger I found the file "timezone.json" with this content:
{"code":0,"message":"ok","data":[{"timeZone":"Europe/Moscow","currentOffsetMs":14400000,"latitude":55.77184,"longitude":37.623553}]}
The server you are requesting data from is not setup to return JSONP. therefore, you need to build some kind of proxy to get the data for you, or use YQL.
Edit:
If you were to use YQL, this is the url you would use:
http://query.yahooapis.com/v1/public/yql?q=SELECT%20*%20FROM%20json%20WHERE%20url%3D%22http%3A%2F%2Fwww.askgeo.com%2Fapi%2F428014%2Fsf2t36ujv1tsf325t5734gstr4%2Ftimezone.json%3Fpoints%3D55.77184%2C37.623553%22&format=json&diagnostics=true
and for information on how I generated that url, visit:
http://developer.yahoo.com/yql/console/#h=SELECT%20*%20FROM%20json%20WHERE%20url%3D%22http%3A//www.askgeo.com/api/428014/sf2t36ujv1tsf325t5734gstr4/timezone.json%3Fpoints%3D55.77184%2C37.623553%22
You can find the url at the bottom.
Fiddle using YQL: http://jsfiddle.net/JGwU3/1/
there is however one quirk with using YQL. if the result only contains one result, it's contents is an object, however, if it is multiple, its contents will be an array. you can see the difference by console.logging the response.
In the API documentation it says, that you should provide the query paramaters in a separate JSON object as the second argument.
$.getJSON('http://www.askgeo.com/api/428014/sf2t36ujv1tsf325t5734gstr4/timezone.json', {'callback':'', 'points': '55.77184,37.623553'}, function(json) {
alert(json.data[0].timeZone);
});
Works fine when I tested it.
(This is totally ignoring JSONP)
EDIT
OK, my post was wrong, it is a JSONP issue. See this jQuery documentation page on how to retrieve the data from the URL:
http://api.jquery.com/jQuery.ajax/
Related
I am trying to get information from an API. Basically I have a URL that returns a JSON data, and I will just need to use it.
var url = "http://212.18.63.135:9034/played?sid=1&type=json";
$.getJSON(url, function(data) {
console.log(data)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
The above is my code, and it does not work.
This is an API that provides live data, so I am not sure if I can use ajax instead...
Any idea how to make it work?
UPDATE:
I updated the URL, and now it gives Access-Control-Allow-Origin error. I had a look at other question related to CORS and they all suggest to make configuration in the server side as much as I understood. But I am not looking into fixing the CORS error, I am just looking for a solution to access these JSON data.
So I hope it does not get duplicated as my point is different in this question.
You can do this way.
Adding callback=? to your URL turned your request to JSONP, so no CORS
More information about getJSON and JSONP.
If you interested how JSONP works you can read that article
var url = "http://212.18.63.135:9034/played?sid=1&type=json&callback=?";
$.getJSON(url, function(data) {
console.log(data)
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
If you just want to access the data without doing any changes in the server.Try this chrome extension Allow-Control-Allow-Origin.
I just tested with the above, it's working fine.(browser specific though)
But this is not the recommended solution, you should set the configuration on server side.
I have used $.ajaxSetup({ cache: false });
to stop caching of file in browser but it appends timestamp in along with GET request and now I'm getting 404-file not found response from server when requesting file using $.getJSON() because of this parameter after file url >?=1413455027207
>>>i.e. "http://test.com/objListObjlist.json?=1413455027207 "
Anybody have any solution how can i handle this parameter in GET request??
and yes I'm using HTML,Javascript only :)
Adding query string doeas not change the file requested by client. It is just for sending additional data to the server. Make sure you are able to get the file without query string.
Note: Appending additional unique query parameter(normally current date-time stamp) is cross-platform recommended approach for cache killing.
Refer the below Mozilla Dev link
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Bypassing_the_cache
I am trying to implement a simple request to Wikipedia's API using AJAX (XMLHttpRequest). If I type the url in the address bar of Firefox, I get a neat XML, no sweat there. Yet, calling the exact same url with:
// this is my XMLHttpRequest object
httpObjectMain.open("GET", "http://en.wikipedia.org/w/api.php?action=query&format=xml&prop=langlinks&lllimit=500&titles=kaas", true);
httpObjectMain.send(null);
returns an empty response. According to FireBug, I get a 200 OK response, but the content is just empty.
I suspect I might be missing something on the header of the GET http request.
Help! (and thanks!)
The Wikipedia API does support JSONP.
Your query string'll become something like this:
http://en.wikipedia.org/w/api.php?action=query&format=json&callback=test&prop=langlinks&lllimit=500&titles=kaas
But you'll have to build the jsonp handler (or you can use your favorite library to do it), switch to json output format from the xml you choose and create the callback function to parse the result and do the stuff you need on the page.
The browser will not allow you to send an XHR to another domain other than the one the page is on. This is for security purposes.
One way around this that I have seen is to setup a proxy on the domain the page is hosted on that will pass requests through to the actual api server. See http://ajaxpatterns.org/Cross-Domain_Proxy
I am trying to access a remote json file using YUI, example code can be seen in the jsfiddle below. The request goes off to the server (you can see it in Google dev tools network tab)
. The on success or failure functions don't get executed which I can't understand
http://jsfiddle.net/brendan_rice/4FZc4/3/
Can anyone help please?
Your datasource must support the callback syntax, wrapping the data with callback([...]);
Read the first section (in blue) http://yuilibrary.com/yui/docs/datasource/datasource-get.html
I figured out the issue by putting in YUI({ filter: 'debug' }), which showed that there was a syntax error in the .Get request (which is indicative of sending over unwrapped JSON data).
Also, if you just want the raw data from a cross-origin request and don't need a real DataSource instance, you may find Y.jsonp easier to use (http://yuilibrary.com/yui/docs/jsonp/).
I would really appreciate If anyone can explain methe following:
document.getElementById("txtHint2").innerHTML=xmlHttp.responseText;
I understand that result (right side after equal sign) will be written within div tag in this case...But what is this RESPONSETEXT actually?
I have html calling some *.js. In this I have url to php. In php is command connect to database and give results after my query.
So result of this query sholud be related to =responseText ...
I am confused and not so familiar about this ...Please help me!!!
you may read;
Using jQuery and JSON with AJAX responseText?
It contains the content from the URL you requested using the XMLHttpRequest object.
The object xmlHttp has the property responseText that is the response of your XML HTTP Request ("ajax" return). It's like when you load a page in a browser and you get your page.
This object has many properties, like:
responseText: Returns the response data as a string
responseXML: Returns the response data as XML data
Referece: http://www.w3schools.com/dom/default.asp.
xmlHttp.responseText is the body of the response from the server. It is whatever was sent back from the server based on the request (specified in the xmlHttp object). It could be a simple string of text, or a snippet of HTML, or JSON to be parsed and used by your code.
the requested url will generate an output(text/html). This output is sent to the client(requested page) through xmlHttp.responseText;
You may also get xml as an output, then you need to use xmlHttp.responseXML; you need to parse this and use it in your application..