Django Social Login with Facebook Example

Hi Dev,
This post will give you example of django-allauth facebook tutorial. I’m going to show you about django allauth social login. you will learn django facebook authentication using django-allauth. it's simple example of django login with facebook example.
So, Open Authorization (OAuth) is a service that allows websites or apps to share user information with other websites without being given a users password. Users can log in to multiple websites with the same account without creating other credentials.
As we know OAuth service providers Google, Facebook and GitHub. In this tutorial, we look at registering users in a Django app using Google OAuth.
So if you want to also implement login with facebook account then i will help you step by step instruction. let's follow tutorial and implement it.
Step 1: Create a Project
In this step, we’ll create a new django project using the django-admin. Head back to your command-line interface and run the following command:
django-admin startproject example
Step 2: Create a App
Now we'll create a single app called polls to store a list of post names. We're keeping things intentionally basic. Stop the local server with Control+c and use the startapp command to create this new app.
python manage.py startapp core
Step 3: Installing Django Allauth
The django-allauth is an integrated set of Django applications addressing authentication, registration, account management as well as 3rd party (social) account authentication.
pip install django-allauth
Step 4: Configuring Django Allauth
In this step we need to configuring after installing the package, register django-allauth by adding it to INSTALLED_APPS in settings.py
settings.pyINSTALLED_APPS = [ 'core', 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', "django.contrib.sites", # new # 3rd party "allauth", # new "allauth.account", # new "allauth.socialaccount", # new # social providers 'allauth.socialaccount.providers.facebook', ] AUTHENTICATION_BACKENDS = ( "allauth.account.auth_backends.AuthenticationBackend", 'django.contrib.auth.backends.ModelBackend', ) SITE_ID = 1 ACCOUNT_EMAIL_VERIFICATION = "none" LOGIN_REDIRECT_URL = "home" ACCOUNT_LOGOUT_ON_GET = True ACCOUNT_EMAIL_REQUIRED=True ACCOUNT_USERNAME_REQURIED=True LOGIN_REDIRECT_URL = "/" SOCIALACCOUNT_PROVIDERS = {'facebook': {}, 'google':{}, 'twitter':{}} SOCIALACCOUNT_PROVIDERS = \ {'facebook': {'METHOD': 'oauth2', 'SCOPE': ['email','public_profile', 'user_friends'], 'AUTH_PARAMS': {'auth_type': 'reauthenticate'}, 'FIELDS': [ 'id', 'email', 'name', 'first_name', 'last_name', 'verified', 'locale', 'timezone', 'link', 'gender', 'updated_time'], 'EXCHANGE_TOKEN': True, 'LOCALE_FUNC': lambda request: 'kr_KR', 'VERIFIED_EMAIL': False, 'VERSION': 'v2.4'}} import os STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles') MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
Step 5: Create Facebook App
To begin with, we must build an OAuth application and obtain the OAuth keys from GitHub. To establish a new OAuth application, sign in to your GitHub account and go to https://developers.facebook.com/


after create account you can copy client id and secret.
Step 6: Add a social app in Django admin
In this step create a superuser by running the following command in a terminal.
python manage.py createsuperuser
Run the app using:
python manage.py runserver
Here, Open http://127.0.0.1:8000/admin and login to Django Admin. Under Sites click Add and put 127.0.0.1:8000 as both the Domain name and Display name.

Then, under Social Applications click Add and fill in the details as follows:
- Choose Facebook as the Provider
- Add a name
- Add the Client ID and Client Secret (to Secret key) obtained earlier
- Add example.com as one of the Chosen Sites
Step 7: Creating the Views
In this step, we need to create the views for performing fetch record to the database.Open the core/views.py file and add:
core/views.pyfrom django.shortcuts import render from django.views.generic import TemplateView # Create your views here. class Home(TemplateView): template_name = "home.html"
Step 8: Creating the Templates
Here, in this step we need to create a new folder named core in the templates folder of core.
core/templates/_base.html<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" /> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Django Social Facebook Login Example</title> </head> <body> {% block content %} {% endblock content %} </body> </html>
Next, open the core/templates/home.html file and the add:
{% extends '_base.html' %} {% load socialaccount %} {% block content %} <style type="text/css"> body{ background-color: #f7fcff; } </style> <div class="container" style="text-align: center; padding-top: 10%;"> <h1>Django Facebook Social Login Example</h1> <br /><br /> {% if user.is_authenticated %} <p style="font-size:25px;">Welcome <strong>{{ user.socialaccount_set.all.0.extra_data.name }}</strong> !!!</p> <br /><br /> <a href="{% url 'account_logout' %}" class="btn btn-danger">Logout</a> {% else %} </a> <a href="{% provider_login_url 'facebook' %}" class="btn btn-primary"> <i class="fa fa-facebook fa-fw"></i> <span>Login with Facebook</span> </a> {% endif %} </div> {% endblock content %}
Step 9: Creating URLs
In this section, we’ll create the urls to access our views.Go to the urls.py core/urls.py file and update it as follows:
core/urls.pyfrom django.urls import path from .views import Home # new urlpatterns = [ path("", Home.as_view(), name="home"), # new ]
Next, we will require the modify the urls.py your root preoject folder lets update the file.
example/urls.pyfrom django.contrib import admin from django.urls import path, include urlpatterns = [ path('admin/', admin.site.urls), path('', include('core.urls')), path('accounts/', include('allauth.urls')), ]
Run the Server
In this step, we’ll run the local development server for playing with our app without deploying it to the web.
python manage.py runserver
Next, go to the http://localhost:8000/ address with a web browser.
Login Page
I Hope It will help you....