Redirects

Handling redirects from the Redirect module.

This guide uses `translatedPathFromContext` which is available in `next-drupal ^1.1.0`.

Next.js

To use redirects in Next.js you can configure a `redirects` key in `next.config.js`.

next.config.js

module.exports = {
  async redirects() {
    return [
      {
        source: "/about",
        destination: "/",
        permanent: true,
      },
    ]
  },
}

Redirect Module

To handle redirects coming from Drupal (redirect module), you can use `translatedPathFromContext`.

Here's how you can handle redirect in `getStaticProps`.

pages/[...slug].tsx

import {
  DrupalNode,
  getPathsFromContext,
  getResourceFromContext,
  getView,
  translatePathFromContext,
} from "next-drupal"


export async function getStaticProps(
  context
): Promise<GetStaticPropsResult<NodePageProps>> {
  // Get information about the path.
  const path = await translatePathFromContext(context)


  if (!path) {
    return {
      notFound: true,
    }
  }


  // Check for redirect.
  if (path.redirect?.length) {
    const [redirect] = path.redirect
    return {
      redirect: {
        destination: redirect.to,
        permanent: redirect.status === "301",
      },
    }
  }


  // No redirect. Fetch the resource for this type.
  const type = path.jsonapi.resourceName
  const resource = await getResourceFromContext<DrupalNode>(type, context)
}

With `fallback: "blocking"` in `getStaticPaths`, this will cache and handle redirects configured in Drupal and still work with incremental static regeneration.

WebformSearch API