Introduction to the Web API
-
Upload
integratorbrad -
Category
Technology
-
view
2.377 -
download
141
description
Transcript of Introduction to the Web API
![Page 1: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/1.jpg)
An Introduction into the Web API
Brad Genereaux | @integratorbrad | about.me/integratorbrad | hcintegrations.ca
Web Developers P2P : February 2014
![Page 2: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/2.jpg)
Housekeeping
• About Me - Brad Genereaux– Healthcare and API developer– Integration Architect at Agfa Healthcare– Blogger about all the API things
• Discussion and questions– Ask anytime, or at the end
![Page 3: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/3.jpg)
Topics
• API
• REST
• Security
• Web
• Examples
![Page 4: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/4.jpg)
The API
Application Programming Interface
![Page 5: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/5.jpg)
What is an API?
• Methods to access data and workflow from an application without using the application itself
![Page 6: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/6.jpg)
API Example
vs
![Page 7: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/7.jpg)
Why an API?• Not all users are the same
– Some want:
– Some want / need:
– And their needs and wants are ever shifting
![Page 8: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/8.jpg)
An API Stack
GUI(front-end)
API(middle tier)
Data Sources(back-end)
![Page 9: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/9.jpg)
… sounds like a good framework for Web …
![Page 10: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/10.jpg)
The REST
REpresentational State Transfer
![Page 11: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/11.jpg)
What is REST?
• Architectural style (not a standard!)
• Client server model
• Stateless– Idempotency
• Cacheable
• Layered System
• Uniform interface
![Page 12: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/12.jpg)
Source: https://www.ics.uci.edu/~fielding/pubs/dissertation/fielding_dissertation.pdf
![Page 13: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/13.jpg)
Who RESTs?
• Netflix
• Evernote
• Etc etc
![Page 14: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/14.jpg)
Why REST?
• Scalable
• Fault-tolerant
• Recoverable
• Secure
• Loosely coupled
![Page 15: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/15.jpg)
What do I need to REST?
Clients• Browsers• Mobile Apps• Desktop Apps
Servers• “Capable of HTTP”
– Java-based– .Net-based– PHP– Ruby– Perl– Etc.
![Page 16: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/16.jpg)
Three levels of REST
• Level 1 : Resources
• Level 2 : Verbs
• Level 3 : HATEOAS
![Page 17: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/17.jpg)
Resources, Level 1 REST
• /users
• /users/bob
• /users/bob/tweets
• /users/bob/tweets/1
![Page 18: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/18.jpg)
Verbs, Level 2 REST
• CRUD
![Page 19: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/19.jpg)
What is CRUD?
• Standard database operations:C reateR eadU pdateD elete
![Page 20: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/20.jpg)
Verbs, Level 2 REST
• CRUD• GET /tweets
(as opposed to /givemethetweets)
• POST /tweets (as opposed to /createnewtweet)
• PUT /tweets/1 (as opposed to /updatetweet/1)
• DELETE /tweets/1 (as opposed to /removetweet/1)
![Page 21: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/21.jpg)
RESTful Methods
GET PUT POST DELETE
Collection URI(such as http://a.com/items/)
List the items in the collection and some metadata about the items
Replace the entire collection with another collection
Create a new entry in the collection, and return the reference
Delete all the items in the collection
Element URI(such as http://a.com/items/17)
Retrieve a specific item in the collection
Replace a specific item in the collection; if it doesn't exist, create it
Not generally used
Delete the specific item in the collection
• There are other methods less used (HEAD, OPTIONS, PATCH) for other purposes• Representations of an item are specified by the media type (MIME type)
Source: http://en.wikipedia.org/wiki/Representational_state_transfer
![Page 22: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/22.jpg)
HATEOAS, Level 3 REST
• Hypermedia as the engine of application state
"ids" : [ 12345678, 87654321, 11223344]
"links": [ { "rel": "UserInfo", "href": "https://.../user/12345678" }, { "rel": "Tweets", "href": "https://.../tweet/87654321" }, { "rel": "Messages", "href": "https://.../msgs/11223344" }]
![Page 23: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/23.jpg)
Data Formats (XML and JSON)
XML (135 characters):<tweets> <tweet type="text" id="1"> <text>REST is great!</text> </tweet> <tweet type="text" id="2"> <text>APIs forever!</text> </tweet></tweets>
JSON (109 characters):{ "tweets": [ {"type": "text", "id": "1", "text": "REST is great!"}, {"type": "text", "id": "2", "text": "APIs forever!"} ]}
XML can be validated (XML Schema), stylized (XSL), traversed (XPath), queried (XQuery), transformed (XSLT), and namespaced
JSON is easier
![Page 24: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/24.jpg)
What makes for good REST?
• Self-documenting• Nouns in path, verbs by HTTP• Complexity under the “?”
– i.e., /tweets/?contains=API
• Errors use HTTP error code mechanism
• As simple as possible, but no simpler
![Page 25: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/25.jpg)
REST Alternatives
• SOAP (simple object access protocol)
• Javascript
• XML-RPC
• See discussion at http://www.slideshare.net/jmusser/j-musser-apishotnotgluecon2012
![Page 26: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/26.jpg)
Important : Know your TTFHW (Time to First Hello World) !
![Page 27: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/27.jpg)
API Worst Practices
10. Poor error handling 9. Ignoring HTTP rules 8. Exposing your underlying data model 7. Security complexity 6. Unexpected release cycles 5. Poor developer experience 4. Expecting an MVC to give you a great API 3. Assuming if you build it, they will come 2. Inadequate support 1. Poor documentation
Source: http://www.slideshare.net/jmusser/j-musser-apishotnotgluecon2012
![Page 28: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/28.jpg)
The Security
![Page 29: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/29.jpg)
Authentication and Authorization
• Authentication : Who
• Authorization : What they are allowed to do
• Not your job, but your responsibility
![Page 30: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/30.jpg)
Security Frameworks
• OAuth– Authorizing services
• OpenID– Facebook, Google
• LDAP– Enterprise authentication
![Page 31: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/31.jpg)
Application Security Threats
Input Validation Session Management
Authentication Cryptography
Authorization Exception Management
Configuration Management
Parameter Manipulation
Sensitive Information Auditing and Logging
Source: http://en.wikipedia.org/wiki/Application_security
![Page 32: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/32.jpg)
SQL Injection
Consider the following pseudo-code:String topic = request.getParameter(“topic");SQLCommand sql = new SQLCommand("select * from tweets where topic like ‘" + topic + "%’")
So what happens if the parameter is:– API– REST– h3ck0rz’; drop table tweets; --
Source: http://xkcd.com/327/
![Page 33: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/33.jpg)
The Web
Client-side Access to REST
![Page 34: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/34.jpg)
HTML5 + CSS
• “HyperText Markup Language”– Characterized by the DOM (document object model) Completely
ubiquitous across the Internet<html> <body> <h1>Hello World</h1> </body></html>
• “Cascading Style Sheets”– Allows for advanced stylization of content– Example:
.giant { font-size: 72px; color: blue;}
![Page 35: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/35.jpg)
JavaScript
• Multi-paradigm weakly-typed scripting language• Used most often hand-in-hand with HTML• Not Java, at all (syntax based on C)• Example:
alert (“Hello World!”);• Able to manipulate the DOM and interact with the
browser environment
![Page 36: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/36.jpg)
AJAX
• “Asynchronous JavaScript and XML”• Group of technologies that allow for robust client
interactions without reloading web pages– HTML and CSS for presentation– DOM for display and interaction of data– XML for data interchange– XMLHttpRequest for asynchronous communication– JavaScript to bring these technologies together
• AJAX is the key to consuming REST
![Page 37: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/37.jpg)
jQuery
• “jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.”
• Example:
$(“#h1”).html(“Hello World!”);• jQuery tests against many browser platforms and solves
a lot of the problems that supporting many platforms introduces
![Page 38: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/38.jpg)
Calling REST with jQuery
• Use an AJAX Call$.ajax({type : "GET",url : "http://a.com/tweets",data : {"contains" : "API"},dataType : "json",success : function(data){ alert ("Results: " + data);}
});
Verb
Query parameters
Resource
Media type
![Page 39: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/39.jpg)
Tips
• Use “curl” to simulate calls from your command line
• Use Chrome debug tools or Firebug to watch traffic and test your Javascript
• Use libraries – no need to reinvent the wheel
![Page 40: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/40.jpg)
Other Frameworks
• UI Frameworks (Bootstrap, Foundation)
• MVC Frameworks (Angular, Backbone)
• Tooling (Yeoman, Lineman)
• Documentation (Apiary, Swagger)
• No shortage of options
![Page 41: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/41.jpg)
The Examples
![Page 42: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/42.jpg)
Some REST API Examples
• If This, Than That
• Twilio
• Demo
![Page 43: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/43.jpg)
Facebook Graph API• Every object has an ID:
• Objects can be searched:
• Objects can be updated:
![Page 44: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/44.jpg)
Twitter REST API
![Page 45: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/45.jpg)
If This, Then That
• API Integration Website - http://ifttt.com/
![Page 46: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/46.jpg)
Twilio
![Page 47: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/47.jpg)
Demo
![Page 48: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/48.jpg)
Need more REST?
• Programmable Webhttp://programmableweb.comJohn Musser’s presentations: http://www.slideshare.net/jmusser
• Crafting Interfaces that Developers Love http://offers.apigee.com/api-design-ebook-rr/
• API Craft Google Group https://groups.google.com/forum/#!forum/api-craft
![Page 49: Introduction to the Web API](https://reader034.fdocuments.net/reader034/viewer/2022052117/554f3f2fb4c905cd048b5311/html5/thumbnails/49.jpg)
Discussion - Questions