[Django파헤치기] Django-allauth 라이브러리를 활용하여 구글 회원가입 및 로그인

2019. 2. 8. 23:24Django 파헤치기

반응형


[Django파헤치기] Django-allauth 라이브러리를 활용하여 구글 ID로 회원가입 구현하기!



※ 저도 공부하면서 업로드 하고 있습니다. 혹시 부족한 부분이 있으면 댓글로 가르쳐주시면 감사하겠습니다!
혹시 질문이 있으셔서 댓글에 남겨주신다면 성실히 답변하겠습니다.



1. 설치

pip install django-allauth

2. Settings.py

INSTALLED_APPS = [

'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',


-------------추가-----------------------------------------------------------------------------


# migrate 할 때 필요
'django.contrib.sites',


# Django-allauth 관련 앱
'allauth',
'allauth.account',
'allauth.socialaccount',


# 사용하고자할 provider 목록 필자는 프로젝트를 진행하면서 Google과 facebook 을 시도해보았다.
'allauth.socialaccount.providers.google',
'allauth.socialaccount.providers.facebook',

----------------------------------------------------------------------------------------------

]

SOCIALACCOUNT_PROVIDERS = {
'google': {
'SCOPE': [
'profile',
'email',
],
'AUTH_PARAMS': {
'access_type': 'online',
}
}
}

TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',

# `allauth` needs this from django
'django.template.context_processors.request',
],
},
},
]
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',

)

여기까지 작성해주고 migrate를 실행하자

python manage.py migrate

migrate를 실행하면 INSTALLED_APP에 작성된 APP들에 대한 데이터베이스 테이블이 만들어진다.


이후 admin 계정을 만들어서 Django에서 제공하는 admin 페이지를 확인해보자

python manage.py createsuperuser

관리자 페이지를 확인해보면 Django-allauth의 라이브러리가 Oauth관련 부분을 제공해준다. 여기서 소셜 어플리케이션을 클릭해서 구글 정보를 입력하자.


제공자에는 INSTALLED_APP에 작성했던 provider들을 제공해주고 있다. 여기서 우리는 클라이언트 아이디와 비밀 키(비밀 키는 다른 유저에게 절대로 노출돼서는 안되므로 가렸습니다.)를 입력하고 Sites에 Oauth를 통해서 로그인 하려고 하는 웹페이지 주소를 적어준다.


여기서 잠깐!!!!!!!!!!!!!!!!!!

클라이언트 아이디와 비밀키를 구하러 가보자.



---------------------------------------------------구글 Client ID, secret key---------------------------------------------------------

구글은 Google Cloud Platform에서 Oauth API 를 제공한다. 해당 페이지에 가입하고 프로젝트를 만들어보자.




이렇게 클라이언트 ID와 보안 키를 GET할 수 있습니다!!!


여기서 끝이 아니구용

위 사진처럼 Google 로 부터 콜백 받을 주소를 적어주셔야합니다!!

이렇게 얻은 클라이언트 ID와 보안키를 관리자 페이지의 소셜 어플리케이션에 입력해주시면

데이터 베이스에 해당 정보들이 입력되게 됩니다.

Django-allauth 라이브러리는 저장된 Client_id와 secret키를 이용하여 구글에게 요청을 합니다.

-----------------------------------------------------------------------------------------------------------------------------------------



다시 settings.py로 돌아와서 SITE_ID를 입력합니다.

SITE_ID = 2

SITE_ID는 아무 번호나 적어주는 것이 아니라 소셜 어플리케이션에 입력했던 sites 정보가 django_site 테이블에 저장되는데 이 id값을 작성해주셔야합니다.





LOGIN_REDIRECT_URL = '/unid/createaccount/' # 로그인 후 돌아올 URL
ACCOUNT_LOGOUT_REDIRECT_URL = "/unid"
ACCOUNT_AUTHENTICATED_LOGIN_REDIRECTS = True

3. urls.py 

urlpatterns = [
url(r'^accounts/', include('allauth.urls')),
]



4. template

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello World!!!!!!!!!!!</title>
</head>
{% load static %}
{% load socialaccount %}
<h2>Hello World!!!!!!!!!!!</h2>
<a href="{% provider_login_url 'google' method='oauth2' %}">     <img style="width:260px" src="{% static 'forTstory/icon/google.png' %}"> </a>
{% for account in user.socialaccount_set.all %}
<p><img width="50" height="50" src="{{ account.get_avatar_url }}"/></p>

<p>UID: <a href="{{ account.extra_data.link }}">{{ account.uid }}</a></p>

<p>email: {{ account.extra_data.email }}</p>
<p>Name: {{ account.extra_data.name }}</p>
<p>Picture: <img sre="{{ account.extra_data.picture }}" width="100" height="100"></p>
{% endfor %}
</body>
</html>


결과




반응형