Skip to main content
Categories
DevOpsとデプロイメント等中級の学習学習

Gatsby Cloudで新URLへリダイレクトする方法

  • Post Author
    By pitang1965
  • Post Date
    Sat Dec 18 2021
spider-web-with-water-beads-network-dewdrop

一つの独自ドメインを複数サーバーで利用する方法」にて、独自ドメインを用いて次のようにURLを変更しました。

URL使用しているサーバー
変更前https://pitang1965.gatsbyjs.io/Gatsby Cloud
変更後https://blog.pitang1965.com/Gatsby Cloud
URLの変更

これで変更後のURLにアクセスできるようになったのですが、以前として変更前のURLにもアクセスできてしまします。今回は、変更前のURLにアクセスしたら、即座に新しいURLへリダイレクトしたいと思います。

通常、ApacheなどのWebサーバーでは、.htaccess(えいちていーあくせす)ファイルでこれをおこなう方法があるようです。Gatsby Cloudでは、次の方法でできました。

Gatsby Plugin Htaccess

gatsby-plugin-htaccess をインストールします。

$ npm install gatsby-plugin-htaccess

又は

$ yarn add gatsby-plugin-htaccess

gatsby-config.jsの設定

gatsby-config.jsのmodule.exports の中に次の設定を加えました。

{
      resolve: 'gatsby-plugin-htaccess',
      options: {
        RewriteBase: '/',
        https: true,
        www: false,
        SymLinksIfOwnerMatch: true,
        host: 'blog.pitang1965.com', // if 'www' is set to 'false', be sure to also remove it here!
        ErrorDocument: `
          ErrorDocument 404 /404/index.html
        `,
        redirect: [
          {
            from: 'pitang1965.gatsbyjs.io',
            to: 'blog.pitang1965.com',
          },
        ],
        custom: `
            # This is a custom rule!
            # This is a another custom rule!
        `,
      },
    },