Setup OAuth with WordPress.com to use as headless CMS

• Documentation - https://developer.wordpress.com/docs/oauth2/
• Apps URL - https://developer.wordpress.com/apps/
• WordPress.com REST url - https://public-api.wordpress.com/wp/v2/sites/nameofblog

This is the first in a series of posts that will cover my recent conversion from using markdown files for my blog posts to using WordPress.com as a headless CMS. The reasoning for using WordPress.com is to get the benefit of the Gutenberg editor without needing to host my own WordPress site just for content editing.

Setting up an application

The term application can be confusing to those new to the concept of OAuth. The application in some ways is like the user account in a normal login setup. In my case, the application is my blog.

WordPress.com OAuth applications can be setup at https://developer.wordpress.com/apps We need to supply a couple of things to setup the application:

Redirect URLs

I use Postman to make the call in order to get the token. In that case we need to use the Postman url since that is what the WordPress.com app will redirect to to complete the authentication.

NOTE: I can't remember exactly how I got that url, but it was Postman that suggested it to me. In the future I would confirm that url is correct and not just copy it from this blog.

Javascript Origins

This is required for CORS compliance. If your website will be making REST API calls from the client browser, this is necessary. However, in my case I am making the calls at build time in the NextJS getStaticProps function. That function runs on a node server and therefore CORS restrictions don't apply.

I added my website url and localhost anyway in case I need to make calls from the client in the future.

Request, Authorize, Authenticate URLs

These URLs are specific to WordPress.com. We will plug these URLs into Postman in order to request our access token.

Next Steps

Now that we have a WordPress.com OAuth application we can request our access token that we will use to access authorized resources on the REST API.