Django-allauth Installation

There is a useful django-allauth video tutorial at Create third party Facebook login in Django. The document below simply follows that but only adds facebook social authentication. Documentation can be found at django-alluth documentation. django-allauth can also be installed by cloning from https://github.com/pennersr/django-allauth
I am running Django 1.9.5 and will install django-allauth 0.25.2 Setup a virtual environment if you haven’t already.

$ pip install django-allauth

Check the packages in your virtual environment with,

$ pip list

You can install the packages in requirements.txt to your virtual environment or whatever environment you are in with,

$ pip install -r requirements.txt

Put the packages in your virtual environment into your requirements.txt file with,

$ pip freeze -> requirements.txt

For this example the django project name is `crudProject’ and the app name is `crudapp’.┬áIn settings.py add appropriately to TEMPLATES so that it looks like this,

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, "templates")],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
                'django.template.context_processors.request',
            ],
        },
    },
]

Bear in mind,

'django.template.context_processors.request',

may already be in the `context_processors’
Then add to settings.py,

AUTHENTICATION_BACKENDS = (
    # Needed to login by username in Django admin, regardless of `allauth`
    'django.contrib.auth.backends.ModelBackend',

    # `allauth` specific authentication methods, such as login by e-mail
    'allauth.account.auth_backends.AuthenticationBackend',
)

Then add to INSTALLED_APPS

INSTALLED_APPS = (
    ...
    # The Django sites framework is required
    'django.contrib.sites',
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
    'allauth.socialaccount.providers.facebook',
)

and also add to settings.py,

SITE_ID = 1

To urlpatterns = […] in urls.py add,

url(r'^accounts/', include('allauth.urls')),

To see the accounts urls available to you go to localhost:8000/accounts/ be sure not to omit the trailing ‘/’.
Next run a migrate,

$ python manage.py migrate
python manag.py runserver

And go to localhost:8000/accounts/admin You should see in admin, ACCOUNTS, SITES and SOCIALACCOUNTS.
Selection_015

 

We need to go to the Facebook Developer Site. Signup to get account or login with your Facebook credentials if you already have a Facebook account.
In the `My Apps’ pull down menu select `Add a New App’
Selection_016

 

and then click on `Website`
Selection_017

Put in the name of your app which in my case is `crudapp`

 

Selection_018

then continue to `Create New Facebook App ID`. You’ll be asked for an email after that, choose a category for your app. Choose `Education’. Next click `Create App ID`

 

Selection_019

Skipped down to the bottom of the page

 

Selection_021
and for `Site URL:’ Put in localhost:8000, then click `Next’.
Then choose `Login’

 

Selection_022

 

Then go to the `Apps’ pulldown menu at the top right of the page and choose `crudapp`. This should take you to the app’s dashboard and you should see the app ID and secret key which you can reveal my clicking on the `Show’ button.

 

Selection_023

Now go back to your browser and navigate to localhost:8000/admin and go into `SITES` and click on `example.com`

 

Selection_024

 

Change the `Domain name` and `Display name` to the following,

Selection_025
Now localhost:800 has site ID: 1. Back in the admin home click on `Social applications’ under `SOCIALACCOUNTS’.

 

Selection_026
Next click `ADD SOCIAL APPLICATION` which is over on the top right of the screen. Fill in the `Provider`, `Name` and the `Client id` and `Secret key` which we looked at on the facebook developer site. Click the `localhost:8000` under `Available sites`.

 

Selection_027
Move `localhost:8000` across from `Available sites` to `Chosen sites` by clicking the little right arrow between them, while it is highlighted.

 

Selection_029
Then click `SAVE` at the bottom right of the page. Now logout of `admin and navigate to http://localhost:8000/accounts/login`
This should bring up a simple unstyled form,

 

Selection_030
You need to return to the Facebook developer site and under `App Review` set to `Yes` under `Make crudapp public?`

 

Selection_031
Logout of the Facebook developer site and all Facebook accounts and go back to http://localhost:8000/accounts/login/
This will bring you to http://localhost:8000/accounts/loggedin/#_=_ where you will see `Page not found (404)`. To correct this,
In settings.py add,

LOGIN_REDIRECT_URL = '/'

to redirect to the homepage after login.
Next add to your app the a `templates` directory and inside that a directory called `account`. In your directory where you setup your virtual environment you will find a lib directory from there go to,

lib/python2.7/site-packages/allauth/templates

where you should find a base.html templates file copy this to your app/templates directory.

$ cp base.html ~/djangoForum/djangoForum/crudapp/templates/

Then change directory into `account` and you will see html template files for login.html, logout.html, signup.html etc. These files need to be copied to your app’s templates/account directory.

$ cp -r * ~/djangoForum/djangoForum/crudapp/templates/account/

You can now style these templates.