Add GraphQL endpoint to WordPress

I try to add GraphQL endpoint to WordPress.

Used plugin

graphql-wp is easy add GraphQL endpoint to WordPress.

Set up

$ cd /PATH/TO/WORDPRESS
$ composer require mohiohio/graphql-wp
$ cd web
$ wp plugin activate graphql-wp

After that, try to connect http://YOUR.WORDPRESS/graphql.
If activation succeeded, you can see following response.

$ curl http://trellis.dev/graphql | jq .
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100   206    0   206    0     0    529      0 --:--:-- --:--:-- --:--:--   529
{
  "errors": {
    "message": "Wrong query format or empty query. Either send raw query _with_ Content-Type: 'application/json' header or send query by posting www-form-data with a query="query{}..." parameter"
  }
}

Using by curl

If you want to use by curl, the request is like following code.

$ curl http://trellis.dev/graphql -H "Content-Type: application/json" 
-d '{"query":"{wp_query { posts(paged: 1 posts_per_page: 10) { title terms (taxonomy:"category") { name slug } } } }"}' | jq .

This request’s GraphQL query is this.

{
	"query":"{
		wp_query { 
			posts(paged: 1 posts_per_page: 10) {
				title terms (taxonomy:"category") {
					name slug
				}
			}
		}
	}"
}

And this request’s response is like this.

{
  "data": {
    "wp_query": {
      "posts": [
        {
          "title": "Hello world!",
          "terms": [
            {
              "name": "Uncategorized",
              "slug": "uncategorized"
            }
          ]
        }
      ]
    }
  }
}

Run Another Query

To get pages title and published_date

$ curl http://trellis.dev/graphql -H "Content-Type: application/json" -d '{"query":"{wp_query { posts(paged: 1 posts_per_page: 10 post_type:"page") { title date} } }"}' | jq .
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100   669    0   574  100    95   1501    248 --:--:-- --:--:-- --:--:--  1498
{
  "data": {
    "wp_query": {
      "posts": [
        {
          "title": "Sample Page",
          "date": "2016-11-07 14:32:39"
        },
        {
          "title": "Blog",
          "date": "2011-05-20 18:51:43"
        },
        {
          "title": "Front Page",
          "date": "2011-05-20 18:49:43"
        },
        {
          "title": "Clearing Floats",
          "date": "2010-08-01 09:42:26"
        },
        {
          "title": "About The Tests",
          "date": "2010-07-25 19:40:01"
        },
        {
          "title": "Level 1",
          "date": "2007-12-11 16:25:40"
        },
        {
          "title": "Level 2",
          "date": "2007-12-11 16:23:33"
        },
        {
          "title": "Level 3",
          "date": "2007-12-11 16:23:16"
        },
        {
          "title": "Page with comments disabled",
          "date": "2007-09-04 10:48:10"
        },
        {
          "title": "Page with comments",
          "date": "2007-09-04 10:47:47"
        }
      ]
    }
  }
}

To get the ID1 Posts title,content, and post status

wp_postというクエリも使えるみたいです。

$ curl http://trellis.dev/graphql -H "Content-Type: application/json" -d '{"query":"{wp_post(ID:1) { title, content, status }}"}' | jq .
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100   226    0   172  100    54    620    194 --:--:-- --:--:-- --:--:--   623
{
  "data": {
    "wp_post": {
      "title": "Hello world!",
      "content": "

Welcome to WordPress. This is your first post. Edit or delete it, then start writing!

n", "status": "publish" } } }

summary

I think GraphQL is very useful to get various contents data.
I want to try more and more 🙂

Follow me!

Okamoto Hidetaka
デジタルキューブのインフラエンジニア。勉強会に和太鼓の練習から直行することが多く「太鼓の人」とかよばれてます。 思いつきで公式ディレクトリにテーマやプラグインをアップしたりテーマレビューやったりしています。 AWS / WordPress / LinkedOpenData周りで活動していて、APIをどうこうして何か作るというのが多いです。 ひとこと
mautic is open source marketing automation