Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
SlideShare a Scribd company logo

The JSON REST API for WordPress

•Download as PPTX, PDF•
•
Taylor Lovett
Taylor Lovett

The JSON REST API for WordPress provides an easy-to-use way of creating, reading, updating, and deleting data from WordPress installations.

1 of 37
JSON REST API for WordPress @tlovett12 + JSON REST API =
• My name is Taylor Lovett • Director of Web Engineering at 10up • Plugin author and contributor • Core contributor • WP API team member Who Am I? @tlovett12
We are hiring!
So what’s this new WP API thing all about? Don’t we already have one?
Right now, we have XML-RPC. It works but is extremely hard to use and outdated.
Comparison to other WordPress API’s https://github.com/WP-API/WP- API/blob/master/docs/comparison.md
• In a nutshell, JSON REST API’s have swept the web becoming an almost standard. They are extremely intuitive and provide an easy way to distribute, collect, and modify data. Why JSON REST API? Let’s break it down a bit.
• JSON is an abbreviation for “JavaScript Object Notation” • It’s simply a way to describe data that is lightweight and extremely easy to use. Arguably much easier to use than XML. JSON
• REST (Representational State Transfer) is an architectural style that dictates how HTTP and URI’s should be used and organized. • Verbs and resources: GET /post/1 • Hypermedia as the Engine of Application State (HATEOAS) - Server provides everything you need to know how to use it in a response. • Actions are autonomous and do not depend on each other. • Bottom line: RESTful API’s have become extremely popular across the web. They are much easier to use than things like RPC or SOAP. REST
• An API (Application Programming Interface) is a set of entry points that allow you to interact with a platform (WordPress in this case). And of course, API
Ryan McCue and Contributors
How can I start using it now?
http://wordpress.org/plugins/json-rest-api/ Core integration (probably) in 4.1 First, install the plugin
What does the API allow me to do? /wp-json/ Shows all the routes and endpoints available /wp-json/posts Create, read, update, and delete posts /wp-json/users Create, read, update, and delete users /wp-json/media Create, read, update, and delete media items /wp-json/taxonomies Read taxonomies and terms /wp-json/pages/ Create, read, update, and delete pages
The API is rich with functionality. Explore the documentation! http://wp-api.org/docs-development/ Let’s look at a few key endpoints.
List Posts [{ "ID": 11297, "title": "Post 19", "status": "publish", "type": "post", "author": 1, "content": "", "parent": null, "link": "http://example.com/2014/08/post-19/", "format": "standard", "slug": "post-19", "guid": "http://example.com/2014/08/post-19/", "excerpt": null, "menu_order": 0, "comment_status": "closed", "ping_status": "open", "sticky": false, "meta": {}, "featured_image": null, "terms": {} }] GET /wp-json/posts
List Posts Endpoint: /wp-json/posts Takes a number of useful parameters: • Filter[]: Accepts WP_Query arguments • Page: Allows for pagination • Context: Determines usage context i.e. “view or edit” • … https://github.com/WP-API/WP-API/blob/master/docs/routes/routes.md
Retrieve A Post { "ID": 11297, "title": "Post 19", "status": "publish", "type": "post", "author": 1, "content": "", "parent": null, "link": "http://example.com/2014/08/post-19/", "format": "standard", "slug": "post-19", "guid": "http://example.com/2014/08/post-19/", "excerpt": null, "menu_order": 0, "comment_status": "closed", "ping_status": "open", "sticky": false, "meta": {}, "featured_image": null, "terms": {} } GET /wp-json/posts/<id>
Edit A Post PUT /wp-json/posts/<id> curl -X PUT -H “Content-Type: application/json” -d ‘ { "title": “Updated Title", “content_raw": “Updated post content" } ‘ -u admin:password http://example.com/wp-json/posts/<id> We need to send a PUT request to this endpoint with our post data. Of course we must authenticate before doing this.
Three ways to authenticate • Cookie Authentication (client side) • HTTP Basic Authentication • OAuth 1
HTTP Basic Authentication First install the WP Basic Auth Plugin: https://github.com/WP-API/Basic-Auth Remember this piece of our cURL request? -u admin:password That’s HTTP Basic Authentication! Essentially we are authenticating by passing an HTTP header like this: Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ== Where that crazy looking string is username:password base64 encoded.
HTTP Basic Authentication should only be used for testing!
OAuth 1.0a First install the WP OAuth Plugin: https://github.com/WP-API/OAuth1 OAuth is outside of the scope of this talk. However, it should be used instead of HTTP Basic Auth when building external applications that interact with the API. Rather than giving someone an account on your site, you can give them temporary access with OAuth.
Create A Post POST /wp-json/posts/ curl -X POST -H “Content-Type: application/json” -d ‘ { "title": “Title", “content_raw": “Post content" } ‘ -u admin:password http://example.com/wp-json/posts/ Notice we are using a POST request this time.
Taxonomies GET /wp-json/taxonomies [ { "name": "Categories", "slug": "category", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": true, "meta": {} }, { "name": "Tags", "slug": "post_tag", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": false, "meta": {} } } ]
Taxonomy GET /wp-json/taxonomies/<taxonomy> { "name": "Categories", "slug": "category", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": true, "meta": {} }
Taxonomy Terms GET /wp-json/taxonomies/<taxonomy>/terms [ { "ID": 1, "name": "Books", "slug": "books", "description": "", "parent": null, "count": 1, "link": "http://example.com/category/books/", "meta": {} }, { "ID": 2, "name": "Products", "slug": "products", "description": "", "parent": null, "count": 1, "link": "http://example.com/category/products/", "meta": {} } ]
WP API is very extensible (custom post types!) http://wp-api.org/guides/extending.html Build Your Own Routes and Endpoints
What can I do with the JSON REST API for WordPress?
JavaScript Interact with your (or someone else’s) WordPress install with JavaScript. Backbone.js Client: https://github.com/WP-API/client-js Node.js Client: https://github.com/kadamwhite/wordpress-rest-api
• Backbone.js is a JavaScript framework that lets you structure code in terms of models, views, and collections. It works great with RESTful JSON API’s. Backbone.js
• _s or underscores is a popular starter theme by Automattic: https://github.com/automattic/_s • _s_backbone is an _s fork that powers post loops using the WP API Backbone client _s_backbone
https://github.com/tlovett1/_s_backbon e
• It means _s_backbone is a starter theme with infinite scroll built-in using the WP API Backbone client. • Infinite scroll is the concept of loading multiple rounds of entities without reloading the page. What does this mean? Let’s look at some code!
This is some JavaScript you could add to a theme or plugin to display your site’s posts. You will first need to have JSON REST API for WordPress installed and the “wp-api” JavaScript dependency enqueued. functions.php: js/scripts.js:
If you learned nothing so far, know this: You can do amazing things with the JSON REST API for WordPress. With core integration and ~23% of the web using this API in the near future, you will have much easier access to data across the web.
Questions? @tlovett12

More Related Content

The JSON REST API for WordPress

  • 1. JSON REST API for WordPress @tlovett12 + JSON REST API =
  • 2. • My name is Taylor Lovett • Director of Web Engineering at 10up • Plugin author and contributor • Core contributor • WP API team member Who Am I? @tlovett12
  • 4. So what’s this new WP API thing all about? Don’t we already have one?
  • 5. Right now, we have XML-RPC. It works but is extremely hard to use and outdated.
  • 6. Comparison to other WordPress API’s https://github.com/WP-API/WP- API/blob/master/docs/comparison.md
  • 7. • In a nutshell, JSON REST API’s have swept the web becoming an almost standard. They are extremely intuitive and provide an easy way to distribute, collect, and modify data. Why JSON REST API? Let’s break it down a bit.
  • 8. • JSON is an abbreviation for “JavaScript Object Notation” • It’s simply a way to describe data that is lightweight and extremely easy to use. Arguably much easier to use than XML. JSON
  • 9. • REST (Representational State Transfer) is an architectural style that dictates how HTTP and URI’s should be used and organized. • Verbs and resources: GET /post/1 • Hypermedia as the Engine of Application State (HATEOAS) - Server provides everything you need to know how to use it in a response. • Actions are autonomous and do not depend on each other. • Bottom line: RESTful API’s have become extremely popular across the web. They are much easier to use than things like RPC or SOAP. REST
  • 10. • An API (Application Programming Interface) is a set of entry points that allow you to interact with a platform (WordPress in this case). And of course, API
  • 11. Ryan McCue and Contributors
  • 12. How can I start using it now?
  • 14. What does the API allow me to do? /wp-json/ Shows all the routes and endpoints available /wp-json/posts Create, read, update, and delete posts /wp-json/users Create, read, update, and delete users /wp-json/media Create, read, update, and delete media items /wp-json/taxonomies Read taxonomies and terms /wp-json/pages/ Create, read, update, and delete pages
  • 15. The API is rich with functionality. Explore the documentation! http://wp-api.org/docs-development/ Let’s look at a few key endpoints.
  • 16. List Posts [{ "ID": 11297, "title": "Post 19", "status": "publish", "type": "post", "author": 1, "content": "", "parent": null, "link": "http://example.com/2014/08/post-19/", "format": "standard", "slug": "post-19", "guid": "http://example.com/2014/08/post-19/", "excerpt": null, "menu_order": 0, "comment_status": "closed", "ping_status": "open", "sticky": false, "meta": {}, "featured_image": null, "terms": {} }] GET /wp-json/posts
  • 17. List Posts Endpoint: /wp-json/posts Takes a number of useful parameters: • Filter[]: Accepts WP_Query arguments • Page: Allows for pagination • Context: Determines usage context i.e. “view or edit” • … https://github.com/WP-API/WP-API/blob/master/docs/routes/routes.md
  • 18. Retrieve A Post { "ID": 11297, "title": "Post 19", "status": "publish", "type": "post", "author": 1, "content": "", "parent": null, "link": "http://example.com/2014/08/post-19/", "format": "standard", "slug": "post-19", "guid": "http://example.com/2014/08/post-19/", "excerpt": null, "menu_order": 0, "comment_status": "closed", "ping_status": "open", "sticky": false, "meta": {}, "featured_image": null, "terms": {} } GET /wp-json/posts/<id>
  • 19. Edit A Post PUT /wp-json/posts/<id> curl -X PUT -H “Content-Type: application/json” -d ‘ { "title": “Updated Title", “content_raw": “Updated post content" } ‘ -u admin:password http://example.com/wp-json/posts/<id> We need to send a PUT request to this endpoint with our post data. Of course we must authenticate before doing this.
  • 20. Three ways to authenticate • Cookie Authentication (client side) • HTTP Basic Authentication • OAuth 1
  • 21. HTTP Basic Authentication First install the WP Basic Auth Plugin: https://github.com/WP-API/Basic-Auth Remember this piece of our cURL request? -u admin:password That’s HTTP Basic Authentication! Essentially we are authenticating by passing an HTTP header like this: Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ== Where that crazy looking string is username:password base64 encoded.
  • 23. OAuth 1.0a First install the WP OAuth Plugin: https://github.com/WP-API/OAuth1 OAuth is outside of the scope of this talk. However, it should be used instead of HTTP Basic Auth when building external applications that interact with the API. Rather than giving someone an account on your site, you can give them temporary access with OAuth.
  • 24. Create A Post POST /wp-json/posts/ curl -X POST -H “Content-Type: application/json” -d ‘ { "title": “Title", “content_raw": “Post content" } ‘ -u admin:password http://example.com/wp-json/posts/ Notice we are using a POST request this time.
  • 25. Taxonomies GET /wp-json/taxonomies [ { "name": "Categories", "slug": "category", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": true, "meta": {} }, { "name": "Tags", "slug": "post_tag", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": false, "meta": {} } } ]
  • 26. Taxonomy GET /wp-json/taxonomies/<taxonomy> { "name": "Categories", "slug": "category", "labels": {}, "types": { /* Registered post types */ }, "show_cloud": true, "hierarchical": true, "meta": {} }
  • 27. Taxonomy Terms GET /wp-json/taxonomies/<taxonomy>/terms [ { "ID": 1, "name": "Books", "slug": "books", "description": "", "parent": null, "count": 1, "link": "http://example.com/category/books/", "meta": {} }, { "ID": 2, "name": "Products", "slug": "products", "description": "", "parent": null, "count": 1, "link": "http://example.com/category/products/", "meta": {} } ]
  • 28. WP API is very extensible (custom post types!) http://wp-api.org/guides/extending.html Build Your Own Routes and Endpoints
  • 29. What can I do with the JSON REST API for WordPress?
  • 30. JavaScript Interact with your (or someone else’s) WordPress install with JavaScript. Backbone.js Client: https://github.com/WP-API/client-js Node.js Client: https://github.com/kadamwhite/wordpress-rest-api
  • 31. • Backbone.js is a JavaScript framework that lets you structure code in terms of models, views, and collections. It works great with RESTful JSON API’s. Backbone.js
  • 32. • _s or underscores is a popular starter theme by Automattic: https://github.com/automattic/_s • _s_backbone is an _s fork that powers post loops using the WP API Backbone client _s_backbone
  • 34. • It means _s_backbone is a starter theme with infinite scroll built-in using the WP API Backbone client. • Infinite scroll is the concept of loading multiple rounds of entities without reloading the page. What does this mean? Let’s look at some code!
  • 35. This is some JavaScript you could add to a theme or plugin to display your site’s posts. You will first need to have JSON REST API for WordPress installed and the “wp-api” JavaScript dependency enqueued. functions.php: js/scripts.js:
  • 36. If you learned nothing so far, know this: You can do amazing things with the JSON REST API for WordPress. With core integration and ~23% of the web using this API in the near future, you will have much easier access to data across the web.