Simple Decoupled Preview

Provides a node preview logging service, REST endpoint to fetch preview log entities and an iframe that renders a decoupled preview page. The module can be used with any frontend framework.

Benefits

• Leverages the Drupal preview system so unsaved nodes can be previewed.
• The api is provided as a REST plugin so authentication mechanisms and permissions are fully customizable.
• A cron task is provided to clear out preview entities. They are afterall meant to be temporary.
• Relationships (aka JSON:API Includes) are customizable in the settings form.

Drupal Setup

Refer to the Documentation page to install and configure the module.

Next Integration

No additional frontend libraries needed. Just create a page that can consume the iframe and request preview entity from api to pass into your node templates.

Gatsby Integration

1. Install the gatsby-drupal-preview npm package.
2. Follow the instructions and examples in the Readme file.

Gatsby Notes

• Gatsby graphql data structure must match Drupal's Jsonapi public names.
• Gatsby image plugin requires a downloaded file so it's advisable to provide a fallback for images pointing to a url to the original file on drupal and/or the use of image derivatives will also work.
• The helper function included with gatsby-drupal-preview plugin will programmatically create a property publicUrl for file entities that links to drupal file. That can be provided as a fallback in your react components.

Similar Modules

• JSON:API Node Preview
  As is, the module provides no viable mechanism to return preview JSON to a decoupled frontend due to same user access restrictions for the user initiating the preview.
• GraphQL Node Preview
  Provides similar functionality to JSON:API Node Preview but is focused on GraphQL output rather than JSON:API and assumedly suffers from the same limitations.
• Decoupled Preview
  Depends on decoupled router and is intended to work with Next.js front-end frameworks to view saved content. Simple Decoupled Preview allows viewing unsaved content.