Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>This is a known limitation with the native jsonp implementation in jQuery. The text below is from <a href="http://www.ibm.com/developerworks/library/wa-aj-jsonp1/?ca=dgr-jw64JSONP-jQuery&amp;S_TACT=105AGY46&amp;S_CMP=grsitejw64" rel="noreferrer">IBM DeveloperWorks</a></p> <blockquote> <p>JSONP is a very powerful technique for building mashups, but, unfortunately, it is not a cure-all for all of your cross-domain communication needs. It has some drawbacks that must be taken into serious consideration before committing development resources. First and foremost, there is no error handling for JSONP calls. If the dynamic script insertion works, you get called; if not, nothing happens. It just fails silently. For example, you are not able to catch a 404 error from the server. Nor can you cancel or restart the request. You can, however, timeout after waiting a reasonable amount of time. (Future jQuery versions may have an abort feature for JSONP requests.)</p> </blockquote> <p>However there's a jsonp plug-in available on <a href="http://code.google.com/p/jquery-jsonp/" rel="noreferrer">GoogleCode</a> that provides support for error handling. To get started, just make the following changes to your code.</p> <p>You can either download it, or just add a script reference to the plug-in.</p> <pre><code>&lt;script type="text/javascript" src="http://jquery-jsonp.googlecode.com/files/jquery.jsonp-1.0.4.min.js"&gt; &lt;/script&gt; </code></pre> <p>Then modify your ajax call as shown below:</p> <pre><code>$(function(){ //var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne"; // correct URL var jsonFeed = "http://api.flickr.com/services/feeds/photos_public.gne_______"; // this should throw a 404 $.jsonp({ url: jsonFeed, data: { "lang" : "en-us", "format" : "json", "tags" : "sunset" }, dataType: "jsonp", callbackParameter: "jsoncallback", timeout: 5000, success: function(data, status){ $.each(data.items, function(i,item){ $("&lt;img&gt;").attr("src", (item.media.m).replace("_m.","_s.")) .attr("alt", item.title) .appendTo("ul#flickr") .wrap("&lt;li&gt;&lt;a href=\"" + item.link + "\"&gt;&lt;/a&gt;&lt;/li&gt;"); if (i == 9) return false; }); }, error: function(XHR, textStatus, errorThrown){ alert("ERREUR: " + textStatus); alert("ERREUR: " + errorThrown); } }); }); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload