こんにちは!
日本語は第二言語なので、文法の間違いがあれば、あらかじめ謝っておきます。
このビデオに従って、私はDjango REST Framework + Next.js + NextAuthをGoogle認証で実装しようとしています。
https://www.youtube.com/watch?v=TvoMjY291f8
ビデオの指示に従ったのですが、「IDトークン」で問題が発生しています。このサイトの他の質問もチェックしましたが、同じ問題を経験している人を見つけることができませんでした。
サインインページで「Googleでログイン」ボタンをクリックすると、英語で「Access Denied」と書かれたエラーが出ます。
Djangoのサーバーサイドのコンソールでは、以下のようなエラーが表示されます。
raise OAuth2Error("Invalid id_token") from e allauth.socialaccount.providers.oauth2.client.OAuth2Error: Invalid id_token [13/Mar/2023 10:26:30] "POST /api/social/login/google/ HTTP/1.1" 500 162465
500エラーなので、URLかビューの問題だと思います。
フロント
[...nextauth].js
import NextAuth from "next-auth"; import axios from "axios"; import GoogleProvider from "next-auth/providers/google"; const settings = { providers: [ GoogleProvider({ clientId: process.env.GOOGLE_CLIENT_ID, clientSecret: process.env.GOOGLE_CLIENT_SECRET, }), ], callbacks: { async signIn({ user, account }) { if (account.provider === "google") { const accessToken = account.access_token; const idToken = account.id_token; console.log(idToken); try { const response = await axios.post( `${process.env.DJANGO_URL}/api/social/login/google/`, { access_token: accessToken, id_token: idToken, } ); const { access_token } = response.data; user.accessToken = access_token; return true; } catch (error) { return false; } } return false; }, async jwt({ token, account }) { if (account) { token.accessToken = account.access_token; } return token; }, async session({ session, token }) { session.accessToken = token.accessToken; return session; }, }, pages: { signIn: "/auth/signin", }, }; export default (req, res) => NextAuth(req, res, settings);
上記のコードでは、コンソールログにIDトークンが正常に表示されています。
確認のため、.envファイルを示します。
DJANGO_URL=http://localhost:8000 GOOGLE_CLIENT_ID=秘密 GOOGLE_CLIENT_SECRET=秘密
Client IDとClient secretは、私のGoogleコンソールの情報と一致しています。
JavaScript Originはこのように設定されています。
http://localhost:3000
URIはこのように設定されています。
http://localhost:3000/api/auth/callback/google
サーバー
authentication/views.py
from allauth.socialaccount.providers.google.views import GoogleOAuth2Adapter from dj_rest_auth.registration.views import SocialLoginView from allauth.socialaccount.providers.oauth2.client import OAuth2Client class GoogleLoginView(SocialLoginView): adapter_class = GoogleOAuth2Adapter client_class = OAuth2Client
urls.py
from django.contrib import admin from django.urls import path, include from django.conf import settings from django.conf.urls.static import static urlpatterns = [ path('admin/', admin.site.urls), path('api/auth/', include('dj_rest_auth.urls')), #Endpoints provided by dj-rest-auth path('api/social/login/', include('authentication.urls')) #Endpoint for Social logins ] urlpatterns=urlpatterns+static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT) if settings.DEBUG: urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
authentication/urls.py
from django.urls import path, include from .views import GoogleLoginView urlpatterns = [ path("google/", GoogleLoginView.as_view(), name="google"), ]
この前、authentication/views.pyに「callback_url」変数を設定してみました。
マイグレーションを消して、新しいマイグレーションを作り、新しいマイグレーションを適用することを試しました。
他のフォーラムの投稿を参考に、POST/レスポンスの変数名を変えてみました。
どうぞよろしくお願いいたします。