Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


Generates client side redirect html files for redirecting on any static file host like s3 or netlify.

It uses window.location.href = url for redirection


npm install --save gatsby-plugin-client-side-redirect


yarn add gatsby-plugin-client-side-redirect

How to use

// In your gatsby-config.js
plugins: [
  `gatsby-plugin-client-side-redirect` // keep it in last in list


You can create redirects using the createRedirect action.

An example:

createRedirect({ fromPath: '/old-url', toPath: '/new-url', isPermanent: true });

This will generate the following html files:



You can use it using the node api provided by gatsby, for an example Let’s take createPages

In you gatsby-node.js file, write following

exports.createPages = ({ graphql, actions }) => {
  const {createRedirect} = actions //actions is collection of many actions - https://www.gatsbyjs.org/docs/actions
  createRedirect({ fromPath: '/old-url', toPath: '/new-url', isPermanent: true });

Above approach is kind of hard code one, let’s have a dynamic approach. Below code is just for understanding and use your schema accordingly

exports.createPages = async ({ graphql, actions }) => {
  const {createRedirect} = actions

  // fetch data from a collection which contains list of urls mapping for redirection
  let response = await graphql(`
  query redirects {
    collectionName {

let data = response.data.collectionName
 now iterate over data and create redirect for each url
© 2023 Gatsby, Inc.