リダイレクトをする方法「_redirectsファイル編」

リダイレクトをするには公開ディレクトリに「_redirects」というファイルを作成し、その中にリダイレクトの設定を記載していきます。

リダイレクトの記載方法は、

転送元 転送先 転送の種類

という感じです。

それぞれの間は私はタブにしました。スペースでもいいと思います。

具体的には「https://codelabo.com/270/」を「https://codelabo.com/posts/20200224190207」に永久的なリダイレクト(301)を行うには、

/270/ /posts/20200224190207 301!

と書きます。

こちらのサイトなどにも説明されてます。

https://www.suzu6.net/posts/47-netlify-redirect/

しかし、Gatsby.jsをPushしてNetlifyでデプロイするのですが、GithubにPublicフォルダが見当たりません。

どうやって公開ディレクトリに「_redirects」ファイルを入れるのかわからなかったので、そのファイルを使わない以下の方法でリダイレクトを行いました。

リダイレクトをする方法「netlify.tomlファイル編」

「netlify.toml」を編集することでもリダイレクトを行うことができます。

「_redirects」に書いていた(以下の例のような)リダイレクトの設定、

/270/    /posts/20200224190207    301!
/379/	/posts/20200224191133	301!

を

https://play.netlify.com/redirects

に入力して、「Test rules」ボタンを押します。

すると、

[[redirects]]
from = "/270/"
to = "/posts/20200224190207"
status = 301
force = true
[[redirects]]
from = "/379/"
to = "/posts/20200224191133"
status = 301
force = true

のように変換してくれるので、それを「netlify.toml」に追記することでリダイレクトを設定できます。

「netlify.toml」の例↓

[build]
  publish = "public"
  command = "yarn build"
[build.environment]
  YARN_VERSION = "1.3.2"
  YARN_FLAGS = "--no-ignore-optional"



[[redirects]]
from = "/270/"
to = "/posts/20200224190207"
status = 301
force = true
[[redirects]]
from = "/379/"
to = "/posts/20200224191133"
status = 301
force = true