その際に開発者である筆者がつまったことを紹介しようと思います。
Next.jsの公式ドキュメントで、redirect という関数を見つけました。
いかにもリダイレクトしてくれそう。非常に頼もしい。Next.js最高!!!
と、思っていたのですが、使ってみると307リダイレクトもしくは308リダイレクトしかしてくれません。
実は、リダイレクトを行うステータスコードには、いくつか種類が有ります。その中でもGoogleは、301リダイレクトを推奨しており、308ではGoogle Search Consoleもリダイレクトを検知してくれませんでした。
最終的には、getServerSidePropsを使用しました。
getServerSideProps とは、ページをレンダリングする前にサーバー側でカスタムの値を返すことができるという機能です。
サーバー側でAPIのデータなどを取得して、レンダリングに使用するという使われ方がよくなされます。
今回は、301のステータスコードを返したいので、リダイレクトを設定したいページでgetServerSideProps をエクスポートして、{ redirect: { destination: url, statusCode: 301 } } を返り値に設定しました。
以下にコード全文を載せておきます。ただしapp routerで使うことはできません。
pages/[[…page]].tsx
import { GetServerSideProps } from "next";
export default function Redirect() {
return <></>;
}
export const getServerSideProps: GetServerSideProps = async (context) => {
let loc = context.params?.page;
let basePath = "";
if (typeof loc === "string") {
basePath = loc;
} else if (typeof loc === "object") {
basePath = loc.join("/");
}
const url = "https://kyouryoku.net/" + basePath;
return { redirect: { destination: url, statusCode: 301 } };
};
Google Search Consoleで、サイトの所有権を証明するため、DNSレコードに発行されたテキストを設定する必要がありました。
そこで、こちらの記事に従ってお名前ドットコムにDNSレコードを設定しました。しかし、一晩経っても所有権が証明できません。
いろいろ悩んだ末に、検索してこちらの10年に一度しか需要がないと謳っている記事に行き着きました。
どうやら、Netifyにカスタムドメインを登録する際にDNSサーバーをNetifyのサーバーに設定していたようです。そのため、いくらお名前ドットコムのDNS設定を変更しても意味がなく、Netifyの設定を変える必要がありました。
原因は凡ミスでした。どうやら、自分は10年に一度の逸材のようです。
こちらのサイトで料金比較などがなされていました。
一応、一番の有名どころはお名前ドットコムです。筆者も最終的には、そこでドメインを取得しています。
ドメインを取得し運用しようとすると、二つの費用がかかります。一つ目が、取得にかかる費用で、二つ目が、更新にかかる費用です。
更新は、一般的に一年に一回行う必要があります。もし、一年以内に思ったように運営できなかった場合解約するといった柔軟な運用ができることを期待して、取得費用重視でサービスの選定を行いました。
また、単純にお名前ドットコムは、それなりに有名なサービスなので、検索したら、記事が多く出るのも良い点です。
悪い点として感じたのは、自社の有料サービスにやたら誘導してくる点です。DNSレコードの更新手続きの途中などに、有料サービスのポップアップを表示してきたりするので、適当にボタンをポチポチ押して行くタイプの人にはお勧めできません。
ドメイン移行作業をしてみると、自身の未熟さと未知さに改めて気付かされました。小さなことでも新しいことをしてみるのは重要ですね。では、また!!!
calendar_month公開日 : 2024年12月26日
そろそろ新年も近づいて来ました。この記事では、Google Apps ScriptとGoogle Spreadsheet を用いて、おみくじを引くことのできる神社を建立しようと思います。
calendar_month公開日 : 2024年12月25日
Next.jsで、ビルド時にsitemap.xmlやrobots.txtを自動生成してくれると嬉しいですよね。今回はその夢を叶えてくれるnext-sitemapというライブラリの紹介です。このライブラリについて書いてくれている記事は既にいくつかあるのですが、robots.txtについて書いている記事は少なかったので、主にrobots.txtに焦点を当てて書いてみようと思います。
calendar_month公開日 : 2024年12月23日
峡緑プレイは、この度ドメインの移行を実施しました。その際、Next.jsでの301リダイレクトのやり方や、おなまえドットコムでDNSレコードが反映されないなど様々な点で詰まったので解決策を含めて紹介しようと思います。
calendar_month公開日 : 2024年11月8日
峡緑プレイには、アカウント機能があります。アカウント機能はどうやって使うのか、どのようなメリットがあるのか、ランクとは何なのかという疑問をこの記事では解決していきたいと思います。