うーん、顔の筋肉がまた凝ってる
ようやく問題が解決した、気がする。動作確認はしないとだけど。
Nuxt3のroute middlewareで、if (process.server) return
してクライアントサイドだけで動く様になってるのにreturn navigateTo()
すると確実に"Hydration node mismatch"が発生してしまう。SSRでレンダリングしたのとまったく違うページを、CSRでレンダリングしてるのだから、それはそう。
とはいえif (process.server) return
を直ぐには取り除けないのでnavigateTo()
の代わりにwindow.location.href
で遷移する事にした。
これならブラウザがアクセスしなおすから、SSRからやり直しになってmismatchじゃなくなる。
当然SPAじゃなくなり状態も破棄されるけど、それは許容できるのでworkaroundとしてはヨシ。
他の手で、nuxt.config.tsのrouteRules
でssr: false
にしてCSRだけになる様に設定しても回避できるけど、今回は条件に合致するならどのページからでも遷移が必要で、そうすると全ページSSR無効になっちゃうから、今回は無し。