Difference between revisions of "JSONp"

Revision as of 12:33, 29 May 2010

JSON with Padding (commonly abbreviated JSONP) is a JSON extension wherein a prefix is specified as an input argument of the call itself. This padding prefix is typically the name of a callback function, but may also be a variable assignment, an if statement, or any other Javascript statement prefix. The original proposition appears to have been made in the MacPython blog in 2005 [17] and is now used by many Web 2.0 applications such as Dojo Toolkit Applications, Google Toolkit Applications[18] and Web Services. Further extensions of this protocol have been proposed by considering additional input arguments as, for example, is the case of JSONPP^[1] supported by S3DB web services.

Because JSONP makes use of script tags, calls are essentially open to the world. For that reason, JSONP may be inappropriate to carry sensitive data.[20]

Including script tags from remote sites allows the remote sites to inject any content into a website. If the remote sites have vulnerabilities that allow JavaScript injection, the original site can also be affected.^[2]

Examples

YouTube

• YouTube video widget (via JSONp): http://bcmoney-mobiletv.com/metaweb/youtube/
• YouTube AJAX API integration (video/playlist search): http://www.yvoschaap.com/youtube.html

Flickr

• Flickr image widget (via JSONp): http://bcmoney-mobiletv.com/metaweb/flickr/
• Flickr AJAX API integration (photo/photoset search): http://kylerush.net/javascript/tutorial-flickr-api-javascript-jquery-ajax-json-build-detailed-photo-wall/

Last.fm

• Last.FM audio widget (via JSONp): http://bcmoney-mobiletv.com/metaweb/lastfm/
• Last.fm Web Services: http://www.last.fm/api/show?service=286
• Last.fm JSON/JSONp Web Service Extensions: http://lastfm-api-ext.appspot.com/docs/
• Last.FM - Recent Tracks widget (using jQuery and JSONp): http://wordpress.org/extend/plugins/lastfm-recent-tracks-widget/

Twitter

• Twitter real-time messaging widget (via JSONp): http://bcmoney-mobiletv.com/metaweb/twitter/
• Twitter JSON/JSONP API URL: http://jquery-howto.blogspot.com/2009/04/twitter-jsonjsonp-api-url.html
• Creating a live Twitter status update with YQL and JavaScript: http://www.bukisa.com/articles/206910_creating-a-live-twitter-status-update-with-yql-and-javascript

Facebook

• Facebook social networking widget (via JSONp): http://bcmoney-mobiletv.com/metaweb/facebook/
• New Facebook Javascript API: http://blog.toppingdesign.com/2010/04/26/new-facebook-javascript-api/
• JavaScript-Based Authentication: http://developers.facebook.com/docs/authentication/javascript
• Building a Better Photo Uploader (with JSONp): http://www.facebook.com/note.php?note_id=178492968919

^[3]

External Links

• JSONP -- JSON With Padding: http://ajaxian.com/archives/jsonp-json-with-padding
• JSON to JSONP -- Bypass Same-Origin Policy: http://www.codeproject.com/KB/aspnet/JSONToJSONP.aspx
• Cross domain AJAX querying with jQuery: http://jquery-howto.blogspot.com/2009/04/cross-domain-ajax-querying-with-jquery.html
• Loading external content with Ajax using jQuery and YQL: http://www.wait-till-i.com/2010/01/10/loading-external-content-with-ajax-using-jquery-and-yql/
• Cross-domain requests with jQuery and Google: http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
• Cross-domain RSS to JSON converter [jQuery plugin]: http://jquery-howto.blogspot.com/2009/11/cross-domain-rss-to-json-converter.html
• Sandbox Your Cross Domain JSONP To Improve Mashup Security, by BeeBole: http://es-es.facebook.com/note.php?note_id=88263014240
• XML to JSONML Client-side (Flash .swf) Proxy: http://synaptify.com/?p=19592
• Mocking Facebook Connect Javascript API: http://www.ajaxlines.com/ajax/stuff/article/mocking_facebook_connect_javascript_api.php

References

1. ↑ Almeida, Jonas (June 11, 2008). "JSON, JSONP, JSONPP?". S3DB: http://sites.google.com/a/s3db.org/s3db/documentation/mis/json-jsonp-jsonpp. Retrieved April 26, 2009.
2. ↑ wikipedia: JSONP#JSONP
3. ↑ Facebook JavaScript Client Library: http://wiki.developers.facebook.com/index.php/JavaScript_Client_Library

See Also

JSON | AJAX | jQuery | JavaScript | XSS