Introduction to JavaScript Fall 2011 Class 9

Back to Introduction to JavaScript Fall 2011

AJAX

Asynchronous Javascript And XML: What does that mean?

It means, normally in http:// and https:// communication, if the browser needs to get more data from the web server, it needs to refresh the page. But, by using javascript to make a background web request, it can get additional data (XML), and use that data to add new content to the page with out a page refresh.

These calls are made with a javscript object, the XMLHttpRequest that has been present in just about every major desktop browser IE6 and later. By using the methods and properties of that object, you can write javascript to request XML, almost as if you were using javscript to make queries on a database.

JSON

XML is all well and good, but to use that data, we need to parse it to actually be able to access or manipulate any of the data in that xml document in a pratical way. It seems like parsing should be an extra step, wouldn't it be easier if we could just get the data as javascript objects?

Well good news boys and girls, these days, we can! JSON stands for Javascript Object Notation. It's not as easy for the eye to read as XML is, but you can convey the same data as XML and it's in a format that javascript immediately recognizes so you can start manipulating that data right away!

JSONP

JSONP is JSON with Padding. Browsers prevent Cross-site scripting of JSON and XML across different domains for security. This means you can only pull in XML or JSON from the same domain that it's being requested from. JSONP bypasses this security measure, so you can pull in data from other websites into your own with out the API provider making an exception for your site. If you look at the actual data, JSONP is exactly the same as JSON excpet it is wrapped it "(JSON);" (replace JSON with the actual JSON data).

Web Services

For the sake of this class, a web service is server side code that spits out information from a database via a http:// page. In the instance we'll be looking at, the server always spits out the data in a format client side languages can understand, XML, JSON, or JSON P. More specific data can be retrieved from these pages by passing URL paramaters along with the URL itself.

API mashups

People have been writing client-side code that pulls data from multiple APIs and does cool useful stuff with it, like the google maps / craiglist for-rent mashup: pad mapper. Twitter has a list of twitter mashups