【Next.js/React】Server Components側で現在のページのパス(URL)を取得する方法を調べてみたけど今のところ無さそう？（一応ワークアラウンド的な情報もあったが…）

表題にある通り、Next.jsのApp RouterでLayout.tsxとかServer Components上で、usePathname()みたいにURLの取得をやりたくて調べてみました。（usePathname()はClient Componentsでないと使えません。）

先に結論だけ

完璧に良い方法は見つかってないです。

stack overflow

とりあえずググるとstack overflowで「How can I get the url pathname on a server component next js 13」との質問がありました。（やはり同じことを考える人はいるもんですね）

そこにはissueのリンクとともにそこで提案されているらしいミドルウェアを使ったワークアラウンドがアンサーとしてありました。
ただこれは私が求めていた回答と違う気もするのでissueも目を通してみます。

issue

issueのタイトルは「[Next 13] Server Component + Layout.tsx - Can't access the URL / Pathname」でこの記事を執筆時点ではOpenになっているのでまだ直接の解決策はなさそうな気配がしますね。

stack overflowのアンサーで提案されていたワークアラウンドはこちらのコメントのようですね。

サーバーサイドのレイアウト（appDir: true）で現在のURLにアクセスする回避策を探している人のために、ミドルウェアを使った方法を紹介しましょう。

的な文言とともにサンプルコードが貼られています。
しかしその後のコメントで問題点も指摘されてました。

• あるコメントにて、「このやりかたするとSSGできないよ」的な指摘。
• またあるコメントにて、「その解決策を追加することで、すべての速度が大幅に低下しているようだから気をつけて」
• 「Vercelにデプロイしたら機能しなかったよ」

ドキュメント追記したよ的なコメントもあったが…

さらに、こちらのコメントにあるように「このissueの内容を踏まえてNext.jsのドキュメントを追加したよ」との投稿もありましたが、こちらはLayout.tsxでsearchParamsが使えるかどうかとかの仕様について書かれているだけで、私が知りたいURLの取得方法などについての記述はありませんでした。（そのドキュメントのページはこちら）

結論（現時点での個人的な）

ワークアラウンドの方法もパフォーマンスが悪くなるっぽいのでなしですね。
なので、(URL取得機能を必要としている)対象のサーバーコンポーネントがlayout.tsxとかpage.tsxとか上位のものなら、App Routerの仕様からディレクトリ構成でURLは決まるので、（公式でサーバーコンポーネント版のusePathnameみたいのが出るまでは）愚直にパスを書いてあげるとか、いい感じにパスを取得してくれるライブラリ探すとかですかね。

なお、.../xxx/[slag]/page.tsxみたいな[slag]（Dynamic Routes）によるパスパラメータの取得はサーバーコンポーネントでもできるみたいなので、Dynamic Routesを使っていてもディレクトリ構成とパスパラメータの取得で現在のURLは判別できそうです。（参考：Props（layout.tsxでパスパラメータ受け取る例も載ってます））

なので新情報が入るまではそんな感じで対応しようと思います…（もっといい方法がありそうなものですが…）

（スマートな方法があったら誰か教えてください笑）

以上です。