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
190
WP JSON REST API
WordCamp Montreal presentation
Miguel Lezama
August 16, 2014
Tweet
Share
Other Decks in Programming
See All in Programming
1인 개발자로 행복하게 살기 - GDG 송도 헬로월드 2024
benjaminkim
1
5.6k
Build with AI 2024 Seoul - 제로부터 시작하는 Flutter with Gemini 생활 - 박제창
itsmedreamwalker
0
200
Designing for tomorrow's programming workflows
honnibal
PRO
2
110
Git Rebase
bkuhlmann
11
1.6k
Netty Chicago Java User Group 2024-04-17
sullis
0
140
今の SmartHR にエンジニアで入社するとどうなるの?
daisukeshinoku
5
4.6k
GraphQLサーバの構成要素を整理する #ハッカー鮨 #tsukijigraphql / graphql server technology selection
izumin5210
4
310
Javaエンジニアのための Nodejs/Nuxt3入門
hidekatsu_izuno
0
280
StreamlitとTerraformでデータカタログを作った話
gussan0223
0
300
puregoの活用例
aethiopicuschan
0
220
1BRC--Nerd Sniping the Java Community
gunnarmorling
0
300
DMMプラットフォームがTiDB Cloudを採用した背景
pospome
8
3.7k
Featured
See All Featured
Designing for humans not robots
tammielis
247
25k
Fashionably flexible responsive web design (full day workshop)
malarkey
397
65k
Embracing the Ebb and Flow
colly
79
4.1k
Raft: Consensus for Rubyists
vanstee
132
6.2k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
15
1.4k
Happy Clients
brianwarren
91
6.4k
Designing the Hi-DPI Web
ddemaree
276
33k
What’s in a name? Adding method to the madness
productmarketing
PRO
15
2.6k
Bash Introduction
62gerente
604
210k
Faster Mobile Websites
deanohume
297
30k
Navigating Team Friction
lara
177
13k
Docker and Python
trallard
33
2.7k
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/
?