Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
REST APIs for Absolute Beginners
Tom J Nowell
July 23, 2017
Technology
0
590
REST APIs for Absolute Beginners
How to make a basic endpoint, use it on the frontend, and convert existing code
Tom J Nowell
July 23, 2017
Tweet
Share
More Decks by Tom J Nowell
See All by Tom J Nowell
Using Blocks Outside The Editor
tarendai
0
570
Composer_and_WordPress__1_.pdf
tarendai
0
52
VVV 2
tarendai
0
430
WordCamp Europe 2016 - Handling Anxiety
tarendai
1
160
Escape From New York
tarendai
0
510
WP The Right Way
tarendai
0
850
Code Deodorant 2014
tarendai
1
540
Adv WP CLI
tarendai
0
500
WP CLI
tarendai
0
390
Other Decks in Technology
See All in Technology
AWSを使う上で意識しておきたい、クラウドセキュリティ超入門(駆け足版)
kkmory
0
220
LINSTOR — это как Kubernetes, но для блочных устройств
flant
0
4k
Continuous Architecture Design for Modernization
humank
3
550
聊聊 Cgo 的二三事
david74chou
0
340
EKS AnywhereとIAM Anywhereを組み合わせてみた
regmarmcem
0
420
CityGMLとFBXの連携で地理空間のエンタメ化
soh_mitian
0
770
DevRel組織についての考察
taijihagino
PRO
0
150
Getting Started in Product Management
thatjeffsmith
0
130
GCCP Creator @ COSCUP 2022
line_developers_tw
PRO
0
1.4k
Reactコンポーネントにおけるテスト手法の選択肢
sakito
5
1.7k
金融スタートアップの上場準備で大事にしたマインドセット / 2022-08-04-the-mindset-in-preparing-for-ipo
stajima
0
330
20220803投資先CXO候補者向け 会社紹介資料_合同会社BLUEPRINT
hik
0
590
Featured
See All Featured
Debugging Ruby Performance
tmm1
65
10k
The Straight Up "How To Draw Better" Workshop
denniskardys
225
130k
Side Projects
sachag
450
37k
The World Runs on Bad Software
bkeepers
PRO
57
5.4k
Building a Scalable Design System with Sketch
lauravandoore
448
30k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
107
16k
jQuery: Nuts, Bolts and Bling
dougneiner
56
6.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
396
62k
A Philosophy of Restraint
colly
192
15k
Gamification - CAS2011
davidbonilla
75
3.9k
Code Review Best Practice
trishagee
44
9.7k
Bootstrapping a Software Product
garrettdimon
296
110k
Transcript
REST APIs for Absolute Beginners How to make a basic
endpoint, use it on the frontend, and convert existing code
What are my options?
Admin AJAX? add_action("wp_ajax_fruit", "fruit"); add_action("wp_ajax_nopriv_fruit", "fruit"); function fruit() { echo
"bananas"; exit; } jQuery.ajax({ type : "get", url : "https://example.com/wp-admin/admin-ajax.php", data : { action: "fruit" }, success: function(response) { // } });
A file in your theme/plugin you call?
REST API Endpoints
Where is the API? /wp-json
The rest API is a is a set of pages
that return JSON instead of HTML that have no state
REST actions GET - viewing POST - adding/updating DELETE -
deleting
Adding an Endpoint add_action( 'rest_api_init', function () { register_rest_route( 'tomjn/v1',
'/test/', array( 'methods' => 'GET', 'callback' => 'tomjn_rest_test' ) ); } ); function tomjn_rest_test() { return "moomins"; }
/wp-json/tomjn/v1/test
None
Viewing an endpoint jQuery.get( "https://tomjn.com/wp-json/tom/v1/test", function ( data ) {
console.log( data ); } );
How Do I Accept Parameters? function tomjn_rest_test( \WP_REST_Request $request )
{ return "moomins ".$request["val"]; } /wp-json/tomjn/v1/test?val=1 "moomins 1"
Converting AJAX calls • Register an endpoint • Use the
function WP Admin AJAX uses • Return what you want instead of printing it • Use the request parameter instead of $_GET $_POST etc • Update the URLs in your javascript
A Useful Helper wp_enqueue_script( 'wp-api' );
Creating Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts', method: 'POST',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); }, data:{ 'title' : 'Hello Moon', 'content': 'Test post' } } ).done( function ( response ) { console.log( response ); } );
Updating Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts/1', method: 'POST',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); }, data:{ 'title' : 'Updated Moon', 'content': 'even better post' } } ).done( function ( response ) { console.log( response ); } );
Deleting Content $.ajax( { url: wpApiSettings.root + 'wp/v2/posts/1', method: 'DELETE',
beforeSend: function ( xhr ) { xhr.setRequestHeader( 'X-WP-Nonce', wpApiSettings.nonce ); } } ).done( function ( response ) { console.log( response ); } );
Built in Endpoints Posts /wp/v2/posts Post Revisions /wp/v2/revisions Categories /wp/v2/categories
Tags /wp/v2/tags Pages /wp/v2/pages Comments /wp/v2/comments Taxonomies /wp/v2/taxonomies Media /wp/v2/media Users /wp/v2/users Post Types /wp/v2/types Post Statuses /wp/v2/statuses Settings /wp/v2/settings
Useful Things
Adding REST support to CPT 'show_in_rest' => true,
WP.org REST API Handbook https://developer.wordpress.org/rest-api
Rest API Console
None
None
Questions? Tom J Nowell @tarendai https://tomjn.com Wordpress.com VIP* * we’re
hiring