WP API what is it good for

Absolutely Everything

WordCamp Raleigh - 25 September 2016

IntroductionsEvan Mullins

Lead Web Developer

Brown Bag Marketing

circlecube

circlecubecom

WordPress user since 2006

Full-time web developer since 2007

Currently Version 20-beta131 (as of 20160924)

API

An application programming interface (API) is a set of

subroutine definitions protocols and tools for building software and applications A

good API makes it easier to develop a program by providing all the building blocks

which are then put together by the programmer

REST

REpresentational State Transfer

It describes how one system can communicate state with another One example would

be the state of a product (its name description etc) represented as JSON The

generalised idea of state is termed a resource

JSON

JavaScript Object Notation is a lightweight data-interchange format

It is easy for humans to read and write It is easy for machines to parse and generate It

is a text format that is completely language independent but uses conventions that are

familiar to programmers These properties make JSON an ideal data-interchange

language

JSON is built on two structures

A collection of namevalue pairs (object)

An ordered list of values (array)

WP REST API

A little historyRyan McCue started development on an API and then proposed a WordPress JSON

REST API Project for GSOC in April 2013 (when WordPress was on version 35)

The current version 20 of the plugin is in beta state and is already partially included

(the infrastructure) in the WordPress core in version 44 (December 2015)

REST

REpresentational State Transfer

It describes how one system can communicate state with another One example would

be the state of a product (its name description etc) represented as JSON The

generalised idea of state is termed a resource

JSON

JavaScript Object Notation is a lightweight data-interchange format

It is easy for humans to read and write It is easy for machines to parse and generate It

is a text format that is completely language independent but uses conventions that are

familiar to programmers These properties make JSON an ideal data-interchange

language

JSON is built on two structures

A collection of namevalue pairs (object)

An ordered list of values (array)

WP REST API

A little historyRyan McCue started development on an API and then proposed a WordPress JSON

REST API Project for GSOC in April 2013 (when WordPress was on version 35)

The current version 20 of the plugin is in beta state and is already partially included

(the infrastructure) in the WordPress core in version 44 (December 2015)

JSON

JavaScript Object Notation is a lightweight data-interchange format

It is easy for humans to read and write It is easy for machines to parse and generate It

is a text format that is completely language independent but uses conventions that are

familiar to programmers These properties make JSON an ideal data-interchange

language

JSON is built on two structures

A collection of namevalue pairs (object)

An ordered list of values (array)

WP REST API

A little historyRyan McCue started development on an API and then proposed a WordPress JSON

REST API Project for GSOC in April 2013 (when WordPress was on version 35)

The current version 20 of the plugin is in beta state and is already partially included

(the infrastructure) in the WordPress core in version 44 (December 2015)

WP REST API

A little historyRyan McCue started development on an API and then proposed a WordPress JSON

REST API Project for GSOC in April 2013 (when WordPress was on version 35)

The current version 20 of the plugin is in beta state and is already partially included

(the infrastructure) in the WordPress core in version 44 (December 2015)

A little historyRyan McCue started development on an API and then proposed a WordPress JSON

REST API Project for GSOC in April 2013 (when WordPress was on version 35)

The current version 20 of the plugin is in beta state and is already partially included

(the infrastructure) in the WordPress core in version 44 (December 2015)

A little historyThe rest of the REST API is slated for

inclusion in version 47 after considerable

discussion and planning (it was originally

intended for 45) It was delayed in order to

build it out with more endpoints

Until merging this API into core

(hopefully in 47 - December 2016-ish)

wersquoll need to install the REST API feature

Plugin

ResourcesGithub

httpsgithubcomWP-APIWP-API

Documentation

httpv2wp-apiorg

WP Plugin -

httpswordpressorgpluginsrest-api

core-restapi

Slack Channel

NutshellSo in a nutshell rather than getting your content or data via a

webpage as part of a website with php html css and javascript

you can use whatever you want and retrieve your data via the

API Yoursquoll get json data that is compact and fast to transfer and

then you can do endless things with it Create an app load it into

another website analyze it as datahellip itrsquos a great step for

WordPress and a great step to continuing democratizing the web

ToolsPostman -

HTTP or

API client

Also REST Easy for Firefox or httpie for the command line

NutshellSo in a nutshell rather than getting your content or data via a

webpage as part of a website with php html css and javascript

you can use whatever you want and retrieve your data via the

API Yoursquoll get json data that is compact and fast to transfer and

then you can do endless things with it Create an app load it into

another website analyze it as datahellip itrsquos a great step for

WordPress and a great step to continuing democratizing the web

ToolsPostman -

HTTP or

API client

Also REST Easy for Firefox or httpie for the command line

ToolsPostman -

HTTP or

API client

Also REST Easy for Firefox or httpie for the command line

Back to WordPressThe pluginAPI exposes your data in JSON format in the following content types

Posts

Pages

Media

Custom Post Types

Post Meta

Revisions

Comments

Terms

Users

Routes EndpointsEndpoints are functions available through the API and are simply urls This can be

things like retrieving the API index updating a post or deleting a comment Endpoints

perform a specific function taking some number of parameters and return data to the

client

A route is the ldquonamerdquo you use to access endpoints used in the URL A route can have

multiple endpoints associated with it and which is used depends on the HTTP verb

Routes Endpoints ExampleWith the URL httpexamplecomwp-jsonwpv2posts123

The ldquorouterdquo is wpv2posts123 - The route doesnrsquot include wp-json because

wp-json is the base path for the API itself

This route has 3 endpoints

GET triggers a get_item method returning the post data to the client

PUT triggers an update_item method taking the data to update and returning the

updated post data

DELETE triggers a delete_item method returning the now-deleted post data to the

client

GET wpv2posts get list of latest posts

GET wpv2postsltidgt retrieve a single post

V1 https2016raleighwordcamporgwp-jsonposts

V2 httpdemowp-apiorgwp-jsonwpv2posts

V2 httpdemowp-apiorgwp-jsonwpv2posts470

GET - to read data

Routes EndpointsEndpoints are functions available through the API and are simply urls This can be

things like retrieving the API index updating a post or deleting a comment Endpoints

perform a specific function taking some number of parameters and return data to the

client

A route is the ldquonamerdquo you use to access endpoints used in the URL A route can have

multiple endpoints associated with it and which is used depends on the HTTP verb

Routes Endpoints ExampleWith the URL httpexamplecomwp-jsonwpv2posts123

The ldquorouterdquo is wpv2posts123 - The route doesnrsquot include wp-json because

wp-json is the base path for the API itself

This route has 3 endpoints

GET triggers a get_item method returning the post data to the client

PUT triggers an update_item method taking the data to update and returning the

updated post data

DELETE triggers a delete_item method returning the now-deleted post data to the

client

GET wpv2posts get list of latest posts

GET wpv2postsltidgt retrieve a single post

V1 https2016raleighwordcamporgwp-jsonposts

V2 httpdemowp-apiorgwp-jsonwpv2posts

V2 httpdemowp-apiorgwp-jsonwpv2posts470

GET - to read data

Routes Endpoints ExampleWith the URL httpexamplecomwp-jsonwpv2posts123

The ldquorouterdquo is wpv2posts123 - The route doesnrsquot include wp-json because

wp-json is the base path for the API itself

This route has 3 endpoints

GET triggers a get_item method returning the post data to the client

PUT triggers an update_item method taking the data to update and returning the

updated post data

DELETE triggers a delete_item method returning the now-deleted post data to the

client

GET wpv2posts get list of latest posts

GET wpv2postsltidgt retrieve a single post

V1 https2016raleighwordcamporgwp-jsonposts

V2 httpdemowp-apiorgwp-jsonwpv2posts

V2 httpdemowp-apiorgwp-jsonwpv2posts470

GET - to read data

GET wpv2posts get list of latest posts

GET wpv2postsltidgt retrieve a single post

V1 https2016raleighwordcamporgwp-jsonposts

V2 httpdemowp-apiorgwp-jsonwpv2posts

V2 httpdemowp-apiorgwp-jsonwpv2posts470

GET - to read data

https2016raleighwordcamporgwp-jsonposts (Old API)

httpdemowp-apiorgwp-jsonwpv2posts470

Standard arguments as yoursquod expect and more

One Example

filter Use WP Query arguments to modify the response

private query vars require appropriate authorization

GET

httpsappcirclecubecomuspresidentswp-jsonwpv2presidentfilter[posts_per_page

]=-1ampfilter[order]=DESCampfilter[orderby]=meta_value_numampfilter[meta_key]=took_office

PUT - to create or update dataPOST wpv2posts create post

POST wpv2postsltidgt update existing post

DELETE - to trashDELETE wpv2postsltidgt

Authentication

AuthenticationIf you are building a theme or a plugin and want to access

the API of the site yoursquore on yoursquoll want to authenticate

with a cookie WordPress already does this so yoursquoll just

want to check if the user has permissions to do what

yoursquore attempting to do

Use a nonce (WordPress security token) to connect to a

local API if your theme or plugin wants to connect to the

API of the site itrsquos on via ajax

DELETE - to trashDELETE wpv2postsltidgt

Authentication

AuthenticationIf you are building a theme or a plugin and want to access

the API of the site yoursquore on yoursquoll want to authenticate

with a cookie WordPress already does this so yoursquoll just

want to check if the user has permissions to do what

yoursquore attempting to do

Use a nonce (WordPress security token) to connect to a

local API if your theme or plugin wants to connect to the

API of the site itrsquos on via ajax

Authentication

AuthenticationIf you are building a theme or a plugin and want to access

the API of the site yoursquore on yoursquoll want to authenticate

with a cookie WordPress already does this so yoursquoll just

want to check if the user has permissions to do what

yoursquore attempting to do

Use a nonce (WordPress security token) to connect to a

local API if your theme or plugin wants to connect to the

API of the site itrsquos on via ajax

AuthenticationIf you are building a theme or a plugin and want to access

the API of the site yoursquore on yoursquoll want to authenticate

with a cookie WordPress already does this so yoursquoll just

want to check if the user has permissions to do what

yoursquore attempting to do

Use a nonce (WordPress security token) to connect to a

local API if your theme or plugin wants to connect to the

API of the site itrsquos on via ajax

AuthenticationWrite a nonce in a

wp_localize_script

with wp_create_nonce

and then pass that nonce

value in your header

AuthenticationWrite a nonce in a

wp_localize_script

with

wp_create_nonce

and then pass that

nonce value in your

header

Authentication

OAuth authentication is the main authentication handler used for external clients It

requires installing the OAuth plugin on the site which then handles authorizations and

tokens

For examples on how to use OAuth Authentication checkout the Demo PHP API

Client the CLI client or the API console

AuthenticationWrite a nonce in a

wp_localize_script

with

wp_create_nonce

and then pass that

nonce value in your

header

Authentication

OAuth authentication is the main authentication handler used for external clients It

requires installing the OAuth plugin on the site which then handles authorizations and

tokens

For examples on how to use OAuth Authentication checkout the Demo PHP API

Client the CLI client or the API console

Authentication

OAuth authentication is the main authentication handler used for external clients It

requires installing the OAuth plugin on the site which then handles authorizations and

tokens

For examples on how to use OAuth Authentication checkout the Demo PHP API

Client the CLI client or the API console

Extend - Do MoreModifying Responses

Adding Endpoints

Custom Content Types

$args = array( show_in_rest =gt true )

Examples

US Presidential Mobile AppAn app will test your knowledge and teach you the Presidents of the USA ndash powered

with WordPress via

the REST API

US Presidential Mobile App

US Presidential Mobile AppAn app will test your knowledge and teach you the Presidents of the USA ndash powered

with WordPress via

the REST API

US Presidential Mobile App

US Presidential Mobile App

httpsappcirclecubecomuspresidentswp-jsonwpv2presidentfilter[posts_per_page

]=-1ampfilter[order]=DESCampfilter[orderby]=meta_value_numampfilter[meta_key]=took_office

USMNT Soccer AppA similar app powered by the WordPress REST API but with data centering around

the US Soccer team

SitemapperAn in-house plugin at Brown Bag

Marketing to quickly get up and

running with a new WordPress site in

our prototyping and wireframing

multisite

Construct your sitemap and the plugin

will create a new site (in the multisite

network) and via the API create new

pages according to the supplied

sitemap

SitemapperAn in-house plugin at Brown Bag

Marketing to quickly get up and

running with a new WordPress site in

our prototyping and wireframing

multisite

Construct your sitemap and the plugin

will create a new site (in the multisite

network) and via the API create new

pages according to the supplied

sitemap

Digital DashboardAngular web app built at

Brown Bag Marketing to

display live stats about a

bunch of sites Connects

to sites like pingdom

analytics etc The sites

are stored in WordPress

as a CPT and loaded

dynamically and it has

featured content thatrsquos

pulled from the WP API

Questions Comments More (better) Examples Discuss

Additional Readinghttpv2wp-apiorgreferenceposts

httpsdemowp-apiorg

httpsdeliciousbrainscomcreating-mobile-app-wp-api-react-native

httpscss-trickscomwp-rest-api-remote-control-wordpress

httpscodetutspluscomtutorialsintroducing-the-wp-rest-api--cms-24533

httpswwwsitepointcomwp-api

httpswebdevstudioscom20160105an-overview-of-the-wordpress-json-api-version-2

httpswwwwpkubecomimplementations-wp-rest-api

Additional Readinghttpv2wp-apiorgreferenceposts

httpsdemowp-apiorg

httpsdeliciousbrainscomcreating-mobile-app-wp-api-react-native

httpscss-trickscomwp-rest-api-remote-control-wordpress

httpscodetutspluscomtutorialsintroducing-the-wp-rest-api--cms-24533

httpswwwsitepointcomwp-api

httpswebdevstudioscom20160105an-overview-of-the-wordpress-json-api-version-2

httpswwwwpkubecomimplementations-wp-rest-api

Thank You

Slides and code available at httpscirclecubecomdoes-wordpress