앞서서 로그인에 관해 공부했었다. 이것 외에 Django는 소셜 로그인 기능도 사용할 수 있다.
소셜로그인은 구글, 네이버 등의 ID를 가지고 로그인을 할 수 있게 만들어주는 기능이다.
우리는 여기서 구글 로그인 기능을 구현해볼 것이다.
우선 가장먼저 소셜로그인 기능을 제공해주는 social-auth-app-django를 cmd창을 통해 다운로드 받는다.
pip install social-auth-app-django를 cmd창에 입력한다.
그리고 나서 settings.py에서 Social 로그인 설정을 진행해주면된다. 우선 INSTALLED_APPS에 추가부터
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'vote',
'customlogin',
'social_django', #소셜로그인에 관련된 처리를 하는 어플리케이션
]
새로 AUTHENTICATION_BACKENDS를 새로 추가시키고 다음과 같이 작성해준다.
AUTHENTICATION_BACKENDS=(
'social_core.backends.open_id.OpenIdAuth', #구글 로그인 처리를 위한 파이썬 클래스
'social_core.backends.google.GoogleOpenId',
'social_core.backends.google.GoogleOAuth2',
'social_core.backends.google.GooglePlusAuth',
'django.contrib.auth.backends.ModelBackends', #소셜로그인 정보를 User 모델 클래스에 저장
)
소셜로그인은 사용자가 구글 ID로 로그인 시, 정보를 구글로부터 받아야한다. 그러기위해서 우선적으로 구글로부터 키를 받을 필요가 있다.
키를받기위해 console.developers.google.com(구글 개발자 사이트)로 들어간다.
사이트에 들어가면 프로젝트를 클릭하여
새 프로젝트를 만들어준다.
이름을 정해주고 만들기를 눌러 새 프로젝트르 만들어주고
라이브러리에 들어가서
google+를 검색하여 google+API를 선택하고
사용설정을 눌러준다.
이제 사용자 인증 정보의 OAuth 동의 화면 탭에서 임의로 이름을 정해주고
사용자 인증 정보탭에서 사용자 인증 정보를 만들기를 클릭하면
다음과 같은 화면이 나온다. 여기서 OAuth 클라이언트 ID를 선택하고
웹 애플리케이션을 체크해주고
승인된 리디렉션의 www.example.com 부분에 위와 같이 http://127.0.0.1:8000/auth/complete/google-plus로 새로만들어준다.
만들어진 웹 클라이언트 2를 클릭하면
클라이언트 ID와 보안 비밀이 있다.
나온 클라이언트 ID와 보안 비밀을 settings.py에 다음과 같이 입력해준다.
SOCIAL_AUTH_GOOGLE_PLUS_KEY = "클라이언트 ID" #클라이언트 ID를 사이에 입력
SOCIAL_AUTH_GOOGLE_PLUS_SECRET = "보안비밀" #보안 비밀을 사이에 입력
입력 후에는 설정 사항을 저장해줄 필요가 있다.
migrate를 통해 설정사항을 저장해준다.
또한 url을 추가해줄 필요가 있다. 메인 project(netdream)의 urls.py에 들어가서 social 로그인 관련 url을 수정해준다.
urlpatterns = [
path('admin/', admin.site.urls),
path('vote/', include('vote.urls')),
path('cl/', include('customlogin.urls')),
path('auth/', include('social_django.urls', namespace='social')),
#auth의 이름으로 social로그인을 실행시켜준다.
#namespce를 social로 지정해주는 것은 하위 url에서 app_name='social'을 해주는 것과 같은 의미다.
]
이제 social 로그인 하이퍼 링크를 지정해줄 차례이다.
로그인을 담당하는 앞서 만든 signin.html에 다음과 같이 추가를 해줄 필요가 있다.
</form>
<a href="{% url 'social:begin' 'google-plus' %}">구글로 로그인하기</a>
<!-- 구글 소셜 로그인 하이퍼 링크 -->
<a href="{% url 'login:signup' %}">회원가입</a>
마지막 단계로 settings.py에서 template 부분에 다음과 같이 추가를 해주며,
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',
'social_django.context_processors.backends', #social 로그인 관련 template 추가부분
'social_django.context_processors.login_redirect',
],
REDIRECT_URL을 지정해준다.
LOGIN_REDIRECT_URL = '/vote/' #REDIRECT_URL에는 로그인 후 이동할 페이지를 지정해준다.
그러고나면 Social 로그인이 가능한 것을 확인할 수 있다.
구글로 로그인하기를 누르면 연동과정이 나온다. 해당 연동 과정을 마치고 나면
구글계정의 이름이 화면에 뜨는 것을 확인할 수 있다.
