schedule2018-12-17

Netlifyでリダイレクトの設定をする

このブログの構成をFlask + AWS LambdaからNuxt + Netlifyへ移行しました。 その際に記事のURLも変更したため、過去のURLからリダイレクト設定を行います。

リダイレクトの設定

Netlifyでは公開サイトのルートに_redirectsを置き、その中にリダイレクトの設定を書き込みます。 今回の変更では記事のURLを/article/{記事名} から /posts/{記事名} に変更したため以下のようにしています。

# 記事の一覧へ
/posts           /tags/all 301!
# ブログの移行
/article/*  /posts/:splat  301!

/:splatはアスタリスクの文字と一致することを表します。

httpのステータスコードは301(永久的なリダイレクト)としてます。
常にリダイレクトするため!をつけます。 !がない場合は、ファイルが実際に存在するときパスはそのファイルの内容をレンダリングするようです。

その他の使い方

今回のブログの移行は変更箇所が少ないため2行で終わりました。

他にも便利な使い方があるのでいくつかまとめておきます。 以下、公式のドキュメントを参考にまとめました。

基本的な書き方

# Redirect with a 301
/home         /              301

# Redirect with a 302
/my-redirect  /              302

# Rewrite a path
/pass-through /index.html    200

# Show a custom 404 for this path
/ecommerce    /store-closed  404

/はサイトのルート、#はコメントです。

スプラットとプレースホルダ

/news/*  /blog/:splat

アスタリスクとスプラットは、/の構造も保持します。
/news/2004/01/10/my-storyでは/blog/2004/01/10/my-storyへリダイレクトします。

/news/:year/:month/:date/:slug  /blog/:year/:month/:date/:slug

また、このようにプレースホルダも利用することができます。

順序について

# This will redirect /jobs/customer-ninja-rockstar
/jobs/customer-ninja-rockstar  /careers/support-engineer

# This will redirect all paths under /jobs except the path above
/jobs/*                        /careers/:splat

# This will never trigger, because the rule above will trigger first
/jobs/outdated-job-link        /careers/position-filled

マッチングは上から逐次行うようです。
3つ目は/jobs/* の後ろにあるため/careers/outdated-job-linkへのリダイレクトしてしまいます。

クエリパラメータ

クエリパラメータを使用することができます。

/store id=:id  /blog/:id  301

/articles id=:id tag=:tag /posts/:tag/:id 301

クエリパラメータはスペースで指定します。

※ リダイレクト時にクエリパラメータは渡されません。よって、パラメータを含んだパスを設定するようにした方が良いです。

# これはできない。
/articles id=:id tag=:tag /posts  id=:id tag=:tag 301

繰り返しリダイレクトで接続できない

2019/01/18 にリダイレクト設定をいじったところ下のようなエラーがでて接続できなくなった。

error

詳細はこちら

参考