Hypermedia api (HATEOAS)

4,473 views

Published on

Published in: Technology
0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
4,473
On SlideShare
0
From Embeds
0
Number of Embeds
379
Actions
Shares
0
Downloads
49
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

Hypermedia api (HATEOAS)

  1. 1. Hypermedia API Pavel Mitin 2012 Anadea Inc.
  2. 2. Why does it matterAPI, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API,API, API, API, API, API, API, API, API, API, API..
  3. 3. ProblemExisting APIs are often:● unclear● fragile● not extendable
  4. 4. Possible solution“WWW is fundamentally a distributedhypermedia application.” Richard Taylor
  5. 5. Possible solution“WWW is fundamentally a distributedhypermedia application.” Richard TaylorAnd the application works!
  6. 6. How WEB worksBrowsers know how to:● deal with media types (text/html, image/png...)● navigate via links and submit forms
  7. 7. How WEB worksBrowsers know how to:● deal with media types (text/html, image/png...)● navigate via links and submit formsLet’s follow the example!!!
  8. 8. Example -- eBay APIGET .../item/180881974947{ "name" : "Monty Python and the Holy Grail white rabbit big pointy teeth", "id" : "180881974947", ... "links" : [ { “type: "application/vnd.ebay.item", "rel": "Add item to watchlist", "href": "https://.../user/12345678/watchlist/180881974947"}, { // and a whole lot of other operations ]}Source: http://www.slideshare.net/josdirksen/rest-from-get-to-hateoas
  9. 9. Media types● application/atom+xml● image/jpeg● audio/vnd.wave● application/vnd.buyfolio.listing+json
  10. 10. Hypermedia links● Embed Links ○ <img src="..." /> ○ <x:include href"..." />
  11. 11. Hypermedia links● Embed Links ○ <img src="..." /> ○ <x:include href"..." />● Outbound Links ○ <a href="..." target="_blank">...</a>
  12. 12. Hypermedia links● Embed Links ○ <img src="..." /> ○ <x:include href"..." />● Outbound Links ○ <a href="..." target="_blank">...</a>● Templated Links ○ <form method="get" action="...">...</form> ○ <link href="http://www.example.org/?search={search}" />
  13. 13. Hypermedia links● Embed Links ○ <img src="..." /> ○ <x:include href"..." />● Outbound Links ○ <a href="..." target="_blank">...</a>● Templated Links ○ <form method="get" action="...">...</form> ○ <link href="http://www.example.org/?search={search}" />● Idempotent Links ○ <link rel="edit" href="http://example.org/edit/1"/> ○ (new XMLHttpRequest()).open("DELETE", "/tags/"+id);
  14. 14. Hypermedia links● Embed Links ○ <img src="..." /> ○ <x:include href"..." />● Outbound Links ○ <a href="..." target="_blank">...</a>● Templated Links ○ <form method="get" action="...">...</form> ○ <link href="http://www.example.org/?search={search}" />● Idempotent Links ○ <link rel="edit" href="http://example.org/edit/1"/> ○ (new XMLHttpRequest()).open("DELETE", "/tags/"+id);● Non-Idempotent Links ○ <form method="post" action="...">...</form>
  15. 15. Hypermedia Design Elements1. Base Format2. State Transfer3. Domain Style4. Application Flow
  16. 16. Base format1. JSON2. XML3. XHTML/HTML54. Others (YAML, CSV, Markdown, Protocol Buffers)
  17. 17. State Transfer (client-initiated)1. None (i.e. read-only)2. Predefined (via external documentation)3. Ad-Hoc (via in-message hypermedia controls)
  18. 18. Domain Style1. Specific2. General3. Agnostic
  19. 19. Domain Style<!-- domain-specific design --><story> <id>...</id> <estimate>...</estimate></story>
  20. 20. Domain Style/* domain-general design */{ "collection" : { "items" : { { "key" : "id", "value" : "12345" } ...
  21. 21. Domain Style<!-- domain-agnostic design --><ul class="order"> <li class="id">...</li> <ul class="shipping-address"> <li class="street-address">...</li> ...
  22. 22. I havent mentioned● Resources● Http verbs● Http status codes
  23. 23. Surfing your APISource: Building Hypermedia APIs with HTML5 and Node by Mike Amundsen
  24. 24. XHTML as a base format● Native support for links and forms● Ubiquitous client (browser)● XHTML is XML● HAML :)
  25. 25. Extending vs versioningReasons for a new version:● A change that alters the meaning or functionality of an existing feature or element● A change that causes an existing element to disappear or become disallowed● A change that converts an optional element into a required element
  26. 26. Javascript RIA;)
  27. 27. CriticismUsually compared to "traditional" REST API
  28. 28. Criticism● Overcomplicated client● Extra traffic
  29. 29. Rails and HATEOAS● lack of abstractions for hypermedia controls
  30. 30. Rails and HATEOAS● lack of abstractions for hypermedia controls● confusing terms: ○ #resource are two different resources
  31. 31. Rails and HATEOAS● lack of abstractions for hypermedia controls● confusing terms: ○ #resource are three different resources● OPTIONS verb
  32. 32. Rails and HATEOAS● lack of abstractions for hypermedia controls● confusing terms: ○ #resource are three different resources● OPTIONS verb● PATCH verb
  33. 33. Rails and HATEOAS● lack of abstractions for hypermedia controls● confusing terms: ○ #resource are three different resources● OPTIONS verb● PATCH verb● PUT verb ○ upsert ○ whole resource state
  34. 34. Rails and HATEOAS● lack of abstractions for hypermedia controls● confusing terms: ○ #resource are three different resources● OPTIONS verb● PATCH verb● PUT verb ○ upsert ○ whole resource state● custom media types require custom code
  35. 35. Richardson Maturity ModelSource: http://martinfowler.com/articles/richardsonMaturityModel.html
  36. 36. Books

×