ピックアップ
ローカルのコンテナ上で、Next.jsのnext-auth使用してビルド後に実行したらエラーになった件
Nextjsで実装していたときに、
認証周りを構築しようとした時に、
何かライブラリなどを用いて、
GoogleのOAuthでの認証を試そうと考えました。
現時点で調べていると、
- 「Auth.js(NextAuth.js)」
というライブラリが良さそうなので、
こちらを試してみることにしました。
今回は、
ライブラリ「Auth.js(NextAuth.js)」を用いて、
Google OAuthの認証を試していたので、
その時にビルドまでうまくいったのだが、
実行するとエラーになった時のメモを
備忘録としてこの記事に残します。
公式サイトの情報
公式サイト
まずは、公式サイトでNextAuth.jsのことを確認
自分が確認した時点(2023/04/25)で、
NextAuth.js is becoming Auth.js! 🎉
Read the announcement. Note,
this site is under active development.とアナウンスされているので、
それぞれのリンクをメモしておきます。
nuxt-authでGoogle認証を試した
今回のビルドエラーになったのは、
Next.jsでGoogle認証を試していたのだが、
開発モードではうまく挙動していた。
TypeScriptを使っているので、
ビルド時にエラーになったが、
ベースとなるやっていることは、
以下の記事を参考。
Next.js でGoogle OAuthをAuth.js(NextAuth.js)で試した件
ビルドのエラーは調整済み
ビルドについてもエラーになったが、
以下の対応をやって、
問題なくビルドは完了している。
Next.jsのnext-auth使用してビルドしたらエラーになった件
実行エラー
実行したら、
エラーが発生した。
エラー内容
Error: Error serializing `.csrfToken` returned from `getServerSideProps` in “/auth/signin”.
Reason: `undefined` cannot be serialized as JSON. Please use `null` or omit this valueこちら、
以下の対応もした。
ローカルのコンテナ上で、Next.jsのnext-auth使用してビルド後に実行したらエラーになった件
今回の調査
上記の対応とは別で、
今回は環境も違うので。
http://sample.com/api/auth/providersでプロバイダーを確認
結果は、
{"google":{"id":"google",
"name":"Google",
"type":"oauth",
"signinUrl":"http://sample.com/api/auth/signin/google",
"callbackUrl":"http://sample.com/api/auth/callback/google"}}という結果。
おすすめ書籍
コメント一覧
コメントはまだありません。




コメントを残す