Google Sign-In

The boilerplate already includes the Google provider for django-allauth and the front-end snippet for Google One Tap. You only need to create a Google OAuth client, add its client ID to the template, and register the credentials in Django admin.

Google One Tap works on localhost during development, but in production it should be served from your real https domain.

1. Start the local project

source venv/bin/activate
python manage.py runserver

You do not need to add another Python dependency for Google auth. The boilerplate already includes allauth.socialaccount.providers.google.

2. Find the Google snippet in base.html

The boilerplate includes the Google script and One Tap container in templates/base.html:

<script src="https://accounts.google.com/gsi/client" async defer></script>

{% if not request.user.is_authenticated %}
<div
  id="g_id_onload"
  data-client_id="YOUR_GOOGLE_CLIENT_ID"
  data-login_uri="{% url 'google_login_by_token' %}"
></div>
{% endif %}

Replace YOUR_GOOGLE_CLIENT_ID with the real client ID you create in Google Cloud.

3. Create the Google OAuth client

In Google Cloud Console:

  1. create or select a project
  2. open APIs & Services -> OAuth consent screen
  3. configure the basic app details
  4. open Credentials -> Create Credentials -> OAuth client ID
  5. choose Web application

Use values similar to these:

  • Authorized JavaScript origins
    • http://localhost
    • http://localhost:8000
    • https://interviewdb.com
  • Authorized redirect URIs
    • http://localhost:8000/accounts/google/login/callback/
    • https://interviewdb.com/accounts/google/login/callback/

Keep the trailing slash on the callback URLs.

Google can take a few minutes to propagate credential changes. If login fails immediately after you save the client, wait a bit and try again.

4. Add the Social Application in Django admin

Log in to Django admin and create a new Social Application:

  • Provider: Google
  • Name: Google
  • Client id: your Google client ID
  • Secret key: your Google client secret
  • Sites: move the correct site into Chosen sites

If your production domain is not already present in the Django Sites table, add it first and then attach the social application to that site.

5. Test the flow

After the client ID is in base.html and the Social Application is saved, reload the homepage. In a compatible browser with an eligible Google session, the One Tap prompt should appear automatically.

If it does not appear:

  • clear cookies for the site
  • try an incognito window
  • make sure the client ID in base.html matches the one in Google Cloud
  • confirm the Social Application is attached to the correct Django site
  • confirm the page is loading over https in production

What this guide does not do

This guide wires up the default integration. If you want a custom Google button, a different front-end UX, or additional scopes, you can extend the allauth setup after the basic flow works.