Create or Post Article content with image via rest API in Drupal 8.x site

Reading time: 3 minutes

Problem

How to create or post Article or any other custom content type with image in Drupal 8.x site via rest API by using JSON:API and REST module.

Final output

At the end we will be able to post an Article node content with image field using rest API by JSON:API in Drupal 8.x site.

Prerequisite

Before creating or post Article content type, we have to upload the files correctly and then we link that file with article creation HTTP method via rest API.

If you want to make sure, How to Post or upload files by JSON rest API in Drupal 8.x site check it out

The process to create or post content with image via rest API in Drupal 8.x site is, to upload the image file and then in uploaded file response we will get fid value.

So, if you already did that, then just keep the fid value with you and we will use it in a while.

If you are ready until there, then let’s jump to achieve our goal to post article content via rest API in Drupal 8 site.

NOTE: Also make sure all the configurations for JSON:API and REST modules has been setup correctly by visiting Prerequisite article.

Solution

1. Open up the API testing tool, We are going to test it through rest API using Postman.

Create Article content type API

* Request:
Method:
POST


URL:
{{BASE_URL}}/node?_format=hal_json

Headers:
* Authorization: Basic <crediantials> 
Basic authentication is where the username and password-based authentication takes place.
* X-CSRF-Token: We can get CSRF token in response of Login API.
To see how to get CSRF token in Drupal site
* Content-Type: application/hal+json


Body:

{
    "_links": {
        "type": {
            "href": "[BASE_URL]]/rest/type/node/article"
        }
    },
    "title":{
        "value":"Article with image"
    },
    "field_image": [
        {
            "target_id": [YOUR_UPLOADED_FILE_tid_VALUE]
        }
    ]
}

NOTE:
* Put your fid value which you can get in response of uploaded file rest API in target_id.

To get the machine name for image field in Article content type in Drupal 8.x site.

Go to Structure -> Content types -> Article -> Manage fields  and there you can see all the machine names for fields e-g field_image for article image.

Get machine name for image field in content type article Drupal 8 site
Get machine name for image field in Article content type

* Response

{
    "_links": {
        "self": {
            "href": "https://dev-solution-spirit-cms.pantheonsite.io/node/3?_format=hal_json"
        },
        "type": {
            "href": "https://dev-solution-spirit-cms.pantheonsite.io/rest/type/node/article"
        },
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/revision_uid": [
            {
                "href": "https://dev-solution-spirit-cms.pantheonsite.io/user/1?_format=hal_json"
            }
        ],
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/uid": [
            {
                "href": "https://dev-solution-spirit-cms.pantheonsite.io/user/1?_format=hal_json",
                "lang": "en"
            }
        ],
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/field_image": [
            {
                "href": "https://dev-solution-spirit-cms.pantheonsite.io/file/2?_format=hal_json",
                "lang": "en"
            }
        ]
    },
    "nid": [
        {
            "value": 3
        }
    ],
    "uuid": [
        {
            "value": "72d497f7-9b58-46cf-b53f-ee13ce8d7471"
        }
    ],
    "vid": [
        {
            "value": 3
        }
    ],
    "langcode": [
        {
            "value": "en",
            "lang": "en"
        }
    ],
    "type": [
        {
            "target_id": "article"
        }
    ],
    "revision_timestamp": [
        {
            "value": "2020-05-08T01:15:59+00:00",
            "format": "Y-m-d\\TH:i:sP"
        }
    ],
    "_embedded": {
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/revision_uid": [
            {
                "_links": {
                    "self": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/user/1?_format=hal_json"
                    },
                    "type": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/rest/type/user/user"
                    }
                },
                "uuid": [
                    {
                        "value": "f2433a47-8026-4811-860a-a8dd3e23b28b"
                    }
                ]
            }
        ],
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/uid": [
            {
                "_links": {
                    "self": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/user/1?_format=hal_json"
                    },
                    "type": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/rest/type/user/user"
                    }
                },
                "uuid": [
                    {
                        "value": "f2433a47-8026-4811-860a-a8dd3e23b28b"
                    }
                ],
                "lang": "en"
            }
        ],
        "https://dev-solution-spirit-cms.pantheonsite.io/rest/relation/node/article/field_image": [
            {
                "_links": {
                    "self": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/file/2?_format=hal_json"
                    },
                    "type": {
                        "href": "https://dev-solution-spirit-cms.pantheonsite.io/rest/type/file/image"
                    }
                },
                "uuid": [
                    {
                        "value": "e44bd017-ed6a-40d4-933b-86793e9a6c46"
                    }
                ],
                "lang": "en",
                "alt": null,
                "title": null,
                "width": 61,
                "height": 68
            }
        ]
    },
    "status": [
        {
            "value": true,
            "lang": "en"
        }
    ],
    "title": [
        {
            "value": "Article with image",
            "lang": "en"
        }
    ],
    "created": [
        {
            "value": "2020-05-08T01:15:59+00:00",
            "lang": "en",
            "format": "Y-m-d\\TH:i:sP"
        }
    ],
    "changed": [
        {
            "value": "2020-05-08T01:15:59+00:00",
            "lang": "en",
            "format": "Y-m-d\\TH:i:sP"
        }
    ],
    "promote": [
        {
            "value": true,
            "lang": "en"
        }
    ],
    "sticky": [
        {
            "value": false,
            "lang": "en"
        }
    ],
    "default_langcode": [
        {
            "value": true,
            "lang": "en"
        }
    ],
    "revision_translation_affected": [
        {
            "value": true,
            "lang": "en"
        }
    ],
    "path": [
        {
            "alias": null,
            "pid": null,
            "langcode": "en",
            "lang": "en"
        }
    ],
    "comment": [
        {
            "status": 2,
            "cid": 0,
            "last_comment_timestamp": 0,
            "last_comment_name": null,
            "last_comment_uid": 0,
            "comment_count": 0,
            "lang": "en"
        }
    ]
}

Create Article content with image via rest API Postman test

Awesome we have done it, At last just go to your admin panel and see inside content list you will find the created content with image, isn’t it so easy 😉

Congratulations now we can create or post Article or any other content type with image via rest API by JSON:API module in Drupal 8.x site 🙂

Share your love with us 😉

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate this post.

Leave a Reply