はじめに
こんにちは、ブログ移転してなんとかやってるこふです。
Cloudflare Pages でホスティング（デプロイ）したサイトから強制的に別のサイトへリダイレクトさせます。
設定のやり方
Cloudflare Workers は CDN 上で動くので、そこで動かすプログラムを書きます。そのプログラムでは、特定の URL と一致したら遷移する、という方法を取ります。
Cloudflare の UI（画面）は頻繁に変わり、URL も変わることが多いため、使い方は公式ページでご覧ください。
Cloudflare Workers©
Build your next application with Cloudflare Workers
const redirectHttpCode = 301;
const redirectMap = new Map([
["/blog/path-hoge", "https://blog.cohu.dev/path-hoge"],
// 必要に応じて書く
]);
addEventListener("fetch", (event) => {
event.respondWith(handleRequest(event.request));
});
async function handleRequest(request) {
const url = new URL(request.url);
const { pathname } = url;
const targetUrl = redirectMap.get(pathname);
if (targetUrl) {
return Response.redirect(targetUrl, redirectHttpCode);
}
return fetch(request);
}
自分のサイトはページ数が少なく、愚直にパスをマップで書きました。ページ数が多い場合は、正規表現を使って Boolean を求め、リダイレクトさせれば OK です。
なぜこのやり方？
ページルールが使えなかったからです。もともと、以下の記事で書いたのですが、example.com からwww.example.comにリダイレクトさせています。
Cloudflareのページルールでrootドメインからwwwへリダイレクトする【Page Rules】
おそらく、ページルールは同時に 2 つ動かすことができないのでは？と感じました。
そのため、ページルールで遷移したのちに、Workers で遷移するという手段を思いついた次第です。
リダイレクトの確認
https://wheregoes.com/trace/20222569712/からリダイレクトを確認します。
このサイトは複数回のリダイレクトも表示してくれて非常に便利ですよ。
おわりに
以上、Cloudflare Workers で強制的にリダイレクトさせる方法でした。
あまりにもページ数が多いサイトや、PV 数が多いサイトでは無料で行うことは困難な可能性があります。そのため、作って半年くらいの個人サイトで使うのが便利だと感じました。