Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WP JSON REST API
Search
Miguel Lezama
August 16, 2014
Programming
0
250
WP JSON REST API
WordCamp Montreal presentation
Miguel Lezama
August 16, 2014
Tweet
Share
Other Decks in Programming
See All in Programming
テストカバレッジ100%を10年続けて得られた学びと品質
mottyzzz
2
590
Rancher と Terraform
fufuhu
2
240
Navigating Dependency Injection with Metro
zacsweers
3
250
実用的なGOCACHEPROG実装をするために / golang.tokyo #40
mazrean
1
260
速いWebフレームワークを作る
yusukebe
5
1.7k
250830 IaCの選定~AWS SAMのLambdaをECSに乗り換えたときの備忘録~
east_takumi
0
390
アルテニア コンサル/ITエンジニア向け 採用ピッチ資料
altenir
0
100
Introducing ReActionView: A new ActionView-compatible ERB Engine @ Rails World 2025, Amsterdam
marcoroth
0
680
Azure SRE Agentで運用は楽になるのか?
kkamegawa
0
2.1k
知っているようで知らない"rails new"の世界 / The World of "rails new" You Think You Know but Don't
luccafort
PRO
1
110
AIコーディングAgentとの向き合い方
eycjur
0
270
AI時代のUIはどこへ行く?
yusukebe
18
8.8k
Featured
See All Featured
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Speed Design
sergeychernyshev
32
1.1k
The World Runs on Bad Software
bkeepers
PRO
70
11k
Building an army of robots
kneath
306
46k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Building Applications with DynamoDB
mza
96
6.6k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
How STYLIGHT went responsive
nonsquared
100
5.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
126
53k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
Transcript
JSON REST API
@pelequie lezama migueluy Jetpack Team Miguel Lezama Code Wrangler Montevideo,
Uruguay
Qu'est ce que c'est un API? API = Application Programming
Interface Indique la façon dont les applications doivent interagir les unes avec les autres.
Examples de APIs https://developers.google.com https://developers.facebook.com/ https://dev.twitter.com/ https://developer.github.com/v3/
WordPress APIs
Qu'est ce qu’on peut faire avec les APIs WordPress? Realiser
des operations CRUD sur un site WordPress
APIs WordPress XML-RPC API WP-API http://github.com/WP-API/WP-API (Core) WordPress.com + Jetpack
! ! http://github.com/WP-API/WP-API/blob/master/docs/comparison.md
WordPress.com JSON REST API +
JSON? REST?
Qu'est ce que c'est JSON? JavaScript Object Notation
JSON: JavaScript Object Notation Format des données ouvert. Facile pour
l'homme de lire et d'écrire. Facile pour les machines à parser et à générer. ! Alternative à le XML (Extensible Markup Language).
{! ! "ID":678,! ! "site_ID":1,! ! "author":{! ! ! "ID":1,!
! ! "email":
[email protected]
,! ! ! "name":"miguel",! ! },! ! "date":"2014-08-15T19:17:40+00:00",! ! "modified":"2014-08-15T19:18:02+00:00",! ! "title":"Bonjour Montreal!",! ! “URL":"http://miguellezama.com/?p=678",! ! "short_URL":"http://wp.me/p3oDRb-aW",! ! "content":"<p>Bonjour et bienvenue! WordCamp Montreal</p>\n"! }!
Qu'est ce que c'est REST? REpresentational State Transfer
REpresentational State Transfer Un style d'architecture adapté au Web. L’utilisation
d’URI comme représentant d’une ressource permet d'avoir un système universel d'identification des éléments de l'application.
Qu'est ce que c’est ? Plugin Suralimentez votre site auto-hébergé
avec la puissance de WordPress.com.
Qu'est ce que c’est ? ! ! Jetpack vous permettra
d’autoriser des applications à se connecter à votre blog pour utiliser votre contenu et vous offrir de nouvelles fonctionnalités.
Qui utilise l’API?
Comment utiliser l’API? https://developer.wordpress.com/docs/api/
Prérequis Installer
Connecter Jetpack J’authorise mon utilisateur WP.com à utiliser mon site
T’es sur? Oui, of course avec ce token on peut ce communiquer
None
PHP ! <?php! ! $response = file_get_contents(! ! ‘https://public- api.wordpress.com/rest/v1/sites/
miguellezama.com/posts/678'! );! ! $post = json_decode( $response );! ! echo "\n" . $post->title . "\n";! !
Javascript jQuery.get( ! ! “https://public- api.wordpress.com/rest/v1/ sites/miguellezama.com/posts/ 678", ! !
! function( response ) { ! ! ! console.log( response );! ! }! );!
None
None
None
None
None
None
Comment accéder aux endpoints oauth2o? Les endpoints on besoin d’autorisation.
Échanges OAuth2 Application je veux faire une App
None
None
None
Application Je vais utiliser ton application Joey! Échanges OAuth2
OAUTH2 https://public-api.wordpress.com/oauth2/authorize ! https://public-api.wordpress.com/oauth2/token
Je veut utiliser ton app Je veux donner accès a
Joey Merci, demande a WP.com Application Échanges OAuth2
https://public-api.wordpress.com/oauth2/authorize? client_id=client_id&redirect_uri=redirect_uri&response_type=code
T’es sur? Quel type d’accès tu veux donner? Je veut
utiliser ton app Merci, demande a WP.com Je veux donner accès a Joey Application Échanges OAuth2
None
Application Oui, s'il te plaît donne accès à miguellezama.com Miguel
veut te donner accès a son blog, Peux-tu confirmer que c’est bien toi? Échanges OAuth2
http://joeyapp.com/app/? code=cm8hl1xG5k
Application Bien sur c’est moi! Miguel veut te donner accès
a son blog, Peux-tu confirmer que c’est bien toi? Échanges OAuth2
$curl = curl_init( "https://public- api.wordpress.com/oauth2/token" );! curl_setopt( $curl, CURLOPT_POST, true
);! curl_setopt( $curl, CURLOPT_POSTFIELDSS, array(! 'client_id' => $client_id,! 'redirect_uri' => $redirect_uri,! 'client_secret' => sanitize_key( $_GET['code'] ), ! // the code we got from the authorization screen! 'grant_type' => 'authorization_code',! ) );! curl_setopt( $curl, CURLOPT_RETURNTRANSFER, 1 );! $auth = curl_exec( $curl );! Joey doit renvoyer ca pour avoir accès
D’accord… Application Échanges OAuth2 Bien sur c’est moi! Miguel veut
te donner accès a son blog, Peux-tu confirmer que c’est bien toi?
$secret = json_decode( $auth );! print_r( $secret );! {! 'access_token'
: **YOUR_API_TOKEN**! 'blog_id' : 1234! 'blog_url' : 'http://miguellezama.com'! 'token_type' : 'bearer',! }! Enfin Joey est autorisé!
Application En fin en est autorisé! je veux voir mon
post Joey je veux voir le post de Miguel Je suis autorise hmmm…ok donnez moi le post le post le post le post
$options = array(! 'http' =>! array(! 'ignore_errors' => true,! 'header'
=> array(! 'authorization: Bearer ' . **$access_token**,! ),! ! ! ! ' data' => array( content: 'Bonjour Montreal' }! ), );! $context = stream_context_create( $options );! $response = file_get_contents( ! ! 'https://public-api.wordpress.com/rest/v1/sites/ miguellezama.com/posts/new',! ! false, ! ! $context ! );! $reponse = json_decode( $response ); PHP
jQuery.ajax( {! url: 'https://public-api.wordpress.com/rest/v1/sites/ miguellezama.com/posts/new',! type: 'POST',! data: { content:
'Bonjour Montreal' },! beforeSend : function( xhr ) {! xhr.setRequestHeader( 'Authorization', 'BEARER ' + access_token );! },! success: function( response ) {! // response! }! } ); JS
http://developer.wordpress.com/docs/oauth2/
HTTPS tout!
WPCOM.JS Official JavaScript library for the WordPress.com REST API https://www.npmjs.org/package/wpcom
https://github.com/Automattic/wpcom.js https://wpcomjs.com
var WPCOM = require( 'wpcom' );! ! var wpcom =
WPCOM( '<mi-token>' );! ! wpcom! ! .site( 'miguellezama.com' )! ! .postsList( function ( err, data ) ! {! ! ! if ( err ) throw err;! ! ! console.log( data );! });! ! WPCOM.JS https://www.npmjs.org/package/wpcom
None
<script src='wpcom.js'></script>! ! <script>! var wpcom = WPCOM( '<your-token>' );!
var blog = wpcom.site( 'miguellezama.com' );! blog.posts( { number: 8 }, function( err, list ){} );! </script> WPCOM.JS Directement dans le browser
node-wpcom-oauth https://github.com/Automattic/node-wpcom-oauth WPOAuth#requestAccessToken(fn) WPOAuth#urlToConnect(resource) WPOAuth#setCode(code)
A venir Des nouveaux Endpoints! Manage Blog Settings Activate/Deactivate/Update Plugins
Activate/Deactivate Jetpack Modules
Resources • slides.miguellezama.com • developer.wordpress.com • oauth.net • github.com/Automattic/wpcom-connect-examples •
github.com/Automattic/wpcom.js • github.com/Automattic/node-wpcom-oauth • github.com/WP-API/WP-API/
?