Integrating Google APIs into Your Applications
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Integrating Google APIs into Your Applications

on

  • 17,871 views

This is a presentation I have at the Oracle OpenWorld Unconference. I basically gave an overview of the different Google APIs and services that you can integrate into your applications. It touches ...

This is a presentation I have at the Oracle OpenWorld Unconference. I basically gave an overview of the different Google APIs and services that you can integrate into your applications. It touches both client side, JavaScript APIs as well as serverside APIs like GData etc..

Statistics

Views

Total Views
17,871
Views on SlideShare
17,749
Embed Views
122

Actions

Likes
11
Downloads
354
Comments
1

6 Embeds 122

http://chrisschalk.com 71
http://www.slideshare.net 41
http://theappslab.com 7
http://google.aquteintelligence.com 1
http://www.lmodules.com 1
http://onwebdev.blogspot.com.br 1

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Integrating Google APIs into Your Applications Presentation Transcript

  • 1. Integrating Google APIs into your Applications Chris Schalk Google Developer Advocate 9/23/2008
  • 2. Agenda • Client Side APIs – Maps API – AJAX APIs • Search, Feed, Translation • Google Server-side APIs – Google Data – Calendar, Blogger, YouTube... – Demo with JSF • OpenSocial/Gadgets – How to build gadgets – OpenSocial - What is it?? – How to host OpenSocial gadgets 2 (c)2008 Google
  • 3. Agenda • Client Side APIs – Maps API – AJAX APIs • Search, Feed, Translation • Google Server-side APIs – Google Data – Calendar, Blogger, YouTube... – Demo with JSF • OpenSocial/Gadgets – How to build gadgets – OpenSocial - What is it?? – How to host OpenSocial gadgets 3 (c)2008 Google
  • 4. Google Maps API • JavaScript Client API • Build a Customized Maps application • Easy to mashup with other technologies • Also works with Flash • Can generate static Maps images via REST 4 (c)2008 Google
  • 5. Google AJAX APIs Delivering the Web to Your Applications (Search, Feeds, Language) • RESTful data access layer – JSON/JSON-P AJAX APIs • JavaScript Runtime – Designed for ease of use • JavaScript Controls and UI elements – Custom integration and styling (c)2008 Google
  • 6. Google AJAX APIs Background • Comprehensive access to Google Systems (Search, Feeds, Language) • End to end API stack: • Data Access via JavaScript Methods and REST • Built in Native UI and Large Suite of Advanced Controls • Large, diverse customer base • Sites: Long Tail and Short Tail Sites (100 pv/d – 10m+ pv/d) • Developers: Pro Web Developers – Scripters – Bloggers • High Speed, Low Latency, Globally Available JavaScript Controls and UI elements JavaScript Runtime Layer AJAX RESTful Data Access Layer APIs
  • 7. Google AJAX Search API • Web • Video • News • Image • Local • Book • Blog (c)2008 Google
  • 8. Google AJAX Feed API • Load • Find • Lookup (c)2008 Google
  • 9. Google AJAX Language API • Translation • Language Detection (c)2008 Google
  • 10. Demo - Trying out some of the AJAX APIs
  • 11. Some notable AJAX APIs Applications Time - AJAX Search API (news) http://www.time.com/time/politics http://www.time.com/time/global_business/united-states NYTimes - AJAX Feed API http://thecaucus.blogs.nytimes.com People - AJAX Feed API + gadgets http://www.people.com/people/news/0,,,00.html http://www.google.com/uds/gadgets/people_ads/people_ads.html SnowCovered - AJAX Language API http://www.snowcovered.com/Snowcovered2/ Walkscore - AJAX Search API (local) + Maps API http://www.walkscore.com/get-score.php?street=1600+amphitheatre+parkway+94043&go=Go http://www.walkscore.com/rankings/San_Francisco Google Elections apps: http://www.google.com/2008election/ http://www.google.com/2008election/convention.html Background: http://www.searchmashups.blogspot.com/ (c)2008 Google
  • 12. Agenda • Client Side APIs – Maps API – AJAX APIs • Search, Feed, Translation • Google Server-side APIs – Google Data – Calendar, Blogger, YouTube... – Demo with JSF • OpenSocial/Gadgets – How to build gadgets – OpenSocial - What is it?? – How to host OpenSocial gadgets 12 (c)2008 Google
  • 13. ServerSide Google APIs Overview • Google Data APIs – Common set of APIs for working with multiple online Google technologies – Google Apps APIs, Base Data API, Data API, Calendar Data API, Code Search Data API, Contacts Data API, Finance Portfolio Data API, Health Data API, Notebook Data API, Spreadsheets Data API, Picasa Web Albums Data API, Google Documents List Data API, Webmaster Tools Data API, YouTube Data API – Support for multiple languages • Python • PHP • .Net • Java • JavaScript 13 (c)2008 Google
  • 14. Google Data APIs Overview • Google Data APIs, aka “Gdata”, is a protocol based on the Atom 1.0 and RSS 2.0 syndication formats, plus the Atom Publishing Protocol • “Gdata” extends those standards in various ways, using the extension mechanisms built into the standards. A GData feed conforms to either the Atom or RSS syndication formats. The GData publishing model conforms to the Atom Publishing Protocol. • To acquire information from a service that supports GData, you send an HTTP GET request; the service returns results as an Atom or RSS feed. • You can update data (where supported by a particular GData service) by sending an HTTP PUT request. • GData provides a general model for feeds, queries, and results. You can use it to send queries and updates to any service that has a GData interface. 14 (c)2008 Google
  • 15. ServerSide Google APIs Overview • Other server-side Google APIs… • Google Chart API Also other restful services, AJAX apis, OpenSocial RESTful API 15 (c)2008 Google
  • 16. Working with the Data APIs in Java • Getting the Gdata Jar files • Running the sample app • Add Jars to your IDE • That’s it! 16 (c)2008 Google
  • 17. Some basic data operations w/ Calendar API • Querying all of your calendars • Querying the events in all of your calendars • Querying specific events based on a text string • Querying events based on a date range • Creating new calendar events • Deleting/Updating calendar events 17 (c)2008 Google
  • 18. Using the Calendar Data API with JSF 18 (c)2008 Google
  • 19. Using the Calendar Data API with JSF Basic Architecture CalendarServices Managed Bean 19 (c)2008 Google
  • 20. Introducing the Google Charts API • Simple REST based dynamic chart generator • Offers the creation of on-the-fly charts of multiple types – http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=25 0x100&chl=Hello|World 20 (c)2008 Google
  • 21. The JSF Custom Chart Component 21 (c)2008 Google
  • 22. Google data APIs/ RESTful services summary • The Google Data APIs offer full online data access to multiple Google Services • Gdata supports multiple client languages • Other simple, RESTful, online services also offered by Google • Charts API, AJAX APIs… • Relatively straightforward to integrate with server-side Java / JSF 22 (c)2008 Google
  • 23. More info… • http://code.google.com • http://code.google.com/apis/gdata/ • http://code.google.com/apis/chart 23 (c)2008 Google
  • 24. Agenda • Client Side APIs – Maps API – AJAX APIs • Search, Feed, Translation • Google Server-side APIs – Google Data – Calendar, Blogger, YouTube... – Demo with JSF • OpenSocial/Gadgets – How to build gadgets – OpenSocial - What is it?? – How to host OpenSocial gadgets 24 (c)2008 Google
  • 25. Building Gadgets • It’s just JavaScript embedded in an XML file! • Runs within a “container” environment – iGoogle – Other environments coming online through OpenSocial • Gadget’s relation to OpenSocial – Gadgets serve as the base architecture for OpenSocial applications 25 (c)2008 Google
  • 26. • 26
  • 27. • 27
  • 28. Too many platforms! 28
  • 29. Standards based OpenSocial Write once… Deploy everywhere 29
  • 30. Use multiple times Cooooool! 30
  • 31. Not just Social Network Sites • Social network sites - Profiles and home pages ex: MySpace, Hi5 • Personal dashboards – Widgets ex: iGoogle, My Yahoo • Sites based around a Social Object ex: Flickr, YouTube • Enterprise systems ex: Oracle, SalesForce.com • Any web site 31
  • 32. OpenSocial Roadmap • Version 0.5 was released in a “developer release” on Nov 1st. • First “sandbox” was made available on Orkut • Version 0.6 was released in December • Initial version of Shindig server software was launched as Apache incubator project • Other sandboxes came live - Hi5, Ning, Plaxo … • Version 0.7 (production) was released in January • MySpace, Hi5, Orkut currently running with 0.7 32
  • 33. OpenSocial v0.8 is here! • Latest evolution of OpenSocial as defined by the OpenSocial development community • Updated JavaScript API • Now contains a RESTful API • Shindig supports v0.8 today • iGoogle now supports 0.8! • hi5 almost done with their support • orkut currently working on their implementation • Other containers also working on 0.8 • Specification is here: http://www.opensocial.org/Technical-Resources/opensocial-spec-v08 33
  • 34. OpenSocial Hi-level Details • A set of open, standard APIs for building social applications • APIs based on Web standards: HTML/CSS, JavaScript, REST+OAuth • Reference Implementation: Shindig • Apache Open Source Project • A global community of thousands of developers 34
  • 35. OpenSocial Core Services • People & Friends • Access friends information programmatically • Activities • See what you’re friends are up to • Share what you are doing • Persistence • Provide state without a server • Share data with your friends 35
  • 36. OpenSocial Client APIs • JavaScript API - for browser based client development • Standard Web development technologies • HTML + Javascript, CSS, AJAX • Can integrate with 3rd party servers • PHP, Perl, Java, C/C++ • RESTful API - for server based client development • Based on Atom publishing protocol • Data transfer is Atom or JSON • More on RESTful API later… 36
  • 37. Building JavaScript OpenSocial Applications • If you know how to develop gadgets, you know how to develop JavaScript OpenSocial applications! • Follows same approach as gadgets • JavaScript/HTML/CSS embedded in an XML document • XML document containing gadget is hosted on the Internet • OpenSocial applications are “gadgets++” • Gadgets development, but with additional Social capabilities 37
  • 38. OpenSocial People & Friends Example An OpenSocial example to show the owner’s friends function getFriends(id) { var params = {}; params[opensocial.IdSpec.Field.USER_ID] = opensocial.IdSpec.PersonId.OWNER; params[opensocial.IdSpec.Field.GROUP_ID] = quot;FRIENDSquot;; var idspec = opensocial.newIdSpec(params); var req = opensocial.newDataRequest(); req.add(req.newFetchPeopleRequest(idspec), quot;reqquot;); req.send(onLoadFriends); }; 38
  • 39. OpenSocial People & Friends Example An OpenSocial example to show the owner’s friends var html= quot;Listing friends:<br/>quot;; function printPerson(person) { html += quot;<br/>quot; + person.getDisplayName(); }; function onLoadFriends(dataResponse) { dataResponse.get(quot;reqquot;).getData().each(printPerson); document.getElementById('message').innerHTML = html; }; 39
  • 40. Activities Example Posting an Activity function postActivity(text) {    var params = {};    params[opensocial.Activity.Field.TITLE] = text;    var activity = opensocial.newActivity(params);    opensocial.requestCreateActivity(activity,      opensocial.CreateActivityPriority.HIGH, callback); } postActivity(quot;This is a sample activity, created at quot; +   new Date().toString()) } 40
  • 41. Persistence Example Storing persisted data function populateMyAppData() {   var req = opensocial.newDataRequest();   var data1 = Math.random() * 5;   var data2 = Math.random() * 100;   req.add(req.newUpdatePersonAppDataRequest(quot;VIEWERquot;,                        quot;AppField1quot;, data1));   req.add(req.newUpdatePersonAppDataRequest(quot;VIEWERquot;,                        quot;AppField2quot;, data2));   req.send(requestMyData); } 41
  • 42. Persistence Example Fetching persisted data function requestMyData() {   var req = opensocial.newDataRequest();   var fields = [quot;AppField1quot;, quot;AppField2quot;];   req.add(req.newFetchPersonRequest(     opensocial.DataRequest.PersonId.VIEWER), quot;viewerquot;);   req.add(req.newFetchPersonAppDataRequest(quot;VIEWERquot;,     fields), quot;viewer_dataquot;);   req.send(handleReturnedData); } 42
  • 43. OpenSocial JavaScript client application in action Gadget using JavaScript Client API communicates with OpenSocial server OpenSocial JSON Server Gadget XML Source browser 43
  • 44. Integrating OpenSocial applications with external servers The OpenSocial persistence service provides a way to store/share small amounts of data on the OpenSocial server, but… • What if you need to store more data than your container allows? • Solution: You can make independent requests out to external servers. • Use: gadgets.io.makeRequest • Can also make authenticated requests using Oauth • Can use cloud services from: Joyent, Amazon or AppEngine! 44
  • 45. Integrating OpenSocial applications with external servers An example request to an external server gadgets.io.makeRequest OpenSocial Server External 1 2 Server browser 1. Initial request made from gadget 2. Server routes request to external server Requests can be secured using OAuth! 45
  • 46. Demonstration • Building OpenSocial Client Applications 46
  • 47. How to host OpenSocial Applications 1. Can build your own server that implements OpenSocial specification… 2. Or can use “Shindig” - Reference implementation for OpenSocial • Gadget Server –Renders gadget XML as HTML/JS/CSS • OpenSocial Data Server –RESTful API server (in-progress) 47
  • 48. Serverside OpenSocial How to implement an OpenSocial server Shindig orkut, hi5, iGoogle, tianya.cn, … • Gadget Server –Renders gadget XML as HTML/JS/CSS • OpenSocial Data Server –RESTful API server • Gadget Container JavaScript –Core gadgets JavaScript environment 48
  • 49. How Shindig works • Gadget Server • OpenSocial Data Server Shindig Yoursite.com Gadget Gadget Server OpenSocial DataServer 49 49
  • 50. Why use Shindig? • Strong open source community • High quality production-ready code • Update easily as OpenSocial evolves • Fully compliant with OpenSocial v0.7, v0.8 • Shindig is language neutral (Java, PHP) 50
  • 51. Shindig success at hi5 • Big Traffic • 10k req/sec Edge • 6k req/sec Origin • Hundreds of Developers • 1800+ Apps • 1 Billion hits/day … on 42 Shindig servers 51 51
  • 52. Demonstration: Trying out Shindig 52 52
  • 53. Thank You! http://chrisschalk.com 53 (c)2008 Google