SlideShare ist ein Scribd-Unternehmen logo
1 von 164
Downloaden Sie, um offline zu lesen
HTTP et Architectures Orientées Web
Nicolas Martignole

CTO CaptainDash

@nmartignole
Devoxx Maroc 2015
Quentin Adam

CEO CleverCloud

@waxze
Une histoire d’HTTP, des effets spéciaux, des bonnes pratiques d’un design d’API REST,
et en terminant par HTTP/2
Exclusivité mondiale de cette présentation…
Devoxx Maroc 2015
Exclusivité mondiale de cette présentation…
… jamais présentée dans aucunes conférences
… jamais répétée
Devoxx Maroc 2015
Who am I ?
Quentin ADAM from the Clever Cloud
@waxzce on twitter – github- soundcloud – instagram ….
My day to day work : 

Clever Cloud, make your app run all the time
Keep your apps online. made with node.js, scala,
java, ruby, php, python, go…
And learn a lot of things about your code, apps,
and good/bad design…
Nic
Who am I ?
Nicolas Martignole, CTO Captain Dash
Devoxx France - @nmartignole
Devoxx Maroc  2015 HTTP 1, HTTP 2 and folks
D E V O X X F R A N C E
C O N F É R E N C E P O U R D É V E L O P P E U R S
2 0 A U 2 2 A V R I L 2 0 1 6
Ce que vous allez découvrir, apprendre, revoir, comprendre
HTTP
HyperText

Transfert

Protocol
Devoxx Maroc  2015 HTTP 1, HTTP 2 and folks
HTTP1 est un protocole texte
Une spécification extensible
Simple
• Connexion TCP
Requête
Réponse
Une requête simple
GET / HTTP/1.1
Host: cfp.devoxx.fr
Une requête peut comporter 2 parties
POST /cfp/profile HTTP/1.1
Host: cfp.devoxx.fr
Connection: keep-alive
Content-Length: 568
Cache-Control: max-age=0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Origin: http://cfp.devoxx.fr
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/31.0.1650.63 Safari/537.36
Content-Type: application/x-www-form-urlencoded
Referer: http://cfp.devoxx.fr/cfp/profile
Accept-Encoding: gzip,deflate,sdch
Accept-Language: fr,fr-FR;q=0.8,en;q=0.6,en-US;q=0.4
Cookie: ...
email=nicolas%40touilleur-express.fr&avatarUrl=http%3A%2F%2Fwww.gravatar.com%2Favatar
%2F09b788738dcb5d36dbd782db5ad66304&company=Le+Touilleur+Express&bio=Nicolas+est+un+d
%C3%A9veloppeur+ind%C3%A9pendant%2C+vivant+%C3%A0+Paris.+%0D%0A%0D%0AIl+est+co-fondateur+et
+organisateur+de+la+conf%C3%A9rence+Devoxx+France.%0D%0AIl+blog+depuis+plusieurs+ann%C3%A9es+sur
+le+blog+%22Le+Touilleur+Express%22+http%3A%2F%2Fwww.touilleur-express.fr%2C+qui+compte+plus+de
+800+articles.%0D%0A%0D%0A&twitter=%40nmartignole&blog=http%3A%2F%2Fwww.touilleur-
express.fr&name=Nicolas+Martignole
Des Verbes
Des verbes
• GET

• HEAD

• POST

• PUT

• DELETE

• OPTIONS

• TRACE

• CONNECT
RFC 2616
Safe-Method
• GET
• HEAD
RFC 2616
• POST
• OPTIONS
• PUT
• DELETE
• TRACE
• CONNECT
No server-side effect
Just retrieve a resource
Idempotent
• GET
• HEAD
• PUT
• DELETE
RFC 2616
• POST
• OPTIONS
• TRACE
• CONNECT
GET /images/cat.png HTTP/1.1
Host: www.cats.org
DELETE /jobs/job/234 HTTP/1.1
Host: www.monsters.com
Verbes
• GET

• POST

• HEAD

• OPTIONS

• DELETE

• PUT

• TRACE

• CONNECT
Exemple POST
POST /cfp/profile/saveProfile HTTP/1.1
Authorization: Basic xxxx
Host: cfp.devoxx.fr
Content-Length: 25
Content-Type: application/x-www-form-urlencoded
email=nicolas%40devoxx.fr
Exemple PUT
PUT /cfp/profile/nicolas HTTP/1.1
Authorization: Basic xxxx
Host: cfp.devoxx.fr
Content-Length: 55
Accept: application/json
{
"id":212340,
"email": "nicolas@devoxx.fr"
}
POST : URI est la ressource qui accepte les
données
PUT : entité qui doit être modifié
POST
POST /cfp/profile/nicolas
Response
HTTP/1.1 201 Created
Date: Mon, 09 Dec 2013 11:22:00 GMT
Content-Length: 1200
Location: http://cfp.devoxx.fr/profiles/profile/nicolas
Status code
• 2xx : OK
• 3xx : Not here
• 4xx : Client screwed up
• 5xx : Server screwed up
Status code
201 Created
202 Accepted
206 Partial Content
301 Moved permanently
303 See Other
304 Not Modified
400 Bad Request
401 Unauthorized
404 Not Found
406 Not Acceptable
409 Conflict
412 Precondition Failed
417 Expectation Failed
Request Headers
Accept
Accept-Charset
Accept-Encoding
Accept-Language
Authorization
Expect
From
Host
If-Match
If-Modified-Since
If-None-Match
If-Range
If-Unmodified-Since
Max-Forwards
Proxy-Authorization
Range
Referer
TE
User-Agent
Request Headers
Accept
Accept-Charset
Accept-Encoding
Accept-Language
Authorization
Expect
From
Host
If-Match
If-Modified-Since
If-None-Match
If-Range
If-Unmodified-Since
Max-Forwards
Proxy-Authorization
Range
Referer
TE
User-Agent
Techniques simples de gestion du Cache
Expires
Pragma
Cache-Control
Expires
Pragma
Cache-Control
Expires
Pragma
Cache-Control
HTTP 1.0
HTTP 1.1
Expires
GET /profile/nicolas HTTP/1.0
Host: cfp.devoxx.fr
HTTP/1.0 200 Ok
Expires: Mon, 29 Feb 2014 10:00:00 GMT
Content-Length: 1200
Content-Type: application/json
{"profile":22334}
Cache-Control
HTTP/1.1 200 Ok
Cache-Control: max-age=120
Content-Length: 1200
Content-Type: application/json
{"profile":22334}
Cache-Control
HTTP/1.1 200 Ok
Cache-Control: public, max-age=120, s-maxage=120
Content-Length: 1200
Content-Type: application/json
{"profile":22334}
Can be cached by a Proxy
Cache-Control = "Cache-Control" ":" 1#cache-directive
cache-directive = cache-request-directive
| cache-response-directive
cache-request-directive =
"no-cache" ; Section 14.9.1
| "no-store" ; Section 14.9.2
| "max-age" "=" delta-seconds ; Section 14.9.3, 14.9.4
| "max-stale" [ "=" delta-seconds ] ; Section 14.9.3
| "min-fresh" "=" delta-seconds ; Section 14.9.3
| "no-transform" ; Section 14.9.5
| "only-if-cached" ; Section 14.9.4
| cache-extension ; Section 14.9.6
cache-response-directive =
"public" ; Section 14.9.1
| "private" [ "=" <"> 1#field-name <"> ] ; Section 14.9.1
| "no-cache" [ "=" <"> 1#field-name <"> ]; Section 14.9.1
| "no-store" ; Section 14.9.2
| "no-transform" ; Section 14.9.5
| "must-revalidate" ; Section 14.9.4
| "proxy-revalidate" ; Section 14.9.4
| "max-age" "=" delta-seconds ; Section 14.9.3
| "s-maxage" "=" delta-seconds ; Section 14.9.3
| cache-extension ; Section 14.9.6
La mise en cache
• Consultez http://www.mnot.net/cache_docs/
ETag
Exemple simple ETag
HTTP/1.1 200 Ok
Age: 0
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Date: Wed, 08 Jan 2014 12:25:10 GMT
ETag: 1s76wo-1503
Connection: keep-alive
<! DOCTYPE html>
<html>…..
</html>
GET /from-paris/quality HTTP/1.1
Host: cfp.devoxx.fr
Exemple simple ETag : je reviens te voir
GET /from-paris/quality HTTP/1.1
Host: cfp.devoxx.fr
If-None-Match: 1s76wo-1503
Exemple simple : la page n’a pas changé
HTTP/1.1 304 Not Modified
Accept-Ranges: bytes
Age: 0
Content-length: 0
Date: Wed, 08 Jan 2014 12:29:17 GMT
Connection: keep-alive
GET /from-paris/quality HTTP/1.1
Host: cfp.devoxx.fr
If-None-Match: 1s76wo-1503
Exemple avec Devoxx France
• Afficher une page programme de conférence

• Liste des conférences

• Pour chaque conférence, le nom et la bio du présentateur
ETag
• Charge la liste des conférences, et pour chaque conférence, les détails des
présentateurs.
Requête
Liste des Conférences
1. charge les conférences
2. charge les speakers
3. retourne la réponse
53 KB - 140ms
GET /conferences HTTP/1.1
Host: cfp.devoxx.fr
ETag
• La page liste des conférences est coûteuse à calculer
2kB - 30ms
49KB- 110ms
Liste des Conférences
1. charge les conférences
2. charge les speakers
3. retourne la réponse
«La liste des conférences détermine la liste des speakers»
ETag
• Opérations et transferts inutiles
Requête
Réponse
51 KB - 140ms
Liste des Conférences
1. charge les conférences
2. charge les speakers
3. retourne la réponse
ETag : comment optimiser et améliorer les performances
ETag
• Si pas de ETag (première visite)
Requête
Liste des Conférences
1. charge la liste des
conférences
2. charge les speakers
3. retourne la réponse
avec
ETag calculé sur la liste
des conférences
Réponse
HTTP/1.1 200 Ok
...
ETag: safik20-demo123
...
ETag
• 2ème visite, présente l’entête If-None-Match
Requête
Liste des Conférences
1. charge les conférences
2. calcule ETag
3. si ETag est identique à
celui présenté dans If-
None-Match alors
retourne 304 Not Modified
Réponse
HTTP/1.1 304 Not Modified
ETag: safik20-demo123
Content-Length: 0
GET /conferences HTTP/1.1
Host: cfp.devoxx.fr
If-None-Match: safik20-demo123
2 KB - 15ms
Ne charge pas
la liste des
speakers !
ETag (et si la liste des conférences est modifié ?)
• 2ème visite, présente l’entête If-None-Match
Requête
Liste des Conférences
1. charge les conférences
2. calcule ETag
3. si ETag est différent à
celui présenté dans If-
None-Match alors
3.a) charge speakers
3.b) retourne résultat avec
nouvel ETag
Réponse
HTTP/1.1 200 Ok
ETag: ttg234-hgd789
Cache-Control: no-cache
Content-Length: 1429
Content-Type: text/html
GET /conferences HTTP/1.1
Host: cfp.devoxx.fr
If-None-Match: safik20-demo123
53 KB - 140ms
ETag
• Résumé
Liste des Conférences
1. charge les conférences
2. calcule ETag sur la liste des conférences
3. compare ce ETag avec If-None-Match si présent
4.a - si identique, retourne 304 Not Modified
4.b - si différent, charge les speakers, puis retourne 200
Ok + ETag
4.c - si pas de If-None-Match dans la requête alors
retourne 200 Ok + ETag
Bénéfices
• Eviter des appels coûteux ou lents

• Economie de ressources

• Améliore les temps de réponse

• Simple
ETag - Avancé
• Permet d’effacer un élément précis
Requête
Liste des Conférences
Réponse
HTTP/1.1 428 Precondition Required
Date: Wed, 14 Sep 2013 14:01:00
DELETE /conf/proposal/02 HTTP/1.1
Host: cfp.devoxx.fr
ETag - Avancé
• Permet d’effacer un élément précis
Requête
Liste des Conférences
Réponse
HTTP/1.1 204 No Content
Date: Wed, 14 Sep 2013 14:01:00
DELETE /conf/proposal/02 HTTP/1.1
Host: cfp.devoxx.fr
If-Match: 120sg-demo123
ETag - Avancé
• Permet d’effacer un élément précis
Requête
Liste des Conférences
Réponse
HTTP/1.1 404 Not Found
Date: Wed, 14 Sep 2013 14:01:00
DELETE /conf/proposal/02 HTTP/1.1
Host: cfp.devoxx.fr
If-Match: 120sg-demo123
Content negociation
ImportantpourconstruireunebonneAPIWeb
Ressource versus Representation
/cfp/speaker/nicolas
text/html
application/json
gzipped
FR or EN
Requête
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Authorization: Basic xxxx
Réponse
HTTP/1.1 200 OK
Date: Sun, 17 Nov 2013 18:00:23
Content-Type: application/json
{
"id": 2345,
"name": "Nicolas Martignole",
"photo": "http://s3.amazonaws.com/b/t22/hh.png"
}
Réponse - 2
HTTP/1.1 200 OK
Date: Sun, 17 Nov 2013 18:00:23
Content-Type: text/xml
<speaker id="2345">
<name>Nicolas Martignole</name>
<photo src="http://s3.amazonaws.com/b/t22/hh.png"/>
</speaker>
Requête
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Requête
GET /cfp/speaker/nicolas.json HTTP/1.1
Host: cfp.devoxx.fr
GET /cfp/speaker/nicolas.xml HTTP/1.1
Host: cfp.devoxx.fr
?
Requête
Ressource vs Representation
Requête - solution 1
GET /cfp/speaker/nicolas?format=json HTTP/1.1
Host: cfp.devoxx.fr
GET /cfp/speaker/nicolas?format=xml HTTP/1.1
Host: cfp.devoxx.fr
Requête - solution 2
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Accept: application/json
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Accept: application/xml
Requête - encore plus mieux meilleur bien
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Accept: application/json, application/xml
Requête - quality
GET /cfp/speaker/nicolas HTTP/1.1
Host: cfp.devoxx.fr
Accept: application/json, application/xml;q=0.5
Accept header
GET /HTTP/1.1
Host: cfp.devoxx.fr
Accept: text/html,application/xhtml+xml,application/
xml;q=0.9,*/*;q=0.8
Accept (cont.)
GET /HTTP/1.1
Host: cfp.devoxx.fr
Accept: text/html,application/xhtml+xml,application/
xml;q=0.9,*/*;q=0.8
Accept-Encoding: gzip
Accept-Language: fr,fr-FR;q=0.8,en;q=0.6,en-US;q=0.4
"Je
 suis
 un
 navigateur
 Français,
 qui
 préfère
 le
 HTML
 
et
 qui
 accepte
 la
 compression
Bénéfices
• Gestion de la langue sur un site

• Peut-on compresser ou non ?

• Quel format préfères-tu ?
Gestion de la version
d’une API type REST
Unerecettedesmeilleurs
cuisiniersenAPIWeb
Gestion de la version d’une API REST
GET /cfp/speakers HTTP/1.1
Host: cfp.devoxx.fr
C’est la version 1
Gestion de la version d’une API REST
GET /v1/cfp/speakers HTTP/1.1
Host: cfp.devoxx.fr
?
Gestion de la version d’une API REST
GET /v1.45.11-update-34/cfp/speakers HTTP/1.1
Host: cfp.devoxx.fr
?
Gestion de la version d’une API REST
GET /cfp/speakers HTTP/1.1
Host: cfp.devoxx.fr
Accept: application/vnd.devoxxfr-v1.json
Une solution
Hypermedia API
Larecettedesmeilleurs
cuisiniersenAPIWeb
Une API Web
• un namespace/un domaine

• un ensemble de ressources

• des paramètres
Le plus gros soucis souvent rencontré
• Construire une API Web est loin d’être simple

• Le couplage afférent entre le client et le serveur est le souci numéro 1
GET /posts/createNew
POST /myapp/doSomething/index.jsf
Exemples
• Hypermedia API : une API Web avec l’expérience d’un site Web

• Pas de connaissances contractuelles entre le client et le serveur à priori

• Exemples : https://api.github.com/
Exemple sur l’API REST du CFP de Devoxx Maroc
• Utiliser Postman sur Chrome 

• cfp.devoxx.ma/api
https://api.github.com/
{
current_user_url: https://api.github.com/user,
authorizations_url: https://api.github.com/authorizations,
code_search_url: https://api.github.com/search/code?q={query}{page,per_page,sort,order},
emails_url: https://api.github.com/user/emails,
emojis_url: https://api.github.com/emojis,
events_url: https://api.github.com/events,
feeds_url: https://api.github.com/feeds,
following_url: https://api.github.com/user/following{/target},
gists_url: https://api.github.com/gists{/gist_id},
hub_url: https://api.github.com/hub,
issue_search_url: https://api.github.com/search/issues?q={query}{page,per_page,sort,order},
issues_url: https://api.github.com/issues,
keys_url: https://api.github.com/user/keys,
notifications_url: https://api.github.com/notifications,
organization_repositories_url: https://api.github.com/orgs/{org}/repos/{?type,page,per_page,sort},
organization_url: https://api.github.com/orgs/{org},
public_gists_url: https://api.github.com/gists/public,
rate_limit_url: https://api.github.com/rate_limit,
repository_url: https://api.github.com/repos/{owner}/{repo},
repository_search_url: https://api.github.com/search/repositories?q={query}{page,per_page,sort,order},
current_user_repositories_url: https://api.github.com/user/repos{?type,page,per_page,sort},
starred_url: https://api.github.com/user/starred{/owner}{/repo},
starred_gists_url: https://api.github.com/gists/starred,
team_url: https://api.github.com/teams,
user_url: https://api.github.com/users/{user},
user_organizations_url: https://api.github.com/user/orgs,
user_repositories_url: https://api.github.com/users/{user}/repos{?type,page,per_page,sort},
user_search_url: https://api.github.com/search/users?q={query}{page,per_page,sort,order}
}
https://api.github.com/users/nicmarti
{
login: nicmarti,
id: 157075,
avatar_url: https://gravatar.com/avatar/09b788738dcb5d36dbd782db5ad66304?d=https%3A%2F%2Fidenticons.github.com
%2Ff406ed0654d6234aa9eb283c4e5b02f2.pngr=x,
gravatar_id: 09b788738dcb5d36dbd782db5ad66304,
url: https://api.github.com/users/nicmarti,
html_url: https://github.com/nicmarti,
followers_url: https://api.github.com/users/nicmarti/followers,
following_url: https://api.github.com/users/nicmarti/following{/other_user},
gists_url: https://api.github.com/users/nicmarti/gists{/gist_id},
starred_url: https://api.github.com/users/nicmarti/starred{/owner}{/repo},
subscriptions_url: https://api.github.com/users/nicmarti/subscriptions,
organizations_url: https://api.github.com/users/nicmarti/orgs,
repos_url: https://api.github.com/users/nicmarti/repos,
events_url: https://api.github.com/users/nicmarti/events{/privacy},
received_events_url: https://api.github.com/users/nicmarti/received_events,
type: User,
site_admin: false,
name: Nicolas Martignole,
company: Le Touilleur Express,
blog: http://www.touilleur-express.fr,
location: Paris, France,
email: nicolas@touilleur-express.fr,
hireable: true,
bio: Nicolas is a freelancer, based in Paris France.rnHe is first a Web developer, someone that is able to build a Web
application with Java, Scala or Groovy like its job board www.express-board.fr. rnrnHe's the co-funder of Devoxx France, a
conference for developers in Paris, in April 2012. He is also a member of the Paris JUG.rnrnYou can read his blog Le
Touilleur Express http://www.touilleur-express.fr and follow-him on Twitter @nmartignole,
public_repos: 21,
public_gists: 16,
followers: 94,
following: 3,
https://api.github.com/users/nicmarti
{
login: nicmarti,
id: 157075,
avatar_url: https://gravatar.com/avatar/09b788738dcb5d36dbd782db5ad66304?d=https%3A%2F%2Fidenticons.github.com
%2Ff406ed0654d6234aa9eb283c4e5b02f2.pngr=x,
gravatar_id: 09b788738dcb5d36dbd782db5ad66304,
url: https://api.github.com/users/nicmarti,
html_url: https://github.com/nicmarti,
followers_url: https://api.github.com/users/nicmarti/followers,
following_url: https://api.github.com/users/nicmarti/following{/other_user},
gists_url: https://api.github.com/users/nicmarti/gists{/gist_id},
starred_url: https://api.github.com/users/nicmarti/starred{/owner}{/repo},
subscriptions_url: https://api.github.com/users/nicmarti/subscriptions,
organizations_url: https://api.github.com/users/nicmarti/orgs,
repos_url: https://api.github.com/users/nicmarti/repos,
events_url: https://api.github.com/users/nicmarti/events{/privacy},
received_events_url: https://api.github.com/users/nicmarti/received_events,
type: User,
site_admin: false,
name: Nicolas Martignole,
company: Le Touilleur Express,
blog: http://www.touilleur-express.fr,
location: Paris, France,
email: nicolas@touilleur-express.fr,
hireable: true,
bio: Nicolas is a freelancer, based in Paris France.rnHe is first a Web developer, someone that is able to build a
Web application with Java, Scala or Groovy like its job board www.express-board.fr. rnrnHe's the co-funder of Devoxx
France, a conference for developers in Paris, in April 2012. He is also a member of the Paris JUG.rnrnYou can read his
blog Le Touilleur Express http://www.touilleur-express.fr and follow-him on Twitter @nmartignole,
public_repos: 21,
public_gists: 16,
followers: 94,
following: 3,
created_at: 2009-11-23T15:09:57Z,
updated_at: 2014-01-05T16:58:14Z
}
HATEOAS
• Hypermedia as the engine of application state

• chaque ressource décrit ses possibilités et ses relations
Ticket «Nouveau»
- soumettre
- effacer
Ticket «Envoyé»
- annuler envoi
- effacer
Ticket «Effacé»
HATEOAS
• Relations entre les ressources
root
id q0 /id
link rel = q1 uri = ... /
link rel = q2 uri = ... /
/root
root
id q1 /id
link rel = q0 uri = ... /
link rel = q3 uri = ... /
/root
HATEOAS
• Description des fonctionnalités
ticket: {
assigned_to: nicolas,
links: [
{rel: “unassign”, url: “...”},
{rel: “close”, url: “...”}
]
}
Modèle de maturité de Leonard Richardson
• Comprendre les pratiques d’architecture pour construire une API WEB REST «pure»
Niveau 0 de l’API Web
• SOAP, WebServices, les machins des années 2000
Voir http://martinfowler.com/articles/richardsonMaturityModel.html
Niveau 0 de l’API Web
Voir http://martinfowler.com/articles/richardsonMaturityModel.html
POST /appointmentService HTTP/1.1
[various other headers]
openSlotRequest date = 2010-01-04 doctor = mjones/
HTTP/1.1 200 OK
[various headers]
openSlotList
slot start = 1400 end = 1450
doctor id = mjones/
/slot
/openSlotList
POST /appointmentService HTTP/1.1
[various other headers]
appointmentRequest
slot doctor = mjones start = 1400 end = 1450/
patient id = nmartignole/
/appointmentRequest HTTP/1.1 200 OK
[various headers]
appointment
slot doctor = mjones start = 1400 end = 1450/
patient id = nmartignole/
/appointment
HTTP/1.1 200 OK
[various headers]
appointmentRequestFailure
slot doctor = mjones start = 1400 end = 1450/
patient id = nmartignole/
reasonSlot not available/reason
/appointmentRequestFailure
Niveau 1 - utilisation des Ressources
• Requêtes à différentes ressources
Niveau 1 - utilisation des Ressources
POST /doctors/mjones HTTP/1.1
[various other headers]
openSlotRequest date = 2010-01-04/ HTTP/1.1 200 OK
[various headers]
openSlotList
slot id = 1234 doctor = mjones start = 1400 end = 1450/
slot id = 5678 doctor = mjones start = 1600 end = 1650/
/openSlotList
POST /slots/1234 HTTP/1.1
[various other headers]
appointmentRequest
patient id = jsmith/
/appointmentRequest
HTTP/1.1 200 OK
[various headers]
appointment
slot id = 1234 doctor = mjones start = 1400 end = 1450/
patient id = jsmith/
/appointment
Niveau 2 - utilisation des Ressources et des Verbes
• Requêtes à différentes ressources en utilisant les verbes HTTP. Les codes de retour
HTTP sont utilisés pour indiquer le succès des requêtes.
Niveau 2 - utilisation des Ressources et des Verbes
GET /doctors/mjones/slots?date=20100104status=open HTTP/1.1
Host: royalhope.nhs.uk
HTTP/1.1 200 OK
[various headers]
openSlotList
slot id = 1234 doctor = mjones start = 1400 end = 1450/
slot id = 5678 doctor = mjones start = 1600 end = 1650/
/openSlotList
POST /slots/1234 HTTP/1.1
[various other headers]
appointmentRequest
patient id = jsmith/
/appointmentRequest
HTTP/1.1 201 Created
Location: slots/1234/appointment
[various headers]
appointment
slot id = 1234 doctor = mjones start = 1400 end = 1450/
patient id = jsmith/
/appointment
HTTP/1.1 409 Conflict
[various headers]
openSlotList
slot id = 5678 doctor = mjones start = 1600 end = 1650/
/openSlotList
Niveau 3 - Ressource/Verbes et HATEOAS
• Chaque ressource décrit les références et les liens avec d’autres ressources
Niveau 3 - Ressource/Verbes et HATEOAS
GET /doctors/mjones/slots?date=20100104status=open HTTP/1.1
Host: royalhope.nhs.uk
HTTP/1.1 200 OK
[various headers]
openSlotList
slot id = 1234 doctor = mjones start = 1400 end = 1450
link rel = /linkrels/slot/book
uri = /slots/1234/
/slot
/openSlotListPOST /slots/1234 HTTP/1.1
[various other headers]
appointmentRequest
patient id = jsmith/
/appointmentRequest
HTTP/1.1 201 Created
Location: http://royalhope.nhs.uk/slots/1234/appointment
[various headers]
appointment
slot id = 1234 doctor = mjones start = 1400 end = 1450/
patient id = jsmith/
link rel = /linkrels/appointment/cancel
uri = /slots/1234/appointment/
link rel = /linkrels/appointment/addTest
uri = /slots/1234/appointment/tests/
link rel = self
uri = /slots/1234/appointment/
link rel = /linkrels/appointment/changeTime
uri = /doctors/mjones/slots?date=20100104@status=open/
link rel = /linkrels/appointment/updateContactInfo
uri = /patients/jsmith/contactInfo/
link rel = /linkrels/help
uri = /help/appointment/
/appointment
ATOM
(RFC 4287)
Donne moi l’URI de linkrels/slot/book
Pour résumer
• Le niveau 3 est un pré-requis pour construire une API WEB type REST

• Niveau 0 ne doit pas être utilisé

• Niveau 1 permet d’identifier les différentes ressource de votre service

• Niveau 2 encourage l’utilisation des verbes HTTP plutôt que de redéfinir des méthode

• Niveau 3 introduit les notions de découverte et de relation entre les ressources. Le
service devient auto-documenté
Swagger
• `
Devoxx Maroc  2015 HTTP 1, HTTP 2 and folks
Devoxx Maroc  2015 HTTP 1, HTTP 2 and folks
Devoxx Maroc  2015 HTTP 1, HTTP 2 and folks
Faster faster faster
// requests ?
http pipelining
The hacks we are doing
everyday without thinking
to improve performances
Multiple domain names for multiples streams
Static assets domain name for Fat cookies problem
management
Comet/Websocket/pulling/server sent envent…
Bidirectional data streams hacks
So, we need a new version of http
Who is in charge ?
Httpbis working group
First http/2 draft is
spdy/3 draft
Build on something
So what is in the box ?
HTTP/2 is a binary protocol
Hhtp/1 +
Compression +
SSL = ~binary
Binary protocol are safer, easer to parse, concise…
Wireshark for all
What is wireshark ?
Your app Wireshark System
Network
card
Build only 1 tcp connection
Put some steams in one connection
Streams

~ 1 http/1 request = 1 http/2 stream
Streams are built of frames
frames
Content a.html #1
Content dog.gif
#1
Content a.html #2
Content dog.gif
#2
Content a.html #4Content a.html #3
Content cat.gif
#1
Content dog.gif
#4
…
Binary goodness = frames is easy
Streams priority
Improve the browser waterfall with stream
priority
Push from the server a resource to the cache
User xp will be better
Headers compressions
HPACK
*new RFC*
Headers persistence
Focus on web performances
url cannot change
How to update
the web ?
http



https
Negociate a protocol
elevation
HTTP/1 build in method
Upgrade:
header
Code 101
Switching
workflow
workflow
It’s still slow
Encrypt the web :

TLS
Current negotiation: TLS version, cypher…
Negotiate the protocol in the same time of
encrypt negotiation
NPN (client)



ALPN (server)

Use this
Is it for real?
Looks like ip v6 story?
More Spdy story
Benchmark time
Caution

Weitere ähnliche Inhalte

Was ist angesagt?

Frontend Performance: De débutant à Expert à Fou Furieux
Frontend Performance: De débutant à Expert à Fou FurieuxFrontend Performance: De débutant à Expert à Fou Furieux
Frontend Performance: De débutant à Expert à Fou FurieuxPhilip Tellis
 
Frontend Performance: Expert to Crazy Person
Frontend Performance: Expert to Crazy PersonFrontend Performance: Expert to Crazy Person
Frontend Performance: Expert to Crazy PersonPhilip Tellis
 
Advanced HTTP Caching
Advanced HTTP CachingAdvanced HTTP Caching
Advanced HTTP CachingMartin Breest
 
HAProxy scale out using open source
HAProxy scale out using open sourceHAProxy scale out using open source
HAProxy scale out using open sourceIngo Walz
 
Converting Your Dev Environment to a Docker Stack - php[world]
Converting Your Dev Environment to a Docker Stack - php[world]Converting Your Dev Environment to a Docker Stack - php[world]
Converting Your Dev Environment to a Docker Stack - php[world]Dana Luther
 
TomcatCon: from a cluster to the cloud
TomcatCon: from a cluster to the cloudTomcatCon: from a cluster to the cloud
TomcatCon: from a cluster to the cloudJean-Frederic Clere
 
HTTP colon slash slash: the end of the road?
HTTP colon slash slash: the end of the road?HTTP colon slash slash: the end of the road?
HTTP colon slash slash: the end of the road?Alessandro Nadalin
 
Converting Your Dev Environment to a Docker Stack - Cascadia
Converting Your Dev Environment to a Docker Stack - CascadiaConverting Your Dev Environment to a Docker Stack - Cascadia
Converting Your Dev Environment to a Docker Stack - CascadiaDana Luther
 
Altitude San Francisco 2018: Programming the Edge
Altitude San Francisco 2018: Programming the EdgeAltitude San Francisco 2018: Programming the Edge
Altitude San Francisco 2018: Programming the EdgeFastly
 
Frontend Performance: Beginner to Expert to Crazy Person
Frontend Performance: Beginner to Expert to Crazy PersonFrontend Performance: Beginner to Expert to Crazy Person
Frontend Performance: Beginner to Expert to Crazy PersonPhilip Tellis
 
Caching the Uncacheable
Caching the UncacheableCaching the Uncacheable
Caching the Uncacheabledanrot
 
Alternative Infrastucture
Alternative InfrastuctureAlternative Infrastucture
Alternative InfrastuctureMarc Seeger
 
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...NoNameCon
 
Web Server Deathmatch 2009 Erlang Factory Joe Williams
Web Server Deathmatch 2009 Erlang Factory Joe WilliamsWeb Server Deathmatch 2009 Erlang Factory Joe Williams
Web Server Deathmatch 2009 Erlang Factory Joe Williamslogicalstack
 
Alfresco Security Best Practices 2012
Alfresco Security Best Practices 2012Alfresco Security Best Practices 2012
Alfresco Security Best Practices 2012Toni de la Fuente
 
Altitude San Francisco 2018: Testing with Fastly Workshop
Altitude San Francisco 2018: Testing with Fastly WorkshopAltitude San Francisco 2018: Testing with Fastly Workshop
Altitude San Francisco 2018: Testing with Fastly WorkshopFastly
 
SREConEurope15 - The evolution of the DHCP infrastructure at Facebook
SREConEurope15 - The evolution of the DHCP infrastructure at FacebookSREConEurope15 - The evolution of the DHCP infrastructure at Facebook
SREConEurope15 - The evolution of the DHCP infrastructure at FacebookAngelo Failla
 

Was ist angesagt? (20)

Frontend Performance: De débutant à Expert à Fou Furieux
Frontend Performance: De débutant à Expert à Fou FurieuxFrontend Performance: De débutant à Expert à Fou Furieux
Frontend Performance: De débutant à Expert à Fou Furieux
 
Frontend Performance: Expert to Crazy Person
Frontend Performance: Expert to Crazy PersonFrontend Performance: Expert to Crazy Person
Frontend Performance: Expert to Crazy Person
 
Advanced HTTP Caching
Advanced HTTP CachingAdvanced HTTP Caching
Advanced HTTP Caching
 
HAProxy scale out using open source
HAProxy scale out using open sourceHAProxy scale out using open source
HAProxy scale out using open source
 
Converting Your Dev Environment to a Docker Stack - php[world]
Converting Your Dev Environment to a Docker Stack - php[world]Converting Your Dev Environment to a Docker Stack - php[world]
Converting Your Dev Environment to a Docker Stack - php[world]
 
TomcatCon: from a cluster to the cloud
TomcatCon: from a cluster to the cloudTomcatCon: from a cluster to the cloud
TomcatCon: from a cluster to the cloud
 
HTTP colon slash slash: the end of the road?
HTTP colon slash slash: the end of the road?HTTP colon slash slash: the end of the road?
HTTP colon slash slash: the end of the road?
 
Converting Your Dev Environment to a Docker Stack - Cascadia
Converting Your Dev Environment to a Docker Stack - CascadiaConverting Your Dev Environment to a Docker Stack - Cascadia
Converting Your Dev Environment to a Docker Stack - Cascadia
 
Altitude San Francisco 2018: Programming the Edge
Altitude San Francisco 2018: Programming the EdgeAltitude San Francisco 2018: Programming the Edge
Altitude San Francisco 2018: Programming the Edge
 
Frontend Performance: Beginner to Expert to Crazy Person
Frontend Performance: Beginner to Expert to Crazy PersonFrontend Performance: Beginner to Expert to Crazy Person
Frontend Performance: Beginner to Expert to Crazy Person
 
Caching the Uncacheable
Caching the UncacheableCaching the Uncacheable
Caching the Uncacheable
 
Alternative Infrastucture
Alternative InfrastuctureAlternative Infrastucture
Alternative Infrastucture
 
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...
Help, my browser is leaking! Exploring XSLeaks attacks and defenses - Tom Van...
 
Swoole Love PHP
Swoole Love PHPSwoole Love PHP
Swoole Love PHP
 
Web Server Deathmatch 2009 Erlang Factory Joe Williams
Web Server Deathmatch 2009 Erlang Factory Joe WilliamsWeb Server Deathmatch 2009 Erlang Factory Joe Williams
Web Server Deathmatch 2009 Erlang Factory Joe Williams
 
From a cluster to the Cloud
From a cluster to the CloudFrom a cluster to the Cloud
From a cluster to the Cloud
 
Alfresco Security Best Practices 2012
Alfresco Security Best Practices 2012Alfresco Security Best Practices 2012
Alfresco Security Best Practices 2012
 
Running PHP on nginx
Running PHP on nginxRunning PHP on nginx
Running PHP on nginx
 
Altitude San Francisco 2018: Testing with Fastly Workshop
Altitude San Francisco 2018: Testing with Fastly WorkshopAltitude San Francisco 2018: Testing with Fastly Workshop
Altitude San Francisco 2018: Testing with Fastly Workshop
 
SREConEurope15 - The evolution of the DHCP infrastructure at Facebook
SREConEurope15 - The evolution of the DHCP infrastructure at FacebookSREConEurope15 - The evolution of the DHCP infrastructure at Facebook
SREConEurope15 - The evolution of the DHCP infrastructure at Facebook
 

Andere mochten auch

Le protocole HTTP
Le protocole HTTPLe protocole HTTP
Le protocole HTTPSouhaib El
 
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASH
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASHTutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASH
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASHCyril Concolato
 
Introduction to HTTP protocol
Introduction to HTTP protocolIntroduction to HTTP protocol
Introduction to HTTP protocolAviran Mordo
 
HyperText Transfer Protocol (HTTP)
HyperText Transfer Protocol (HTTP)HyperText Transfer Protocol (HTTP)
HyperText Transfer Protocol (HTTP)Gurjot Singh
 
Cubb Presentation 2010
Cubb Presentation 2010Cubb Presentation 2010
Cubb Presentation 2010Pascal Cübb
 
Mansion Ingles
Mansion InglesMansion Ingles
Mansion Inglesancris03
 
1r0 "C" diseño grafico
1r0 "C" diseño grafico1r0 "C" diseño grafico
1r0 "C" diseño graficodannygussepe
 
Bienvenue croquis 2
Bienvenue croquis 2Bienvenue croquis 2
Bienvenue croquis 2Kclassroom
 
Gira de somonte por catalunya
Gira de somonte por catalunyaGira de somonte por catalunya
Gira de somonte por catalunyamalcazar
 
Simplemente Venus by Rubido9
Simplemente Venus by Rubido9Simplemente Venus by Rubido9
Simplemente Venus by Rubido9MoonShadow13
 
Miguel Orense Search Congress Bcn
Miguel Orense Search Congress BcnMiguel Orense Search Congress Bcn
Miguel Orense Search Congress Bcnsearch congress
 
This Is Beautiful
This Is BeautifulThis Is Beautiful
This Is Beautifulcattaneo17
 
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un entrep...
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un  entrep...Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un  entrep...
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un entrep...Alexandre Faure
 
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominative
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominativeDécret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominative
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominativeNathalie SALLES
 

Andere mochten auch (20)

Le protocole HTTP
Le protocole HTTPLe protocole HTTP
Le protocole HTTP
 
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASH
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASHTutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASH
Tutoriel sur le streaming vidéo sur HTTP et sur MPEG-DASH
 
Http Vs Https .
Http Vs Https . Http Vs Https .
Http Vs Https .
 
Introduction to HTTP protocol
Introduction to HTTP protocolIntroduction to HTTP protocol
Introduction to HTTP protocol
 
HyperText Transfer Protocol (HTTP)
HyperText Transfer Protocol (HTTP)HyperText Transfer Protocol (HTTP)
HyperText Transfer Protocol (HTTP)
 
Cubb Presentation 2010
Cubb Presentation 2010Cubb Presentation 2010
Cubb Presentation 2010
 
Ppt Para Blog
Ppt Para BlogPpt Para Blog
Ppt Para Blog
 
Mansion Ingles
Mansion InglesMansion Ingles
Mansion Ingles
 
Midan su Inteligencia
Midan su InteligenciaMidan su Inteligencia
Midan su Inteligencia
 
1r0 "C" diseño grafico
1r0 "C" diseño grafico1r0 "C" diseño grafico
1r0 "C" diseño grafico
 
Bienvenue croquis 2
Bienvenue croquis 2Bienvenue croquis 2
Bienvenue croquis 2
 
Gira de somonte por catalunya
Gira de somonte por catalunyaGira de somonte por catalunya
Gira de somonte por catalunya
 
Simplemente Venus by Rubido9
Simplemente Venus by Rubido9Simplemente Venus by Rubido9
Simplemente Venus by Rubido9
 
El blog como recurso educativo
El blog como recurso educativoEl blog como recurso educativo
El blog como recurso educativo
 
Miguel Orense Search Congress Bcn
Miguel Orense Search Congress BcnMiguel Orense Search Congress Bcn
Miguel Orense Search Congress Bcn
 
This Is Beautiful
This Is BeautifulThis Is Beautiful
This Is Beautiful
 
Día de la Paz 2009
Día de la Paz 2009Día de la Paz 2009
Día de la Paz 2009
 
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un entrep...
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un  entrep...Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un  entrep...
Intégrer et enrichir des notices Dublin Core dans Aleph à partir d’un entrep...
 
Campus Itaca
Campus ItacaCampus Itaca
Campus Itaca
 
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominative
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominativeDécret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominative
Décret n° 2013-266 du 28 mars 2013 relatif à la déclaration sociale nominative
 

Ähnlich wie Devoxx Maroc 2015 HTTP 1, HTTP 2 and folks

Http capturing
Http capturingHttp capturing
Http capturingEric Ahn
 
Composing re-useable ETL on Hadoop
Composing re-useable ETL on HadoopComposing re-useable ETL on Hadoop
Composing re-useable ETL on HadoopPaul Lam
 
Revisiting HTTP/2
Revisiting HTTP/2Revisiting HTTP/2
Revisiting HTTP/2Fastly
 
Websockets at tossug
Websockets at tossugWebsockets at tossug
Websockets at tossugclkao
 
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...Chris Fregly
 
Performance #4 network
Performance #4  networkPerformance #4  network
Performance #4 networkVitali Pekelis
 
Android Performance #4: Network
Android Performance #4: NetworkAndroid Performance #4: Network
Android Performance #4: NetworkYonatan Levin
 
Interactive web. O rly?
Interactive web. O rly?Interactive web. O rly?
Interactive web. O rly?timbc
 
Making the Most of HTTP In Your Apps
Making the Most of HTTP In Your AppsMaking the Most of HTTP In Your Apps
Making the Most of HTTP In Your AppsBen Ramsey
 
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...Chris Fregly
 
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...Chris Fregly
 
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and AveOWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and AveCheckmarx
 
Computer network (10)
Computer network (10)Computer network (10)
Computer network (10)NYversity
 
Use Xdebug to profile PHP
Use Xdebug to profile PHPUse Xdebug to profile PHP
Use Xdebug to profile PHPSeravo
 
Profiling PHP with Xdebug / Webgrind
Profiling PHP with Xdebug / WebgrindProfiling PHP with Xdebug / Webgrind
Profiling PHP with Xdebug / WebgrindSam Keen
 
Apache web server installation/configuration, Virtual Hosting
Apache web server installation/configuration, Virtual HostingApache web server installation/configuration, Virtual Hosting
Apache web server installation/configuration, Virtual Hostingwebhostingguy
 
Caching and tuning fun for high scalability
Caching and tuning fun for high scalabilityCaching and tuning fun for high scalability
Caching and tuning fun for high scalabilityWim Godden
 
HTTP2 and gRPC
HTTP2 and gRPCHTTP2 and gRPC
HTTP2 and gRPCGuo Jing
 

Ähnlich wie Devoxx Maroc 2015 HTTP 1, HTTP 2 and folks (20)

Http capturing
Http capturingHttp capturing
Http capturing
 
Composing re-useable ETL on Hadoop
Composing re-useable ETL on HadoopComposing re-useable ETL on Hadoop
Composing re-useable ETL on Hadoop
 
Revisiting HTTP/2
Revisiting HTTP/2Revisiting HTTP/2
Revisiting HTTP/2
 
Websockets at tossug
Websockets at tossugWebsockets at tossug
Websockets at tossug
 
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...
High Performance TensorFlow in Production - Big Data Spain - Madrid - Nov 15 ...
 
Performance #4 network
Performance #4  networkPerformance #4  network
Performance #4 network
 
Android Performance #4: Network
Android Performance #4: NetworkAndroid Performance #4: Network
Android Performance #4: Network
 
Interactive web. O rly?
Interactive web. O rly?Interactive web. O rly?
Interactive web. O rly?
 
Load testing with Blitz
Load testing with BlitzLoad testing with Blitz
Load testing with Blitz
 
Making the Most of HTTP In Your Apps
Making the Most of HTTP In Your AppsMaking the Most of HTTP In Your Apps
Making the Most of HTTP In Your Apps
 
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...
Building Google's ML Engine from Scratch on AWS with GPUs, Kubernetes, Istio,...
 
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...
PipelineAI + TensorFlow AI + Spark ML + Kuberenetes + Istio + AWS SageMaker +...
 
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and AveOWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
OWASP Top 10 - Checkmarx Presentation at Polytechnic Institute of Cávado and Ave
 
Computer network (10)
Computer network (10)Computer network (10)
Computer network (10)
 
Use Xdebug to profile PHP
Use Xdebug to profile PHPUse Xdebug to profile PHP
Use Xdebug to profile PHP
 
Profiling PHP with Xdebug / Webgrind
Profiling PHP with Xdebug / WebgrindProfiling PHP with Xdebug / Webgrind
Profiling PHP with Xdebug / Webgrind
 
Apache web server installation/configuration, Virtual Hosting
Apache web server installation/configuration, Virtual HostingApache web server installation/configuration, Virtual Hosting
Apache web server installation/configuration, Virtual Hosting
 
Caching and tuning fun for high scalability
Caching and tuning fun for high scalabilityCaching and tuning fun for high scalability
Caching and tuning fun for high scalability
 
RESTful design
RESTful designRESTful design
RESTful design
 
HTTP2 and gRPC
HTTP2 and gRPCHTTP2 and gRPC
HTTP2 and gRPC
 

Mehr von Nicolas Martignole

Recettes, services et API pour vos équipes et vos développeurs
Recettes, services et API pour vos équipes et vos développeursRecettes, services et API pour vos équipes et vos développeurs
Recettes, services et API pour vos équipes et vos développeursNicolas Martignole
 
Le Personal Branding pour les Développeurs (mais pas que...)
Le Personal Branding pour les Développeurs (mais pas que...)Le Personal Branding pour les Développeurs (mais pas que...)
Le Personal Branding pour les Développeurs (mais pas que...)Nicolas Martignole
 
Play2 ou l'architecture web réactive
Play2 ou l'architecture web réactivePlay2 ou l'architecture web réactive
Play2 ou l'architecture web réactiveNicolas Martignole
 
Play! framework : Soft-Shake presentation
Play! framework : Soft-Shake presentationPlay! framework : Soft-Shake presentation
Play! framework : Soft-Shake presentationNicolas Martignole
 
Usi2010 presentation nmartignole slideshare
Usi2010 presentation nmartignole slideshareUsi2010 presentation nmartignole slideshare
Usi2010 presentation nmartignole slideshareNicolas Martignole
 

Mehr von Nicolas Martignole (7)

Recettes, services et API pour vos équipes et vos développeurs
Recettes, services et API pour vos équipes et vos développeursRecettes, services et API pour vos équipes et vos développeurs
Recettes, services et API pour vos équipes et vos développeurs
 
Le Personal Branding pour les Développeurs (mais pas que...)
Le Personal Branding pour les Développeurs (mais pas que...)Le Personal Branding pour les Développeurs (mais pas que...)
Le Personal Branding pour les Développeurs (mais pas que...)
 
Voyager avec play scala
Voyager avec play scalaVoyager avec play scala
Voyager avec play scala
 
Play2 ou l'architecture web réactive
Play2 ou l'architecture web réactivePlay2 ou l'architecture web réactive
Play2 ou l'architecture web réactive
 
Play! framework : Soft-Shake presentation
Play! framework : Soft-Shake presentationPlay! framework : Soft-Shake presentation
Play! framework : Soft-Shake presentation
 
Recettes d'une passion
Recettes d'une passionRecettes d'une passion
Recettes d'une passion
 
Usi2010 presentation nmartignole slideshare
Usi2010 presentation nmartignole slideshareUsi2010 presentation nmartignole slideshare
Usi2010 presentation nmartignole slideshare
 

Kürzlich hochgeladen

LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfLESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfmchristianalwyn
 
Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Shubham Pant
 
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdfIntroduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdfShreedeep Rayamajhi
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteMavein
 
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsVision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsRoxana Stingu
 
Presentation2.pptx - JoyPress Wordpress
Presentation2.pptx -  JoyPress WordpressPresentation2.pptx -  JoyPress Wordpress
Presentation2.pptx - JoyPress Wordpressssuser166378
 
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSTYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSedrianrheine
 
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024Jan Löffler
 
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSLESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSlesteraporado16
 
Zero-day Vulnerabilities
Zero-day VulnerabilitiesZero-day Vulnerabilities
Zero-day Vulnerabilitiesalihassaah1994
 
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...APNIC
 
Bio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxBio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxnaveenithkrishnan
 

Kürzlich hochgeladen (12)

LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfLESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
 
Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024
 
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdfIntroduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a Website
 
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsVision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
 
Presentation2.pptx - JoyPress Wordpress
Presentation2.pptx -  JoyPress WordpressPresentation2.pptx -  JoyPress Wordpress
Presentation2.pptx - JoyPress Wordpress
 
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSTYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
 
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
 
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSLESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
 
Zero-day Vulnerabilities
Zero-day VulnerabilitiesZero-day Vulnerabilities
Zero-day Vulnerabilities
 
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
 
Bio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxBio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptx
 

Devoxx Maroc 2015 HTTP 1, HTTP 2 and folks

  • 1. HTTP et Architectures Orientées Web Nicolas Martignole CTO CaptainDash @nmartignole Devoxx Maroc 2015 Quentin Adam CEO CleverCloud @waxze Une histoire d’HTTP, des effets spéciaux, des bonnes pratiques d’un design d’API REST, et en terminant par HTTP/2
  • 2. Exclusivité mondiale de cette présentation… Devoxx Maroc 2015
  • 3. Exclusivité mondiale de cette présentation… … jamais présentée dans aucunes conférences … jamais répétée Devoxx Maroc 2015
  • 4. Who am I ? Quentin ADAM from the Clever Cloud @waxzce on twitter – github- soundcloud – instagram ….
  • 5. My day to day work : 
 Clever Cloud, make your app run all the time
  • 6. Keep your apps online. made with node.js, scala, java, ruby, php, python, go…
  • 7. And learn a lot of things about your code, apps, and good/bad design…
  • 8. Nic
  • 9. Who am I ? Nicolas Martignole, CTO Captain Dash Devoxx France - @nmartignole
  • 11. D E V O X X F R A N C E C O N F É R E N C E P O U R D É V E L O P P E U R S 2 0 A U 2 2 A V R I L 2 0 1 6
  • 12. Ce que vous allez découvrir, apprendre, revoir, comprendre
  • 13. HTTP
  • 16. HTTP1 est un protocole texte
  • 19. Une requête simple GET / HTTP/1.1 Host: cfp.devoxx.fr
  • 20. Une requête peut comporter 2 parties POST /cfp/profile HTTP/1.1 Host: cfp.devoxx.fr Connection: keep-alive Content-Length: 568 Cache-Control: max-age=0 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8 Origin: http://cfp.devoxx.fr User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36 Content-Type: application/x-www-form-urlencoded Referer: http://cfp.devoxx.fr/cfp/profile Accept-Encoding: gzip,deflate,sdch Accept-Language: fr,fr-FR;q=0.8,en;q=0.6,en-US;q=0.4 Cookie: ... email=nicolas%40touilleur-express.fr&avatarUrl=http%3A%2F%2Fwww.gravatar.com%2Favatar %2F09b788738dcb5d36dbd782db5ad66304&company=Le+Touilleur+Express&bio=Nicolas+est+un+d %C3%A9veloppeur+ind%C3%A9pendant%2C+vivant+%C3%A0+Paris.+%0D%0A%0D%0AIl+est+co-fondateur+et +organisateur+de+la+conf%C3%A9rence+Devoxx+France.%0D%0AIl+blog+depuis+plusieurs+ann%C3%A9es+sur +le+blog+%22Le+Touilleur+Express%22+http%3A%2F%2Fwww.touilleur-express.fr%2C+qui+compte+plus+de +800+articles.%0D%0A%0D%0A&twitter=%40nmartignole&blog=http%3A%2F%2Fwww.touilleur- express.fr&name=Nicolas+Martignole
  • 22. Des verbes • GET • HEAD • POST • PUT • DELETE • OPTIONS • TRACE • CONNECT RFC 2616
  • 23. Safe-Method • GET • HEAD RFC 2616 • POST • OPTIONS • PUT • DELETE • TRACE • CONNECT No server-side effect Just retrieve a resource
  • 24. Idempotent • GET • HEAD • PUT • DELETE RFC 2616 • POST • OPTIONS • TRACE • CONNECT GET /images/cat.png HTTP/1.1 Host: www.cats.org DELETE /jobs/job/234 HTTP/1.1 Host: www.monsters.com
  • 25. Verbes • GET • POST • HEAD • OPTIONS • DELETE • PUT • TRACE • CONNECT
  • 26. Exemple POST POST /cfp/profile/saveProfile HTTP/1.1 Authorization: Basic xxxx Host: cfp.devoxx.fr Content-Length: 25 Content-Type: application/x-www-form-urlencoded email=nicolas%40devoxx.fr
  • 27. Exemple PUT PUT /cfp/profile/nicolas HTTP/1.1 Authorization: Basic xxxx Host: cfp.devoxx.fr Content-Length: 55 Accept: application/json { "id":212340, "email": "nicolas@devoxx.fr" } POST : URI est la ressource qui accepte les données PUT : entité qui doit être modifié
  • 29. Response HTTP/1.1 201 Created Date: Mon, 09 Dec 2013 11:22:00 GMT Content-Length: 1200 Location: http://cfp.devoxx.fr/profiles/profile/nicolas
  • 30. Status code • 2xx : OK • 3xx : Not here • 4xx : Client screwed up • 5xx : Server screwed up
  • 31. Status code 201 Created 202 Accepted 206 Partial Content 301 Moved permanently 303 See Other 304 Not Modified 400 Bad Request 401 Unauthorized 404 Not Found 406 Not Acceptable 409 Conflict 412 Precondition Failed 417 Expectation Failed
  • 34. Techniques simples de gestion du Cache
  • 38. Expires GET /profile/nicolas HTTP/1.0 Host: cfp.devoxx.fr HTTP/1.0 200 Ok Expires: Mon, 29 Feb 2014 10:00:00 GMT Content-Length: 1200 Content-Type: application/json {"profile":22334}
  • 39. Cache-Control HTTP/1.1 200 Ok Cache-Control: max-age=120 Content-Length: 1200 Content-Type: application/json {"profile":22334}
  • 40. Cache-Control HTTP/1.1 200 Ok Cache-Control: public, max-age=120, s-maxage=120 Content-Length: 1200 Content-Type: application/json {"profile":22334} Can be cached by a Proxy Cache-Control = "Cache-Control" ":" 1#cache-directive cache-directive = cache-request-directive | cache-response-directive cache-request-directive = "no-cache" ; Section 14.9.1 | "no-store" ; Section 14.9.2 | "max-age" "=" delta-seconds ; Section 14.9.3, 14.9.4 | "max-stale" [ "=" delta-seconds ] ; Section 14.9.3 | "min-fresh" "=" delta-seconds ; Section 14.9.3 | "no-transform" ; Section 14.9.5 | "only-if-cached" ; Section 14.9.4 | cache-extension ; Section 14.9.6 cache-response-directive = "public" ; Section 14.9.1 | "private" [ "=" <"> 1#field-name <"> ] ; Section 14.9.1 | "no-cache" [ "=" <"> 1#field-name <"> ]; Section 14.9.1 | "no-store" ; Section 14.9.2 | "no-transform" ; Section 14.9.5 | "must-revalidate" ; Section 14.9.4 | "proxy-revalidate" ; Section 14.9.4 | "max-age" "=" delta-seconds ; Section 14.9.3 | "s-maxage" "=" delta-seconds ; Section 14.9.3 | cache-extension ; Section 14.9.6
  • 41. La mise en cache • Consultez http://www.mnot.net/cache_docs/
  • 42. ETag
  • 43. Exemple simple ETag HTTP/1.1 200 Ok Age: 0 Content-Encoding: gzip Content-Type: text/html; charset=utf-8 Date: Wed, 08 Jan 2014 12:25:10 GMT ETag: 1s76wo-1503 Connection: keep-alive <! DOCTYPE html> <html>….. </html> GET /from-paris/quality HTTP/1.1 Host: cfp.devoxx.fr
  • 44. Exemple simple ETag : je reviens te voir GET /from-paris/quality HTTP/1.1 Host: cfp.devoxx.fr If-None-Match: 1s76wo-1503
  • 45. Exemple simple : la page n’a pas changé HTTP/1.1 304 Not Modified Accept-Ranges: bytes Age: 0 Content-length: 0 Date: Wed, 08 Jan 2014 12:29:17 GMT Connection: keep-alive GET /from-paris/quality HTTP/1.1 Host: cfp.devoxx.fr If-None-Match: 1s76wo-1503
  • 46. Exemple avec Devoxx France • Afficher une page programme de conférence • Liste des conférences • Pour chaque conférence, le nom et la bio du présentateur
  • 47. ETag • Charge la liste des conférences, et pour chaque conférence, les détails des présentateurs. Requête Liste des Conférences 1. charge les conférences 2. charge les speakers 3. retourne la réponse 53 KB - 140ms GET /conferences HTTP/1.1 Host: cfp.devoxx.fr
  • 48. ETag • La page liste des conférences est coûteuse à calculer 2kB - 30ms 49KB- 110ms Liste des Conférences 1. charge les conférences 2. charge les speakers 3. retourne la réponse «La liste des conférences détermine la liste des speakers»
  • 49. ETag • Opérations et transferts inutiles Requête Réponse 51 KB - 140ms Liste des Conférences 1. charge les conférences 2. charge les speakers 3. retourne la réponse
  • 50. ETag : comment optimiser et améliorer les performances
  • 51. ETag • Si pas de ETag (première visite) Requête Liste des Conférences 1. charge la liste des conférences 2. charge les speakers 3. retourne la réponse avec ETag calculé sur la liste des conférences Réponse HTTP/1.1 200 Ok ... ETag: safik20-demo123 ...
  • 52. ETag • 2ème visite, présente l’entête If-None-Match Requête Liste des Conférences 1. charge les conférences 2. calcule ETag 3. si ETag est identique à celui présenté dans If- None-Match alors retourne 304 Not Modified Réponse HTTP/1.1 304 Not Modified ETag: safik20-demo123 Content-Length: 0 GET /conferences HTTP/1.1 Host: cfp.devoxx.fr If-None-Match: safik20-demo123 2 KB - 15ms Ne charge pas la liste des speakers !
  • 53. ETag (et si la liste des conférences est modifié ?) • 2ème visite, présente l’entête If-None-Match Requête Liste des Conférences 1. charge les conférences 2. calcule ETag 3. si ETag est différent à celui présenté dans If- None-Match alors 3.a) charge speakers 3.b) retourne résultat avec nouvel ETag Réponse HTTP/1.1 200 Ok ETag: ttg234-hgd789 Cache-Control: no-cache Content-Length: 1429 Content-Type: text/html GET /conferences HTTP/1.1 Host: cfp.devoxx.fr If-None-Match: safik20-demo123 53 KB - 140ms
  • 54. ETag • Résumé Liste des Conférences 1. charge les conférences 2. calcule ETag sur la liste des conférences 3. compare ce ETag avec If-None-Match si présent 4.a - si identique, retourne 304 Not Modified 4.b - si différent, charge les speakers, puis retourne 200 Ok + ETag 4.c - si pas de If-None-Match dans la requête alors retourne 200 Ok + ETag
  • 55. Bénéfices • Eviter des appels coûteux ou lents • Economie de ressources • Améliore les temps de réponse • Simple
  • 56. ETag - Avancé • Permet d’effacer un élément précis Requête Liste des Conférences Réponse HTTP/1.1 428 Precondition Required Date: Wed, 14 Sep 2013 14:01:00 DELETE /conf/proposal/02 HTTP/1.1 Host: cfp.devoxx.fr
  • 57. ETag - Avancé • Permet d’effacer un élément précis Requête Liste des Conférences Réponse HTTP/1.1 204 No Content Date: Wed, 14 Sep 2013 14:01:00 DELETE /conf/proposal/02 HTTP/1.1 Host: cfp.devoxx.fr If-Match: 120sg-demo123
  • 58. ETag - Avancé • Permet d’effacer un élément précis Requête Liste des Conférences Réponse HTTP/1.1 404 Not Found Date: Wed, 14 Sep 2013 14:01:00 DELETE /conf/proposal/02 HTTP/1.1 Host: cfp.devoxx.fr If-Match: 120sg-demo123
  • 61. Requête GET /cfp/speaker/nicolas HTTP/1.1 Host: cfp.devoxx.fr Authorization: Basic xxxx
  • 62. Réponse HTTP/1.1 200 OK Date: Sun, 17 Nov 2013 18:00:23 Content-Type: application/json { "id": 2345, "name": "Nicolas Martignole", "photo": "http://s3.amazonaws.com/b/t22/hh.png" }
  • 63. Réponse - 2 HTTP/1.1 200 OK Date: Sun, 17 Nov 2013 18:00:23 Content-Type: text/xml <speaker id="2345"> <name>Nicolas Martignole</name> <photo src="http://s3.amazonaws.com/b/t22/hh.png"/> </speaker>
  • 65. Requête GET /cfp/speaker/nicolas.json HTTP/1.1 Host: cfp.devoxx.fr GET /cfp/speaker/nicolas.xml HTTP/1.1 Host: cfp.devoxx.fr ?
  • 67. Requête - solution 1 GET /cfp/speaker/nicolas?format=json HTTP/1.1 Host: cfp.devoxx.fr GET /cfp/speaker/nicolas?format=xml HTTP/1.1 Host: cfp.devoxx.fr
  • 68. Requête - solution 2 GET /cfp/speaker/nicolas HTTP/1.1 Host: cfp.devoxx.fr Accept: application/json GET /cfp/speaker/nicolas HTTP/1.1 Host: cfp.devoxx.fr Accept: application/xml
  • 69. Requête - encore plus mieux meilleur bien GET /cfp/speaker/nicolas HTTP/1.1 Host: cfp.devoxx.fr Accept: application/json, application/xml
  • 70. Requête - quality GET /cfp/speaker/nicolas HTTP/1.1 Host: cfp.devoxx.fr Accept: application/json, application/xml;q=0.5
  • 71. Accept header GET /HTTP/1.1 Host: cfp.devoxx.fr Accept: text/html,application/xhtml+xml,application/ xml;q=0.9,*/*;q=0.8
  • 72. Accept (cont.) GET /HTTP/1.1 Host: cfp.devoxx.fr Accept: text/html,application/xhtml+xml,application/ xml;q=0.9,*/*;q=0.8 Accept-Encoding: gzip Accept-Language: fr,fr-FR;q=0.8,en;q=0.6,en-US;q=0.4 "Je
  • 74.  un
  • 77.  qui
  • 79.  le
  • 81.   et
  • 82.  qui
  • 84.  la
  • 86. Bénéfices • Gestion de la langue sur un site • Peut-on compresser ou non ? • Quel format préfères-tu ?
  • 87. Gestion de la version d’une API type REST Unerecettedesmeilleurs cuisiniersenAPIWeb
  • 88. Gestion de la version d’une API REST GET /cfp/speakers HTTP/1.1 Host: cfp.devoxx.fr C’est la version 1
  • 89. Gestion de la version d’une API REST GET /v1/cfp/speakers HTTP/1.1 Host: cfp.devoxx.fr ?
  • 90. Gestion de la version d’une API REST GET /v1.45.11-update-34/cfp/speakers HTTP/1.1 Host: cfp.devoxx.fr ?
  • 91. Gestion de la version d’une API REST GET /cfp/speakers HTTP/1.1 Host: cfp.devoxx.fr Accept: application/vnd.devoxxfr-v1.json Une solution
  • 93. Une API Web • un namespace/un domaine • un ensemble de ressources • des paramètres
  • 94. Le plus gros soucis souvent rencontré • Construire une API Web est loin d’être simple • Le couplage afférent entre le client et le serveur est le souci numéro 1 GET /posts/createNew POST /myapp/doSomething/index.jsf
  • 95. Exemples • Hypermedia API : une API Web avec l’expérience d’un site Web • Pas de connaissances contractuelles entre le client et le serveur à priori • Exemples : https://api.github.com/
  • 96. Exemple sur l’API REST du CFP de Devoxx Maroc • Utiliser Postman sur Chrome • cfp.devoxx.ma/api
  • 97. https://api.github.com/ { current_user_url: https://api.github.com/user, authorizations_url: https://api.github.com/authorizations, code_search_url: https://api.github.com/search/code?q={query}{page,per_page,sort,order}, emails_url: https://api.github.com/user/emails, emojis_url: https://api.github.com/emojis, events_url: https://api.github.com/events, feeds_url: https://api.github.com/feeds, following_url: https://api.github.com/user/following{/target}, gists_url: https://api.github.com/gists{/gist_id}, hub_url: https://api.github.com/hub, issue_search_url: https://api.github.com/search/issues?q={query}{page,per_page,sort,order}, issues_url: https://api.github.com/issues, keys_url: https://api.github.com/user/keys, notifications_url: https://api.github.com/notifications, organization_repositories_url: https://api.github.com/orgs/{org}/repos/{?type,page,per_page,sort}, organization_url: https://api.github.com/orgs/{org}, public_gists_url: https://api.github.com/gists/public, rate_limit_url: https://api.github.com/rate_limit, repository_url: https://api.github.com/repos/{owner}/{repo}, repository_search_url: https://api.github.com/search/repositories?q={query}{page,per_page,sort,order}, current_user_repositories_url: https://api.github.com/user/repos{?type,page,per_page,sort}, starred_url: https://api.github.com/user/starred{/owner}{/repo}, starred_gists_url: https://api.github.com/gists/starred, team_url: https://api.github.com/teams, user_url: https://api.github.com/users/{user}, user_organizations_url: https://api.github.com/user/orgs, user_repositories_url: https://api.github.com/users/{user}/repos{?type,page,per_page,sort}, user_search_url: https://api.github.com/search/users?q={query}{page,per_page,sort,order} }
  • 98. https://api.github.com/users/nicmarti { login: nicmarti, id: 157075, avatar_url: https://gravatar.com/avatar/09b788738dcb5d36dbd782db5ad66304?d=https%3A%2F%2Fidenticons.github.com %2Ff406ed0654d6234aa9eb283c4e5b02f2.pngr=x, gravatar_id: 09b788738dcb5d36dbd782db5ad66304, url: https://api.github.com/users/nicmarti, html_url: https://github.com/nicmarti, followers_url: https://api.github.com/users/nicmarti/followers, following_url: https://api.github.com/users/nicmarti/following{/other_user}, gists_url: https://api.github.com/users/nicmarti/gists{/gist_id}, starred_url: https://api.github.com/users/nicmarti/starred{/owner}{/repo}, subscriptions_url: https://api.github.com/users/nicmarti/subscriptions, organizations_url: https://api.github.com/users/nicmarti/orgs, repos_url: https://api.github.com/users/nicmarti/repos, events_url: https://api.github.com/users/nicmarti/events{/privacy}, received_events_url: https://api.github.com/users/nicmarti/received_events, type: User, site_admin: false, name: Nicolas Martignole, company: Le Touilleur Express, blog: http://www.touilleur-express.fr, location: Paris, France, email: nicolas@touilleur-express.fr, hireable: true, bio: Nicolas is a freelancer, based in Paris France.rnHe is first a Web developer, someone that is able to build a Web application with Java, Scala or Groovy like its job board www.express-board.fr. rnrnHe's the co-funder of Devoxx France, a conference for developers in Paris, in April 2012. He is also a member of the Paris JUG.rnrnYou can read his blog Le Touilleur Express http://www.touilleur-express.fr and follow-him on Twitter @nmartignole, public_repos: 21, public_gists: 16, followers: 94, following: 3,
  • 99. https://api.github.com/users/nicmarti { login: nicmarti, id: 157075, avatar_url: https://gravatar.com/avatar/09b788738dcb5d36dbd782db5ad66304?d=https%3A%2F%2Fidenticons.github.com %2Ff406ed0654d6234aa9eb283c4e5b02f2.pngr=x, gravatar_id: 09b788738dcb5d36dbd782db5ad66304, url: https://api.github.com/users/nicmarti, html_url: https://github.com/nicmarti, followers_url: https://api.github.com/users/nicmarti/followers, following_url: https://api.github.com/users/nicmarti/following{/other_user}, gists_url: https://api.github.com/users/nicmarti/gists{/gist_id}, starred_url: https://api.github.com/users/nicmarti/starred{/owner}{/repo}, subscriptions_url: https://api.github.com/users/nicmarti/subscriptions, organizations_url: https://api.github.com/users/nicmarti/orgs, repos_url: https://api.github.com/users/nicmarti/repos, events_url: https://api.github.com/users/nicmarti/events{/privacy}, received_events_url: https://api.github.com/users/nicmarti/received_events, type: User, site_admin: false, name: Nicolas Martignole, company: Le Touilleur Express, blog: http://www.touilleur-express.fr, location: Paris, France, email: nicolas@touilleur-express.fr, hireable: true, bio: Nicolas is a freelancer, based in Paris France.rnHe is first a Web developer, someone that is able to build a Web application with Java, Scala or Groovy like its job board www.express-board.fr. rnrnHe's the co-funder of Devoxx France, a conference for developers in Paris, in April 2012. He is also a member of the Paris JUG.rnrnYou can read his blog Le Touilleur Express http://www.touilleur-express.fr and follow-him on Twitter @nmartignole, public_repos: 21, public_gists: 16, followers: 94, following: 3, created_at: 2009-11-23T15:09:57Z, updated_at: 2014-01-05T16:58:14Z }
  • 100. HATEOAS • Hypermedia as the engine of application state • chaque ressource décrit ses possibilités et ses relations Ticket «Nouveau» - soumettre - effacer Ticket «Envoyé» - annuler envoi - effacer Ticket «Effacé»
  • 101. HATEOAS • Relations entre les ressources root id q0 /id link rel = q1 uri = ... / link rel = q2 uri = ... / /root root id q1 /id link rel = q0 uri = ... / link rel = q3 uri = ... / /root
  • 102. HATEOAS • Description des fonctionnalités ticket: { assigned_to: nicolas, links: [ {rel: “unassign”, url: “...”}, {rel: “close”, url: “...”} ] }
  • 103. Modèle de maturité de Leonard Richardson • Comprendre les pratiques d’architecture pour construire une API WEB REST «pure»
  • 104. Niveau 0 de l’API Web • SOAP, WebServices, les machins des années 2000 Voir http://martinfowler.com/articles/richardsonMaturityModel.html
  • 105. Niveau 0 de l’API Web Voir http://martinfowler.com/articles/richardsonMaturityModel.html POST /appointmentService HTTP/1.1 [various other headers] openSlotRequest date = 2010-01-04 doctor = mjones/ HTTP/1.1 200 OK [various headers] openSlotList slot start = 1400 end = 1450 doctor id = mjones/ /slot /openSlotList POST /appointmentService HTTP/1.1 [various other headers] appointmentRequest slot doctor = mjones start = 1400 end = 1450/ patient id = nmartignole/ /appointmentRequest HTTP/1.1 200 OK [various headers] appointment slot doctor = mjones start = 1400 end = 1450/ patient id = nmartignole/ /appointment HTTP/1.1 200 OK [various headers] appointmentRequestFailure slot doctor = mjones start = 1400 end = 1450/ patient id = nmartignole/ reasonSlot not available/reason /appointmentRequestFailure
  • 106. Niveau 1 - utilisation des Ressources • Requêtes à différentes ressources
  • 107. Niveau 1 - utilisation des Ressources POST /doctors/mjones HTTP/1.1 [various other headers] openSlotRequest date = 2010-01-04/ HTTP/1.1 200 OK [various headers] openSlotList slot id = 1234 doctor = mjones start = 1400 end = 1450/ slot id = 5678 doctor = mjones start = 1600 end = 1650/ /openSlotList POST /slots/1234 HTTP/1.1 [various other headers] appointmentRequest patient id = jsmith/ /appointmentRequest HTTP/1.1 200 OK [various headers] appointment slot id = 1234 doctor = mjones start = 1400 end = 1450/ patient id = jsmith/ /appointment
  • 108. Niveau 2 - utilisation des Ressources et des Verbes • Requêtes à différentes ressources en utilisant les verbes HTTP. Les codes de retour HTTP sont utilisés pour indiquer le succès des requêtes.
  • 109. Niveau 2 - utilisation des Ressources et des Verbes GET /doctors/mjones/slots?date=20100104status=open HTTP/1.1 Host: royalhope.nhs.uk HTTP/1.1 200 OK [various headers] openSlotList slot id = 1234 doctor = mjones start = 1400 end = 1450/ slot id = 5678 doctor = mjones start = 1600 end = 1650/ /openSlotList POST /slots/1234 HTTP/1.1 [various other headers] appointmentRequest patient id = jsmith/ /appointmentRequest HTTP/1.1 201 Created Location: slots/1234/appointment [various headers] appointment slot id = 1234 doctor = mjones start = 1400 end = 1450/ patient id = jsmith/ /appointment HTTP/1.1 409 Conflict [various headers] openSlotList slot id = 5678 doctor = mjones start = 1600 end = 1650/ /openSlotList
  • 110. Niveau 3 - Ressource/Verbes et HATEOAS • Chaque ressource décrit les références et les liens avec d’autres ressources
  • 111. Niveau 3 - Ressource/Verbes et HATEOAS GET /doctors/mjones/slots?date=20100104status=open HTTP/1.1 Host: royalhope.nhs.uk HTTP/1.1 200 OK [various headers] openSlotList slot id = 1234 doctor = mjones start = 1400 end = 1450 link rel = /linkrels/slot/book uri = /slots/1234/ /slot /openSlotListPOST /slots/1234 HTTP/1.1 [various other headers] appointmentRequest patient id = jsmith/ /appointmentRequest HTTP/1.1 201 Created Location: http://royalhope.nhs.uk/slots/1234/appointment [various headers] appointment slot id = 1234 doctor = mjones start = 1400 end = 1450/ patient id = jsmith/ link rel = /linkrels/appointment/cancel uri = /slots/1234/appointment/ link rel = /linkrels/appointment/addTest uri = /slots/1234/appointment/tests/ link rel = self uri = /slots/1234/appointment/ link rel = /linkrels/appointment/changeTime uri = /doctors/mjones/slots?date=20100104@status=open/ link rel = /linkrels/appointment/updateContactInfo uri = /patients/jsmith/contactInfo/ link rel = /linkrels/help uri = /help/appointment/ /appointment ATOM (RFC 4287) Donne moi l’URI de linkrels/slot/book
  • 112. Pour résumer • Le niveau 3 est un pré-requis pour construire une API WEB type REST • Niveau 0 ne doit pas être utilisé • Niveau 1 permet d’identifier les différentes ressource de votre service • Niveau 2 encourage l’utilisation des verbes HTTP plutôt que de redéfinir des méthode • Niveau 3 introduit les notions de découverte et de relation entre les ressources. Le service devient auto-documenté
  • 120. The hacks we are doing everyday without thinking to improve performances
  • 121. Multiple domain names for multiples streams
  • 122. Static assets domain name for Fat cookies problem management
  • 124. So, we need a new version of http
  • 125. Who is in charge ?
  • 127. First http/2 draft is spdy/3 draft
  • 129. So what is in the box ?
  • 130. HTTP/2 is a binary protocol
  • 132. Binary protocol are safer, easer to parse, concise…
  • 134. What is wireshark ? Your app Wireshark System Network card
  • 135. Build only 1 tcp connection
  • 136. Put some steams in one connection
  • 137. Streams
 ~ 1 http/1 request = 1 http/2 stream
  • 138. Streams are built of frames
  • 139. frames Content a.html #1 Content dog.gif #1 Content a.html #2 Content dog.gif #2 Content a.html #4Content a.html #3 Content cat.gif #1 Content dog.gif #4 …
  • 140. Binary goodness = frames is easy
  • 142. Improve the browser waterfall with stream priority
  • 143. Push from the server a resource to the cache
  • 144. User xp will be better
  • 148. Focus on web performances
  • 153. HTTP/1 build in method Upgrade: header Code 101 Switching
  • 157. Encrypt the web :
 TLS
  • 158. Current negotiation: TLS version, cypher…
  • 159. Negotiate the protocol in the same time of encrypt negotiation
  • 161. Is it for real?
  • 162. Looks like ip v6 story?
  • 167. H2, h2-14 - Firefox - Chrome - cURL - IE (oh yeah) - … - Google - Twitter - Akamai - …. https://github.com/http2/http2-spec/wiki/Implementations
  • 170. All the goodness of http2 in your http1 app for nothing :-)
  • 171. Why it’s so cool?
  • 173. Remove all the shitty hacks
  • 176. Todo list • https://http2.github.io/ • Specs • Implementations • FAQ • News • Hack with node/h2o/Jetty • Install Wireshark on your laptop
  • 177. Thx for listening questions time