【Cloudflare Workers 】特定のページでリダイレクトする【Page Rulesと併用】

こんにちは、ブログ移転してなんとかやってるこふです。

Cloudflare Pages でホスティング（デプロイ）したサイトから強制的に別のサイトへリダイレクトさせます。

Cloudflare Workers は CDN 上で動くので、そこで動かすプログラムを書きます。そのプログラムでは、特定の URL と一致したら遷移する、という方法を取ります。

Cloudflare の UI（画面）は頻繁に変わり、URL も変わることが多いため、使い方は公式ページでご覧ください。

1const redirectHttpCode = 301
2const redirectMap = new Map([
3  ['/blog/path-hoge', 'https://blog.cohu.dev/path-hoge'],
4  // 必要に応じて書く
5])
6
7addEventListener('fetch', (event) => {
8  event.respondWith(handleRequest(event.request))
9})
10
11async function handleRequest(request) {
12  const url = new URL(request.url)
13  const { pathname } = url
14
15  const targetUrl = redirectMap.get(pathname)
16  if (targetUrl) {
17    return Response.redirect(targetUrl, redirectHttpCode)
18  }
19
20  return fetch(request)
21}

自分のサイトはページ数が少なく、愚直にパスをマップで書きました。ページ数が多い場合は、正規表現を使って Boolean を求め、リダイレクトさせれば OK です。

ページルールが使えなかったからです。元々、以下の記事で書いたのですが、example.com からwww.example.comにリダイレクトさせています。

おそらく、ページルールは同時に 2 つ動かすことができないのでは？と感じました。

そのため、ページルールで遷移したのちに、Workers で遷移するという手段を思いついた次第です。

https://wheregoes.com/trace/20222569712/からリダイレクトを確認します。

このサイトは複数回のリダイレクトも表示してくれて非常に便利ですよ。

以上、Cloudflare Workers で強制的にリダイレクトさせる方法でした。

あまりにもページ数が多いサイトや、PV 数が多いサイトでは無料で行うことは困難な可能性があります。そのため、作って半年くらいの個人サイトで使うのが便利だと感じました。