Hoe bouw je een sociaal authenticatiesysteem in Django met behulp van OAuth

Sociale authenticatie is een manier om de identiteit van een persoon te bevestigen via een sociale account in plaats van wachtwoorden te gebruiken. Bij webontwikkeling is het altijd handig om gebruikers te authenticeren zonder wachtwoorden. Op deze manier kunnen ze inloggen via sociale apps zoals Google, Twitter of GitHub.

Het invoeren van sociale authenticatie kan de veiligheid en integriteit van een applicatie aanzienlijk verbeteren, door de gevoeligheid voor wijdverspreide wachtwoordgerichte zwakheden te minimaliseren en tegelijkertijd de ervaring van de eindgebruiker te verbeteren door het elimineren van de last van het oproepen van meerdere inloggegevens.

Gebruikersauthenticatie in Django

Django biedt een ingebouwd authenticatiemechanisme dat naadloze samenwerking tussen ontwikkelaars mogelijk maakt. Desalniettemin maakt het gebruik van conventionele authenticatie, waardoor gebruikers handmatig informatie moeten invoeren zoals gebruikersnamen, e-mails, wachtwoorden, voor- en achternamen.

Django’s standaard authenticatiesysteem heeft een basisstructuur die verschillende geavanceerde functies mist die vaak voorkomen in hedendaagse web authenticatie frameworks. Daarom wordt het sterk aangeraden om extra componenten, zoals de django-allauth bibliotheek, die de functionaliteit kunnen aanvullen en verbeteren.

Hoe OAuth in Django in te schakelen

Om gebruikersauthenticatie te valideren binnen een Django-project met behulp van het OAuth-protocol, kan men de Django-bibliotheek gebruiken die bekend staat als “django-allauth.

Django Allauth is een application programming interface ontworpen om gebruikersauthenticatie, registratie en accountbeheerprocessen te stroomlijnen binnen een Django-webontwikkelingsraamwerk. Volg de uitgebreide instructies hieronder om deze functionaliteit in uw Django-project te implementeren.

Stap 1: Django-Allauth installeren en instellen

Als u dit nog niet hebt gedaan, is het aan te raden om een virtuele omgeving te creëren en Django-allauth te installeren met pip. Dit maakt de integratie van allauth in uw Django-project mogelijk.

 pip install django-allauth

Houd er rekening mee dat deze functie alleen compatibel is met Python versies 3.5 of hoger, evenals Django frameworks versie 2.0 of hoger.

Stap 2: Voeg de benodigde applicaties toe aan Django voor Django-Allauth

Na de installatie van de ‘django-allauth’ bibliotheek, is het noodzakelijk om het configuratiebestand in het project aan te passen door een lijst met applicaties toe te voegen in de “INSTALLED\_APPS” parameter in het “settings.py” bestand. Specifiek moet de naam van de applicatie worden toegevoegd, evenals eventuele aanvullende afhankelijkheden die nodig zijn voor de goede werking ervan.

 INSTALLED_APPS = [

    """
    Add your other apps here
    """

    # Djang Allauth configuration apps
    'django.contrib.sites',
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
]

Er moet rekening worden gehouden met een aantal belangrijke overwegingen met betrekking tot de bovengenoemde toepassingen, waaronder hun functies en mogelijkheden.

De toepassing allauth.socialaccount maakt gebruikersauthenticatie mogelijk via verschillende sociale platforms, waaronder, maar niet beperkt tot, X (voorheen bekend als Twitter), Instagram en GitHub.

⭐ De app django.contrib.sites is een ingebouwd Django-raamwerk dat nodig is om django-allauth te laten werken. De app biedt de mogelijkheid om meerdere sites binnen een enkel Django-project te beheren en te differentiëren. U kunt begrijpen hoe het werkt door de Django documentatie te raadplegen .

Stap 3: Definieer de Authenticatie Backends voor uw project

Om een gebruikersauthenticatiesysteem op te zetten, is het nodig om de gewenste verificatiemethode voor gebruikers te specificeren. Dit kan worden bereikt door de configuratie van AUTHENTICATION\_BACKENDS in het bestand settings.py aan te passen. Specifiek voor degenen die de django-allauth bibliotheek gebruiken, wordt het aanbevolen om de bovengenoemde componenten op te nemen.

 AUTHENTICATION_BACKENDS = [
    'django.contrib.auth.backends.ModelBackend',
    'allauth.account.auth_backends.AuthenticationBackend',
]

De meegeleverde code creëert een raamwerk voor het implementeren en gebruiken van meerdere authenticatiemechanismen binnen een applicatie, door het definiëren en configureren van twee verschillende backend componenten, namelijk “LOCAL” en “REMOTE”, die dienen als basis voor het afhandelen van authenticatieverzoeken van gebruikers. Deze backends zijn ontworpen om eenvoudig te integreren met verschillende frontend frameworks en diensten, waardoor ontwikkelaars naadloos flexibele en veilige authenticatieopties in hun applicaties kunnen opnemen.

De standaardinstelling is de standaardoptie van Django, die de administratieve gebruiker toegang geeft tot het admin-dashboard, ongeacht eventuele configuraties via django-allauth.

Django-Allauth, een Django-applicatie die gebruikersregistratie en inloggen op meerdere accounts stroomlijnt via diensten van derden zoals e-mail/OAuth2-providers, heeft een backend voor authenticatie nodig om effectief te kunnen functioneren.

Stap 4: Voeg uw site-ID toe

Om uw website goed te configureren, is het essentieel om een unieke identificatiecode, bekend als de site-ID, op te nemen in uw instellingenbestand. Ter illustratie laat het volgende codefragment zien hoe dit kan worden bereikt:

 SITE_ID = 1

De standaardconfiguratie van het administratieve dashboard bevat een vermelding voor " http://example.com “. Gebruikers hebben de mogelijkheid om deze instelling te wijzigen of desgewenst een nieuwe website te maken. Hiervoor moeten ze zich aanmelden bij hun account en naar de toepassing “Sites” gaan in het configuratiescherm.

Voer de volgende stappen uit om de site-ID op te halen die is gekoppeld aan een bepaalde Django-site met behulp van de opdrachtregelinterface:1. Start de opdrachtprompt of terminal op uw computer.2Navigeer naar de map waar u het Django-raamwerk hebt geïnstalleerd.3. Voer de volgende opdracht uit in de CLI:csspython manage.py sites -output=fields site_id {uw-site-naam}Vervang {uw-site-naam} door de naam van de specifieke Django-site waarvoor u de ID wilt verkrijgen. De sites beheeropdracht genereert een JSON-bestand met informatie over alle sites die binnen uw Django-project zijn geconfigureerd, inclusief hun bijbehorende ID’s.

 python manage.py shell

Om het bovengenoemde script in de Python-interpreter uit te voeren, moet u het eerst openen en vervolgens de code invoeren. Dit proces kan worden uitgevoerd met behulp van een geïntegreerde ontwikkelomgeving (IDE) of een opdrachtregelinterface (CLI).

 from django.contrib.sites.models import Site

current_site = Site.objects.get_current()
site_id = current_site.id
site_name = current_site.name
print("Site ID:", site_id)
print("Site Name:", site_name)

De bovenstaande code geeft zowel de nomenclatuur als de identifier van de website in kwestie weer.

Stap 5: Configureer uw URL’s

Om Django Allauth te integreren in de URL-configuratie van uw project, moet u er eerst voor zorgen dat er een bestand ‘urls.py’ bestaat in uw projectmap. Als dit niet het geval is, maakt u er een aan en voegt u het benodigde codefragment toe zoals hieronder getoond:pythonfrom django.urls import pathfrom allauth.account.views import SignUpView, SignInViewapp_name = ‘myproject’ # vervang door uw projectnaamurlpatterns = [path(‘signup/’, SignUpView.as_view(), name=‘signup’),path(’login/’, SignInView.as_view(), name=‘login’)]Zorg ervoor dat u 'myproject' vervangt door de werkelijke naam van uw project en indien nodig aanvullende vereiste URL-patronen toevoegt.

 from django.urls import path, include

urlpatterns = [
    # Djang-allauth url pattern
    path('accounts/', include('allauth.urls')),
]

Met deze configuratie kun je je ontwikkelserver starten en toegang krijgen tot http://127.0.0.1:8000/accounts/ in je webbrowser. Wanneer de “DEBUG” instelling is ingesteld op “True”, worden de beschikbare URL-patronen van Django Allauth weergegeven.

Nadat u de eerder beschreven stappen hebt voltooid, is uw project nu voorbereid om sociale authenticatie te ondergaan.

Hoe Google Login/Signup te implementeren in uw Django app

Na de installatie en configuratie van Django-Allauth, zullen gebruikers de mogelijkheid hebben om zich te authenticeren met behulp van hun sociale media-accounts, waaronder die van Google.

Stap 1: Registreer de aanbieder van uw sociale account in uw geïnstalleerde apps

Om een sociale media-account op te nemen in de instellingen van uw applicatie, is het noodzakelijk om het specifieke sociale mediaplatform als geïnstalleerde app op te nemen in de lijst ‘INSTALLED\_APPS’ in het bestand ‘settings.py’ van uw project. Als je bijvoorbeeld Google wilt integreren, voeg je gewoon “Google” toe aan de lijst met geïnstalleerde apps. Op dezelfde manier kunnen andere sociale platforms zoals Instagram of X ook aan deze lijst worden toegevoegd door hun respectieve namen op te nemen.

 INSTALLED_APPS = [

    """
    Add your other apps here
    """

    # Social account provider (google)
    'allauth.socialaccount.providers.google',
]

Stap 2: Maak je klant-ID en geheime sleutel op Google

Om deze taak met succes uit te voeren, is het noodzakelijk dat je een geldige Google-account hebt. Als je er al een hebt, raadpleeg dan de volgende richtlijnen:

⭐ Ga naar de Google Cloud console om een nieuw project aan te maken. Klik eerst op de vervolgkeuzelijst in de onderstaande afbeelding:

⭐ Klik vervolgens op NIEUW PROJECT :

⭐ Voer een naam in voor je project en klik vervolgens op de knop CREËREN:

⭐ Met je project geselecteerd, klik je op het hamburger menu . Selecteer API’s & Services , dan Credentials :

⭐ Klik vervolgens op de optie CONFIGURE CONSENT SCREEN en selecteer External :

⭐ Voer op de volgende pagina een naam in voor je app en voeg waar nodig een e-mail toe. Je kunt ook de configuraties verkennen voor wat aanpassingen. Klik op OPSLAAN EN DOORGAAN als je klaar bent.

⭐ Selecteer in het linkermenu Credentials . Klik daarna op CREATE CREDENTIALS en selecteer OAuth client ID .

⭐ Selecteer vervolgens het applicatietype en voer een naam in. Voor deze tutorial is het applicatietype Webtoepassing .

⭐ Voeg vervolgens URI’s toe voor de geautoriseerde JavaScript-oorsprong en de geautoriseerde redirect URI’s . De host van uw website moet de JavaScript-oorsprongsbron zijn en het systeem zal gebruikers na verificatie omleiden naar de redirect URI. De redirect URI moet normaal gesproken your-host-name/accounts/google/login/callback / bevatten. In de ontwikkelmodus zal het zijn: http://127.0.0.1:8000/accounts/google/login/callback/ . Klik op CREATE als je klaar bent.

⭐ Nadat je de referenties hebt aangemaakt, kun je je Client ID of Client secret kopiëren naar een veilige plaats of ze downloaden als JSON-bestanden.

Stap 3: Voeg uw klant-ID en geheime sleutel toe aan uw Django-app

Nadat u de vereiste toegangsgegevens hebt vastgesteld, gaat u met uw webbrowser naar " http://127.0.0.1:8000/admin " en klikt u vervolgens op “Sociale toepassingen” in het beschikbare menu. Maak vervolgens een nieuwe sociale toepassing door de onderstaande instructies te volgen:

Bij het toevoegen van een nieuwe authenticatieprovider in een softwaretoepassing is het noodzakelijk om de service te specificeren waarmee gebruikers toegang krijgen tot hun accounts. Deze entiteit wordt gewoonlijk een “provider” genoemd en kan variëren afhankelijk van het platform dat wordt gebruikt. Als de applicatie bijvoorbeeld integratie met Google accountgegevens ondersteunt, dan is de toegevoegde provider Google. Als de applicatie verbinding met Snapchat-inloggegevens mogelijk maakt, is de gekozen provider Snapchat.

Natuurlijk help ik je graag bij het bedenken van een geschikte en verfijnde naam voor je nieuwe sociale toepassing. Hier zijn enkele suggesties op basis van uw vereisten:1. SocialMingle - Deze naam suggereert dat gebruikers via het platform contact kunnen leggen en zich kunnen mengen met anderen. Het is pakkend en gemakkelijk te onthouden.2. ConnectionsHub - Deze naam impliceert dat de app dient als een centrale hub waar mensen met elkaar in contact kunnen komen. Het klinkt professioneel en betrouwbaar.3. FriendFinderX - Deze naam zou goed kunnen werken als je app zich richt op het helpen van mensen bij het vinden van vrienden of potentiële romantische partners. Houd echter rekening met de connotatie, die mogelijk niet geschikt is voor alle doelgroepen.4. LinkUpNow - Deze naam benadrukt het idee van

Gelieve een veilig en vertrouwelijk klantgeheim van Google op te geven, dat zal worden gebruikt als encryptiesleutel voor onze gevoelige informatie-uitwisseling.

Het verificatieproces met Google wordt niet beïnvloed door het opgegeven sleutelveld en moet worden genegeerd.

Kies uiteindelijk een platform waarop de social media tool wordt geïntegreerd.

Stap 4: Test uw Google-authenticatie

Meld u af bij uw beheerinterface en ga vervolgens naar http://127.0.0.1:8000/accounts/login/ . Op deze pagina ziet u een login-optie beschikbaar via Google.

Klik op de bovenstaande optie om naar het toestemmingsscherm te gaan. Selecteer daar een geschikt account om verder te gaan met inloggen.

Na selectie van een bepaalde account wordt men doorgestuurd naar http://127.0.0.1:8000/accounts/profile/ (hierna te noemen “de bestemmings-URL”), die dient als bewijs van de succesvolle werking van de applicatie. Daarnaast is het voor gebruikers mogelijk om gepersonaliseerde sjablonen te ontwikkelen die afwijken van de standaardset om beter aan te sluiten bij hun voorkeuren en vereisten.

Gebruikersregistratie verbeteren met sociale authenticatie in Django

Sociale authenticatie kan de registratie-ervaring van gebruikers binnen uw applicatie aanzienlijk verbeteren. Hoewel er alternatieve methoden bestaan om authenticatie in Django mogelijk te maken, zou het verstandig zijn om hun geschiktheid te overwegen op basis van uw specifieke vereisten.