2021-12-18

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

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

これで変更後の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!
        `,
      },
    },