WordPress.com for Windows Metro and the REST API

WordPress.com for Windows Metro

When we were starting work on the WordPress.com for Windows Metro app, we decided to build it entirely with the brand new WordPress.com REST API. The API gave us everything we needed to create a full-featured application that includes reading blogs, social features (post likes, reblogs), and creating new posts. Let’s take a look at a few code samples to see how we leveraged the API:

note All sample code is a condensed version of code from the Metro App. You can view the full source of the app at our trac site.

Creating a New Post

Once a user has authorized the app using OAuth (more info here), they can create new posts in the app. The /posts/new endpoint makes it very easy to create a new post via an XMLHttpRequest (xhr):

function publishPost() {
var title = "I Need a Good REST";
var content = "That's probably the corniest blog title ever created...";

var data = new FormData();

data.append('title', title);
data.append('content', content);
data.append('format', 'standard');

//note: blogID and users_access_token are received from the OAuth API
var url = 'https://public-api.wordpress.com/rest/v1/sites/' + blogID + '/posts/new';
 WinJS.xhr({
     type: 'POST',
     url: url,
     headers: { 'Authorization': 'Bearer ' + users_access_token },
     data: data
   }).then(function (result) {
     var resultData = JSON.parse(result.responseText);
  if (resultData.ID) {
    //post published!
  }
  else {
    //post publish failed
  }
}

Liking a Post

The Windows Metro app takes full advantage of the social features on WordPress.com, including likes, blog follows, and reblogs. Let’s take a look at using the /likes endpoint so that we can like a post through the API:

var curText = m.target.innerText,
likeButton = document.getElementById('like');
//just an example post_id
var post_id = 123;
//note: blogID and users_access_token are received from the OAuth API
if (curText == 'Like') {
   label.innerText = 'Liking...';
   url = 'https://public-api.wordpress.com/rest/v1/sites/' + blogID + '/posts/' + post_id + '/likes/new';
 } else {
   label.innerText = 'Unliking...';
   url = 'https://public-api.wordpress.com/rest/v1/sites/' + blogID + '/posts/' + post_id + '/likes/mine/delete';
 }

WinJS.xhr({
   type: 'POST',
   url: url,
   headers: { 'Authorization': 'Bearer ' + users_access_token }
 }).then(function (result) {
   //like operation successful!
 }, function (result) {
   //error
 });

You can see how we can also remove the like on the post by simply changing the endpoint on the post to /likes/mine/delete.

Conclusion

These examples are a small drop in the bucket of what you can do with the WordPress.com REST API. For a full list of the endpoints that are available, check out the documentation.

We’d love to hear how you are using the API in your applications! Drop us a note at our contact form to get in touch with the developer.wordpress.com team.

---

Email Newsletter

Missing out on the latest WordPress.com developments? Enter your email below to receive future announcements direct to your inbox. An email confirmation will be sent before you will start receiving notifications—please check your spam folder if you don't receive this.

Email Address:

Follow

Join 110.7M other subscribers