はじめに
こんにちは。アメリカ在住で独学エンジニアを目指している Taira です。
サービスを運用していると、URL の変更が必要になることがあります。
例えばこんなケースです：
- ページ構造を整理してパスを変更したい
- サイトリニューアルで URL を短くしたい
- SEO 対策として URL を統一したい
ただし、運用中のURLをいきなり変えてしまうと、ブックマークや検索エンジン経由のアクセスがエラーになってしまいます。
そこで重要なのが リダイレクト設定 です。
301リダイレクトと302リダイレクト
リダイレクトにはいくつか種類がありますが、よく使うのは以下の2つです。
- 301リダイレクト: 恒久的な移転（新しいURLに完全に移動したことを示す）。SEO評価も新URLに引き継がれる。
- 302リダイレクト: 一時的な移転（あくまで一時的な変更であり、旧URLもまだ有効）。SEO評価は基本的に引き継がれない。
運用中のURLを変更するなら、基本的には 301リダイレクト を選ぶのがベストです。
実装方法の例
Rails (routes.rb)
Rails では redirect を使って簡単に設定できます。
この場合はSPA の場合ではなく、erb を使用する場合です
# 古いURLを新しいURLへ恒久的に転送
get "/old-page", to: redirect("/new-page"), status: 301
React Router
フロントエンドでルーティングを管理している場合は、Navigate コンポーネントで実装できます。
import { Navigate } from "react-router-dom";
<Route path="/old-page" element={<Navigate to="/new-page" replace />} />
注意点
- まとめてリダイレクトしたい場合は、正規表現を使ったパターン指定を活用すると便利です。
- SEO対策のため、恒久的な変更なら必ず 301 を使うようにしましょう。
- テスト環境でも確認して、意図せぬループや誤転送がないかをチェックすると安心です。
まとめ
運用中のURLを変更する際は、必ずリダイレクトを設定してユーザーとSEOを守りましょう。
- 301リダイレクト = 恒久的移転（基本はこちらを使う）
- 302リダイレクト = 一時的移転（テストやキャンペーン用途）
- Rails や React Router なら数行で設定可能
「URLを変えるならリダイレクト必須」というのを覚えておけば安心です。