Next.js（Page Router）のuseRouter().asPathにはhashが含まれる 👀

asPathの項目には、

asPath: String - The path as shown in the browser including the search params and respecting the trailingSlash configuration. basePath and locale are not included.

https://nextjs.org/docs/pages/api-reference/functions/use-router#router-object より引用

と書いてあります。

Google翻訳で日本語に翻訳すると、

asPath: String - 検索パラメータを含み、trailingSlash 構成を考慮してブラウザに表示されるパス。 BasePath とロケールは含まれません。

となります。

そう。searchParamsに関しては記載がありますが、hashに関しては記載がないのです。
hashに関してはクライアントサイドのみ影響があり、サーバへのリクエストには関係ないので、asPathでパスを取得する際には除去されているものだと思い込んでいたのですが、そんなことはないことに気づきました。

src/pages/index.tsx に、

import { useRouter } from 'next/router';

export default function IndexPage() {
  const router = useRouter();

  useEffect(() => {
    console.log(router.asPath);
  }, []);

  return <div />;

を置いて、localhost:3000/#hash にアクセスすると、

/#hash

と、しっかりと表示されました。
hashを取り除いたパスを取得したい場合は、

const getRouterAsPathWithoutHash = () => router.asPath.replace(/\#.+$/, '');

という感じで、自前で関数を用意すると良いと思います。

import { useRouter } from 'next/router';

export default function IndexPage() {
  const router = useRouter();
  const getRouterAsPathWithoutHash = () => router.asPath.replace(/\#.+$/, '');

  useEffect(() => {
    console.log(getRouterAsPathWithoutHash()); // -> /
  }, []);

  return <div />;