Open6
Auth0 x Next.js x Client Authenticationを考える
yoshiki-0428まずこの方がおっしゃっているようにNext.jsでの認証の仕方は2種類ほどある
- SPAで使われるようなClient Sideでの認証方式
- Serverless Functionを利用したSSR, FaaSでの認証方式
yoshiki-04281 の方法は従来のReact通り <Auth0Provider をRootに定義して行けばいい。
この方法のメリット
- SSRというコストが少ない
- Serverless APIを構築しなくて良い
- Frontだけで認証が完結する
- ページ遷移を必要としないAPI呼び出し（いいねとか）での実装に対応できる
yoshiki-04282 の方法はNext.js API Rootに /api/login /api/logout /api/callback などを用意する必要がある。
この方法のメリット
- Next.js APIを使用したAPIを前提で組んでいるのであれば有効？
- SSRのページが多いときに有効
- 同一ドメイン内でセッションを回すためセキュアなのかな？
yoshiki-0428多分自分であれば 1 を選ぶ。
なぜならNext.js APIを構築する = 別でAPIサーバを用意しないことが前提だから。実際、Next.js APIでDB Connectionの問題はPrismaでも解決していないし、別でAPIサーバを用意してNext.js内でAPIを組んでという手間が凄まじい。
yoshiki-0428最近Proxyかまして認証すればよいのでは？ってなっている
つまり、Front => vercel.com/api/proxy/users/ => api.com/api/users/ で自ドメイン経由してるから認証情報はそこでつければ特にFront側でトークンをごちゃごちゃしなくて良さそう
yoshiki-0428そういえば最近next-authが熱くなってきたのでシンプルにこちらで良いのかも