View
153
Download
2
Category
Tags:
Preview:
DESCRIPTION
Pragmatic RESTful API principles, along with a solid consumption architecture, can allow for a great amount of automation in your program development. At the same time, securing the application can be extremely tricky from JavaScript. In this session we will explore several principles behind RESTful API design and consumption using JavaScript, many of the standards that were integrated in the redevelopment of the PayPal API architecture in the new RESTful APIs. We will cover many of these architecture standards, including: * Building in action automation using HATEOAS * OAuth 2 in the JavaScript model * The challenges behind secure resource consumption through JavaScript
Citation preview
With JavaScript
RESTful API Automation
Jonathan LeBlancHead of Developer Evangelism (North
America)Github: http://github.com/jcleblanc
Slides: http://slideshare.net/jcleblancTwitter: @jcleblanc
What We’re Covering
REST Concepts
Automation through hypermedia constraints
OAuth 2 in JavaScript
What We Want
JavaScript Challenges
Cross Origin Resource Sharing
Access to other domains / subdomains is restricted (same origin policy)
JSONP to request resources across domains
Cross-origin resource sharing (CORS)You Send: Origin: http://site.com
They Send: Access-Control-Allow-Origin: http://site.com
Keeping Things Hidden
Token based auth mechanismOAuth: Client Secret
Basic Auth: Password
API request action to reaction mapping
A schematic for how data forces site changes
Action Automation
RESTful API Core Concepts
Honor HTTP request verbs
Use proper HTTP status codes
No version numbering in URIs
Return format via HTTP Accept header
Double Rainbow: Discovery via HATEOAS
Uniform Interface Sub-Constraints
Resource Identification
Resources must be manipulated via representations
Self descriptive messages
Hypermedia as the engine of application state
How we Normally Consume APIs
Using HATEOAS to Automate
"links": [ { "href":"https://api.sandbox.paypal.com/v1/payments/ authorization/6H149011U8307001M", "rel":"self", "method":"GET" },{ "href":"https://api.sandbox.paypal.com/v1/payments/ authorization/6H149011U8307001M/capture", "rel":"capture", "method":"POST" },{ "href":"https://api.sandbox.paypal.com/v1/payments/ authorization/6H149011U8307001M/void", "rel":"void", "method":"POST" }]
OAuth 2 & JavaScript?
A Little Use Background
User login
Application only
User Involvement
User Agent Flow: Redirect
Prepare the Redirect URIAuthorization Endpointclient_id response_type (token)scope redirect_uri
Browser RedirectRedirect URI
User Agent Flow: Redirect
Building the redirect link
var auth_uri = auth_endpoint + "?response_type=token" + "&client_id=" + client_id + "&scope=profile" + "&redirect_uri=" + window.location; $("#auth_btn").attr("href", auth_uri);
User Agent Flow: Hash Mod
Fetch the Hash Modaccess_tokenrefresh_tokenexpires_in
Extract Access Token
User Agent Flow: Hash Mod
http://site.com/callback#access_token=rBEGu1FQr54AzqE3Q&refresh_token=rEBt51FZr54HayqE3V4a&expires_in=3600
var hash = document.location.hash;var match = hash.match(/access_token=(\w+)/);
Extracting the access token from the hash
User Agent Flow: Get Resources
Set Request Headers + URIResource EndpointHeader: token type + access tokenHeader: accept data type
HTTPS Request
User Agent Flow: Get Resources
$.ajax({ url: resource_uri, beforeSend: function (xhr) { xhr.setRequestHeader('Authorization', 'OAuth ' + token); xhr.setRequestHeader('Accept', 'application/json'); }, success: function (response) { //use response object }});
Making an authorized request
Good JavaScript API Interaction
Using Proper REST standards
Automation through hypermedia constraints
Using OAuth 2 appropriately
http://bit.ly/rest_automation_js
Thank You! Questions?
Jonathan LeBlancHead of Developer Evangelism (North
America)Github: http://github.com/jcleblanc
Slides: http://slideshare.net/jcleblancTwitter: @jcleblanc
Recommended