Slide 1

Slide 1 text

ConFoo 2016 Bradley Holt, Developer Advocate Friday, February 26, 2016 Learning HTTP @BradleyHolt

Slide 2

Slide 2 text

Why learn HTTP?

Slide 3

Slide 3 text

The World Wide Web HTTP (Hypertext Transfer Protocol) was originally invented to serve HTML (Hypertext Markup Language) Web pages @BradleyHolt

Slide 4

Slide 4 text

GET /index.html HTTP/1.0 GET an HTML Page @BradleyHolt HTTP/1.0 200 OK       

I'm a Web Page!

Slide 5

Slide 5 text

API Economy HTTP is the fabric of the API economy @BradleyHolt

Slide 6

Slide 6 text

Mobile Apps Most mobile apps use one or more mobile backend APIs, many of which are HTTP APIs

Slide 7

Slide 7 text

Distributed Systems Understanding HTTP can help you understand distributed systems; the web is the largest distributed system ever created

Slide 8

Slide 8 text

Learning HTTP with CouchDB

Slide 9

Slide 9 text

Apache CouchDB CouchDB is a document database featuring an HTTP API, JSON documents, and peer-to-peer replication @BradleyHolt

Slide 10

Slide 10 text

CouchDB 2.0 Developer Preview $ git clone https://git-wip-us.apache.org/repos/asf/couchdb.git! $ npm install -g grunt-cli! $ cd couchdb! $ git checkout developer-preview-2.0! $ ./configure! $ make! $ dev/run! [ * ] Developers cluster is set up at http://127.0.0.1:15984.! Admin username: root! Password: +2/y7v6h @BradleyHolt http://couchdb.apache.org/developer-preview/2.0/

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

http-console

Slide 13

Slide 13 text

http-console $ npm install http-console -g! @BradleyHolt https://github.com/cloudhead/http-console

Slide 14

Slide 14 text

http-console $ npm install http-console -g! $ http-console 127.0.0.1:15984 @BradleyHolt https://github.com/cloudhead/http-console

Slide 15

Slide 15 text

http-console $ npm install http-console -g! $ http-console 127.0.0.1:15984! > http-console 0.6.3! > Welcome, enter .help if you're lost.! > Connecting to 127.0.0.1 on port 15984.! @BradleyHolt https://github.com/cloudhead/http-console

Slide 16

Slide 16 text

http-console http://127.0.0.1:15984/> @BradleyHolt https://github.com/cloudhead/http-console

Slide 17

Slide 17 text

http-console http://127.0.0.1:15984/> GET / @BradleyHolt https://github.com/cloudhead/http-console

Slide 18

Slide 18 text

http-console http://127.0.0.1:15984/> GET /! HTTP/1.1 200 OK! Content-Type: text/plain; charset=utf-8! ! {! couchdb: 'Welcome',! version: '9afa6a0',! vendor: { name: 'The Apache Software Foundation' }! } @BradleyHolt https://github.com/cloudhead/http-console

Slide 19

Slide 19 text

http-console http://127.0.0.1:15984/> @BradleyHolt https://github.com/cloudhead/http-console

Slide 20

Slide 20 text

http-console http://127.0.0.1:15984/> .q @BradleyHolt https://github.com/cloudhead/http-console

Slide 21

Slide 21 text

http-console $ http-console https://bradley-holt.cloudant.com @BradleyHolt https://github.com/cloudhead/http-console

Slide 22

Slide 22 text

http-console $ http-console https://bradley-holt.cloudant.com! > http-console 0.6.3! > Welcome, enter .help if you're lost.! > Connecting to bradley-holt.cloudant.com on port 443.! @BradleyHolt https://github.com/cloudhead/http-console

Slide 23

Slide 23 text

http-console https://bradley-holt.cloudant.com:443/> @BradleyHolt https://github.com/cloudhead/http-console

Slide 24

Slide 24 text

http-console https://bradley-holt.cloudant.com:443/> GET / @BradleyHolt https://github.com/cloudhead/http-console

Slide 25

Slide 25 text

http-console https://bradley-holt.cloudant.com:443/> GET /! HTTP/1.1 200 OK! Content-Type: text/plain; charset=utf-8! ! {! couchdb: 'Welcome',! version: 'acfd7cb',! vendor: {! name: 'IBM Cloudant',! version: '5253',! variant: 'paas'! },! features: [ 'geo' ]! }! @BradleyHolt https://github.com/cloudhead/http-console

Slide 26

Slide 26 text

http-console https://bradley-holt.cloudant.com:443/> @BradleyHolt https://github.com/cloudhead/http-console

Slide 27

Slide 27 text

http-console https://bradley-holt.cloudant.com:443/> .q @BradleyHolt https://github.com/cloudhead/http-console

Slide 28

Slide 28 text

HTTP Fundamentals

Slide 29

Slide 29 text

Stateless Messages Each HTTP request and HTTP response is a stateless and self-contained message

Slide 30

Slide 30 text

Request Methods A request method indicates the action to be performed on a resource @BradleyHolt GET /kittens POST /kittens DELETE /kittens/mittens PUT /kittens/mittens

Slide 31

Slide 31 text

Resources A resource is identified by a Uniform Resource Identifier (URI) @BradleyHolt /kittens /kittens?q=mittens /kittens/mittens /kittens/mittens/photo

Slide 32

Slide 32 text

Status Codes Every HTTP response includes a numeric status code @BradleyHolt 200 OK 304 Not Modified 500 Internal Server Error 409 Conflict

Slide 33

Slide 33 text

200 OK Indicates that the request succeeded without error @BradleyHolt

Slide 34

Slide 34 text

201 Created A new resource has been created @BradleyHolt

Slide 35

Slide 35 text

304 Not Modified Used for conditional caching of GET requests @BradleyHolt

Slide 36

Slide 36 text

409 Conflict The request would create a conflict with the current state of the resource @BradleyHolt

Slide 37

Slide 37 text

500 Internal Server Error The server encountered an internal error and was not able to fulfill the request @BradleyHolt

Slide 38

Slide 38 text

Request Headers A client can provide additional details about a request with request headers @BradleyHolt GET /kittens  Accept: application/json POST /kittens  Accept: application/json  Content-Type: application/json    {  …  } DELETE /kittens/mittens  Accept: application/json PUT /kittens/mittens  Accept: application/json  Content-Type: application/json    {  …  }

Slide 39

Slide 39 text

Response Headers A server can provide additional details about a response with response headers @BradleyHolt 200 OK  Content-Type: application/json  Etag: "e146018c82000fdc"    {  …  } 201 Created  Content-Type: application/json  Location: /kittens    {  …  } 500 Internal Server Error  Content-Type: application/json    {  …  } 409 Conflict  Content-Type: application/json    {  …  }

Slide 40

Slide 40 text

Example Request and Response An example of an HTTP client request and an HTTP server response @BradleyHolt HTTP/1.1 200 OK  Content-Type: application/json  Etag: "e146018c82000fdc"    {  …  } GET /kittens HTTP/1.1  Accept: application/json

Slide 41

Slide 41 text

Resource Representations A resource (identified by a URI) can take many representations

Slide 42

Slide 42 text

Content Negotiation Allows for different representations of a resource to be served from the same URI @BradleyHolt HTTP/1.1 200 OK  Content-Type: image/gif  Etag: "52CAA3A43D34531E"    R0lGODlhAQABAIAAAP/// wAAACwAAAAAAQABAAACAkQBADs= GET /kittens/mittens/photo HTTP/1.1  Accept: image/gif

Slide 43

Slide 43 text

Content Negotiation Allows for different representations of a resource to be served from the same URI @BradleyHolt HTTP/1.1 200 OK  Content-Type: image/png  Etag: "2EB93EA080ECAA64"    iVBORw0KGgoAAAANSUhEUgAAAAEAAA ABCAAAAAA6fptVAAAACklEQVQYV2P4 DwABAQEAWk1v8QAAAABJRU5ErkJggg == GET /kittens/mittens/photo HTTP/1.1  Accept: image/png

Slide 44

Slide 44 text

Examples

Slide 45

Slide 45 text

Connecting to CouchDB 2.0 $ http-console root:+2/y7v6h@127.0.0.1:15984 --json! @BradleyHolt

Slide 46

Slide 46 text

Connecting to CouchDB 2.0 $ http-console root:+2/y7v6h@127.0.0.1:15984 --json! > http-console 0.6.3! > Welcome, enter .help if you're lost.! > Connecting to 127.0.0.1 on port 15984.! @BradleyHolt

Slide 47

Slide 47 text

Connecting to IBM Cloudant $ http-console https://bradley-holt:passw0rd@bradley-holt.cloudant.com --json! @BradleyHolt

Slide 48

Slide 48 text

Connecting to IBM Cloudant $ http-console https://bradley-holt:passw0rd@bradley-holt.cloudant.com --json! > http-console 0.6.3! > Welcome, enter .help if you're lost.! > Connecting to bradley-holt.cloudant.com on port 443.! @BradleyHolt

Slide 49

Slide 49 text

Request Headers />! @BradleyHolt

Slide 50

Slide 50 text

Request Headers /> .headers! @BradleyHolt

Slide 51

Slide 51 text

Request Headers /> .headers! Accept: application/json! Content-Type: application/json! Authorization: Basic cm9vdDorMi95N3Y2aA==! Host: 127.0.0.1! @BradleyHolt

Slide 52

Slide 52 text

PUT a Database />! @BradleyHolt

Slide 53

Slide 53 text

PUT a Database /> PUT /kittens! @BradleyHolt

Slide 54

Slide 54 text

PUT a Database /> PUT /kittens! ... ! @BradleyHolt

Slide 55

Slide 55 text

PUT a Database /> PUT /kittens! ... ! HTTP/1.1 201 Created! Content-Type: application/json! Location: http://127.0.0.1/kittens! ! { ok: true }! @BradleyHolt

Slide 56

Slide 56 text

PUT a Database Again /> ! @BradleyHolt

Slide 57

Slide 57 text

PUT a Database Again /> PUT /kittens! @BradleyHolt

Slide 58

Slide 58 text

PUT a Database Again /> PUT /kittens! ... ! @BradleyHolt

Slide 59

Slide 59 text

PUT a Database Again /> PUT /kittens! ... ! HTTP/1.1 412 Precondition Failed! Content-Type: application/json! ! { error: 'file_exists', reason: 'The database could not be created, the file already exists.' }! @BradleyHolt

Slide 60

Slide 60 text

POST a Document />! @BradleyHolt

Slide 61

Slide 61 text

POST a Document /> /kittens! @BradleyHolt

Slide 62

Slide 62 text

POST a Document /kittens>! @BradleyHolt

Slide 63

Slide 63 text

POST a Document /kittens> POST /! @BradleyHolt

Slide 64

Slide 64 text

POST a Document /kittens> POST /! ... ! @BradleyHolt

Slide 65

Slide 65 text

POST a Document /kittens> POST /! ... { "_id": "mittens", "age_weeks": 10, "weight_kilograms": 0.997 }! @BradleyHolt

Slide 66

Slide 66 text

POST a Document /kittens> POST /! ... { "_id": "mittens", "age_weeks": 10, "weight_kilograms": 0.997 }! HTTP/1.1 201 Created! Content-Type: application/json! Location: http://127.0.0.1/kittens/mittens! ! {! ok: true,! id: 'mittens',! rev: '1-e665a40d9ea9711c983e907f0b0b6e8a'! }! @BradleyHolt

Slide 67

Slide 67 text

GET All Documents /kittens> ! @BradleyHolt

Slide 68

Slide 68 text

GET All Documents /kittens> GET /_all_docs! @BradleyHolt

Slide 69

Slide 69 text

GET All Documents /kittens> GET /_all_docs! HTTP/1.1 200 OK! Content-Type: application/json! Etag: "e1463d2fc36a120a6586018c82000fdc"! ! {! total_rows: 1,! offset: 0,! rows: [! {! id: 'mittens',! key: 'mittens',! value: { rev: '1-e665a40d9ea9711c983e907f0b0b6e8a' }! }! ]! }! @BradleyHolt

Slide 70

Slide 70 text

GET a Document /kittens> ! @BradleyHolt

Slide 71

Slide 71 text

GET a Document /kittens> GET /mittens! @BradleyHolt

Slide 72

Slide 72 text

GET a Document /kittens> GET /mittens! HTTP/1.1 200 OK! Content-Type: application/json! Etag: "1-e665a40d9ea9711c983e907f0b0b6e8a"! ! {! _id: 'mittens',! _rev: '1-e665a40d9ea9711c983e907f0b0b6e8a',! age_weeks: 10,! weight_kilograms: 0.997! }! @BradleyHolt

Slide 73

Slide 73 text

PUT an Attachment /kittens> ! @BradleyHolt

Slide 74

Slide 74 text

PUT an Attachment /kittens> .headers! @BradleyHolt

Slide 75

Slide 75 text

PUT an Attachment /kittens> .headers! Accept: application/json! Content-Type: application/json! Authorization: Basic cm9vdDorMi95N3Y2aA==! Host: 127.0.0.1! @BradleyHolt

Slide 76

Slide 76 text

PUT an Attachment /kittens> .headers! Accept: application/json! Content-Type: application/json! Authorization: Basic cm9vdDorMi95N3Y2aA==! Host: 127.0.0.1! /kittens> Content-Type: image/gif! @BradleyHolt

Slide 77

Slide 77 text

PUT an Attachment /kittens> ! @BradleyHolt

Slide 78

Slide 78 text

PUT an Attachment /kittens> PUT /mittens/photo?rev=1-e665a40d9ea9711c983e907f0b0b6e8a! @BradleyHolt

Slide 79

Slide 79 text

PUT an Attachment /kittens> PUT /mittens/photo?rev=1-e665a40d9ea9711c983e907f0b0b6e8a! ...! @BradleyHolt

Slide 80

Slide 80 text

PUT an Attachment /kittens> PUT /mittens/photo?rev=1-e665a40d9ea9711c983e907f0b0b6e8a! ... R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=! @BradleyHolt

Slide 81

Slide 81 text

PUT an Attachment /kittens> PUT /mittens/photo?rev=1-e665a40d9ea9711c983e907f0b0b6e8a! ... R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=! HTTP/1.1 201 Created! Content-Type: application/json! Location: http://127.0.0.1/kittens/mittens/photo! ! {! ok: true,! id: 'mittens',! rev: '2-d858e51453a5785bafe517b7eddc5a98'! }! @BradleyHolt

Slide 82

Slide 82 text

Slide 83

Slide 83 text

Slide 84

Slide 84 text

GET an Attachment /kittens> ! @BradleyHolt

Slide 85

Slide 85 text

GET an Attachment /kittens> GET /mittens/photo! @BradleyHolt

Slide 86

Slide 86 text

GET an Attachment /kittens> GET /mittens/photo! HTTP/1.1 200 OK! Content-Type: image/gif! Etag: "UsqjdPnY6ApD2ENFOglFHg=="! ! R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=! @BradleyHolt

Slide 87

Slide 87 text

Conditional Caching /kittens> ! @BradleyHolt

Slide 88

Slide 88 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! @BradleyHolt

Slide 89

Slide 89 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! /kittens> ! @BradleyHolt

Slide 90

Slide 90 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! /kittens> GET /mittens/photo! @BradleyHolt

Slide 91

Slide 91 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! /kittens> GET /mittens/photo! HTTP/1.1 304 Not Modified! ! @BradleyHolt

Slide 92

Slide 92 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! /kittens> GET /mittens/photo! HTTP/1.1 304 Not Modified! ! /kittens> ! @BradleyHolt

Slide 93

Slide 93 text

Conditional Caching /kittens> If-None-Match: "UsqjdPnY6ApD2ENFOglFHg=="! /kittens> GET /mittens/photo! HTTP/1.1 304 Not Modified! ! /kittens> If-None-Match:! @BradleyHolt

Slide 94

Slide 94 text

DELETE a Document /kittens> ! @BradleyHolt

Slide 95

Slide 95 text

DELETE a Document /kittens> DELETE /mittens! @BradleyHolt

Slide 96

Slide 96 text

DELETE a Document /kittens> DELETE /mittens! HTTP/1.1 409 Conflict! Content-Type: application/json! ! { error: 'conflict', reason: 'Document update conflict.' }! @BradleyHolt

Slide 97

Slide 97 text

DELETE a Document /kittens> ! @BradleyHolt

Slide 98

Slide 98 text

DELETE a Document /kittens> HEAD /mittens! @BradleyHolt

Slide 99

Slide 99 text

DELETE a Document /kittens> HEAD /mittens! HTTP/1.1 200 OK! Etag: "2-d858e51453a5785bafe517b7eddc5a98"! ! @BradleyHolt

Slide 100

Slide 100 text

DELETE a Document /kittens> ! @BradleyHolt

Slide 101

Slide 101 text

DELETE a Document /kittens> If-Match: "2-d858e51453a5785bafe517b7eddc5a98"! @BradleyHolt

Slide 102

Slide 102 text

DELETE a Document /kittens> If-Match: "2-d858e51453a5785bafe517b7eddc5a98"! /kittens> ! @BradleyHolt

Slide 103

Slide 103 text

DELETE a Document /kittens> If-Match: "2-d858e51453a5785bafe517b7eddc5a98"! /kittens> DELETE /mittens! @BradleyHolt

Slide 104

Slide 104 text

DELETE a Document /kittens> If-Match: "2-d858e51453a5785bafe517b7eddc5a98"! /kittens> DELETE /mittens! HTTP/1.1 200 OK! Content-Type: application/json! ! {! ok: true,! id: 'mittens',! rev: '3-d0780627ddff7a7f536fe273100cec41'! }! @BradleyHolt

Slide 105

Slide 105 text

Slide 106

Slide 106 text

Slide 107

Slide 107 text

HTTP/2

Slide 108

Slide 108 text

HTTP/2 §  Same methods (GET, POST, PUT, DELETE, etc.), headers, and status codes §  No more need for optimizations that reduce the number of HTTP requests (e.g. inlining, concatenation, and sprites) §  Header compression §  Cache pushing §  Ability for clients to cancel a request §  Better performance for encrypted connections §  Binary protocol @BradleyHolt https://www.mnot.net/blog/2014/01/30/http2_expectations

Slide 109

Slide 109 text

Image Credits §  Dialing Up Web History by Mike Licht, on Flickr §  Web Hosting Servers by Widjaya Ivan, on Flickr §  API calls by Tsahi Levent-Levi, on Flickr §  Instagram and other Social Media Apps by Jason Howie, on Flickr §  interwoven by Jared Hansen, on Flickr §  Envelope by Blake Burkhart, on Flickr §  200 - OK by Tomomi, on Flickr §  201 - Created by Tomomi, on Flickr §  304 - Not Modified by Tomomi, on Flickr §  409 - Conflict by Tomomi, on Flickr §  500 - Internal Server Error by Tomomi, on Flickr §  Flood by Kai Wegner, on Flickr @BradleyHolt

Slide 110

Slide 110 text

Questions? @BradleyHolt