Upload
boblemarin-2000
View
510
Download
1
Tags:
Embed Size (px)
DESCRIPTION
Un introduction simple au format de données JSON, JSONP avec une approche très vague de comment on peut faire dans la vie quand on n'a pas facile, mais qu'il faut absolument que ça aille. Présentation faire à Namur le 11/03/2014 dans le cadre du Workshop DataViz-05 consacré à la visualisation de données, ce qui fait que justement on l'appelle dataviz, car c'est une sorte de patronyme qui parle aux initiés. Merci à la vie
Citation preview
JSONtoujours deux fois
Comment on dit ?
Djîçonne
J’y sonne
Djéy-sonne
Jay SON
Jason
Comment on dit ?
Djîçonne
J’y sonne
Djéy-sonne
Jay SON
Jason -> remember G.I. Joe
Comment on dit ?
Djîçonne
J’y sonne
Djéy-sonne
Jay SON
Jason -> remember G.I. Joe-> remember DJ(ay)
Bon
C’est quoi, sinon ?
le JSON, c’est quoi ?
JavaScript Objet Notation
C’est quoi ?
un format de données
basé sur la syntaxe du JavaScript
assez lisible pour l’humain
assez facile à écrire à la main (ou au pied)
Un fichier JSON
à quoi ça ressemble ?
Un fichier JSON
c’est beau
Un fichier JSON
et à l’intérieur ?
Un fichier JSON
et à l’intérieur ?
C’est beau aussi !
Mais d’abord, un peu d’histoire...
{}Ceci n’est pas un objet
{}C’est la représentation d’un objet
en JavaScript
{}C’est la représentation d’un objet
en JavaScript
et aussi la base de la notation JSON
Rappelons-nous...La syntaxe du JavaScript pour les données de base
Rappelons-nous...La syntaxe du JavaScript
pour créer un objet
Un objet, des propriétés.
Un objet, c’est un peu comme un étagedans une structure de donnée.
On peut y stocker des choses,qui deviennent ses propriétés.
Exemple concret
et ainsi de suite...
En imbriquant des structures, on arrive à créer un arbre de données
qui peut devenir complexe, mais reste toujours logique.
OK
OKet pour l’utiliser ?
facile !pour l’utiliser ?
JSON vs JSONP
Un fichier JSON “propre” :
JSON vs JSONP
Un fichier JSON “propre” :
Si je l’ajoute tel quel à ma page HTML,ça ne va pas aller...
JSON vs JSONPParce que :
- sécurité Cross-Domaine- syntax error
JSON vs JSONP
Donc :il faut un moyen de rendre le JSON utilisable
par les scripts de la page.
Parce que :
- sécurité Cross-Domaine- syntax error
JSONP = JSON with Padding
JSONP = JSON with Padding
Le padding, ce n’est pas le pudding
JSONP = JSON with Padding
Le padding, c’est un truc que le serveur rajoute autour des données
pour qu’on puisse les toucher.
JSONP = JSON with Padding
Le padding, ça peut être :
Assignation
JSONP = JSON with Padding
Le padding, ça peut être :
Assignation Appel de fonction
JSONP = JSON with Padding
Le padding, ça peut être :
En pratique
JSON : à charger avec un XMLHttpRequest
JSONP : à intégrer avec une balise <script>
Tu veux une démo ?
Les données de l’école
schoolData.jsque je dois encore vous transmettre
Bon, ça suffit !amusez-vous, maintenant.