Netlifyのリダイレクト設定でワイルドカードを使う方法

2022/04/15

Netlify でリダイレクト設定をするときにワイルドカードを使ったら、正しくリダイレクトできなかったので、ワイルドカードを使ってリダイレクトさせる方法をまとめてみました。

今回は下記の articletech にリダイレクトするときを例にまとめています。

Netlifyで失敗するワイルドカードのリダイレクト

最初は、下記のように from と to のそれぞれに「 * 」を指定して、 article 配下のページをまとめて tech 配下へリダイレクトするように設定しようとしました。

[[redirects]]
  from = "/article/*"
  to = "/tech/*"
  status = 301

この設定でビルドしたあとにプレビューURLでテストすると…

/article/1 へアクセスすると /tech/* へリダイレクトされてしまいました。。

まさかワイルドカードを使えない!? いや、そんなことないはずと調べたらちゃんとありました!

Netlifyで成功するワイルドカードのリダイレクト

Netlify のリダイレクトには :splat というのが用意されているので、これを使うことで今回やりたかったワイルドカードでのリダイレクトができることがわかりました。

ドキュメントをもとに記述を書き直すと下記のようになります。

[[redirects]]
  from = "/article/*"
  to = "/tech/:splat"
  status = 301

「 * 」で書いていたところを「 」に書き換えることでワイルドカードと同じことができます。

この設定で /article/1 へアクセスすると /tech/1 へ正しくリダイレクトされました!

そのため、Netlify でワイルドカードを使ったリダイレクトをしたい場合は、 :splat を使って対応しましょう。

参考資料

Netlify のドキュメント