How can I use Django Allauth and Google Identity Services (GSI) simultaneously for Google login?

I have a Django project where I want to support Google login in two ways:

  • Classic OAuth redirect flow using Django Allauth.
  • Google One Tap / GSI login.

I tried using the same Google OAuth client ID for both flows.

The GSI One Tap login works. The Allauth button login now fails with:

Access blocked: This app’s request is invalid
Error 400: redirect_uri_mismatc

I tried:

- Using data-login_uri pointing to {% url 'google_login_by_token' %} for GSI.
- Keeping {% provider_login_url 'google' %} for Allauth.

I want to keep both login methods on the same site:

  • GSI One Tap (token-based)
  • Allauth OAuth redirect (classic button)

Thank you for any suggestions

You’re mixing two different OAuth flows with the same Google client configuration.

Solution: use two separate OAuth clients in Google Cloud.


Create TWO OAuth clients

Client A → Django Allauth (redirect flow)

Type: Web application

Set:

Authorized redirect URI

https://www.example.it/accounts/google/login/callback/

Nothing else. No duplicates. One canonical HTTPS domain only.

Use this client’s Client ID + Secret in your Django Allauth settings.


Client B → Google Identity Services (One Tap)

Type: Web application

Set:

Authorized JavaScript origins

https://www.example.it

No redirect URI needed for GSI token flow.

Use this client’s Client ID in your GSI script.


Why this fixes it

  • Allauth uses OAuth redirect flow → requires exact redirect_uri

  • GSI uses token POST flow → validates JS origin

Using one client for both can cause redirect_uri_mismatch because Google validates them differently.

Separate clients = no conflicts.

Вернуться на верх