<배운 지식>
1. 로그인 회원가입 로그아웃을 구현하는 과정
2. 회원가입 , 로그인 , 로그아웃을 구현하기 위해 내장된 장고 Class
# 회원가입에 사용되는 User class를 가져와준다. 장고에서 기본제공하는 기능
from django.contrib.auth.models import User
# 유저권한에 관련된 auth class를 가져온다.
from django contrib import auth
3. {% csrf_token %} : 난수 발생시켜 올바른지 확인 보안을 위해서 사용한다.
1. 프로젝트 생성하기 , App 생성하기
우선 VSCode를 실행시켜서 디렉토리를 만들고 터미널 창을 켜준다.
가상환경을 키고 장고를 설치한다. ( Mac 환경 )
# 가상환경 설치
virtualenv venv
# 가상환경 실행
source venv/bin/activate
# 장고 설치
pip install django
이제 장고프로젝트를 생성해준다. ( 프로젝트 이름은 loginproject )
django-admin startproject loginproject
2. Login App 만들기 ( 기능구현 전 작업 )
app 만들고 장고프로젝트와 연결해주기
프로젝트 폴더가 성공적으로 만들어지면 폴더 경로로 들어가자. 이제 새로운 앱을 만들어 준다. ( 앱 이름은 loginapp)
python manage.py startapp loginapp
그리고 프로젝트 폴더의 setting.py에 가서 설치된 app목록에 loginapp을 추가해준다.
INSTALLED_APPS = [
'loginapp',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
urls.py 만들기
URL을 장고프로젝트에서 모두 관리하기 보단, App에서 urls.py를 만들어 관리해 줍시다.
필수 작업은 아니지만 습관들이면 관리하기 아주 편합니다.
앱 폴더에 urls.py를 만들어 줍니다.
다음과 같이 적어줍니다,
loginapp/urls.py
from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [
path('signup/', views.signup, name='signup'),
path('', views.login, name='login'),
path('home/', views.home, name='home'),
]
세가지 url을 만즐어 줍니다.
1. 회원가입, url
2. 로그인 url
3. 로그인에 성공하면 뜨는 url (위에서 home이라고 이름 붙인url)
이제 프로젝트 폴더에 있는 urls.py로 가서 앱에 있는 urls.py를 연결합니다.
import include 해주고 다음과 같이 사용합니다.
loginproject/urls.py
from django.contrib import admin
from django.urls import path, include
import loginapp.views
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('loginapp.urls')),
]
App 안에 template 만들기
로그인 앱을 구현하기 위해서 총 3개 html 페이지를 만들어 줘야합니다.
(로그인 페이지, 회원가입 페이지, 로그인 성공하면 보여주는 페이지)
loginapp에 가서 templates 폴더를 만들어 준 뒤 signup.html , login.html, home.html 페이지를 만듭니다.
signup.html
<h1>회원가입 페이지. </h1>
<form>
Username:
<br>
<input name='username' type='text' value=''>
<br>
Password:
<br>
<input name='Password1' type="password" value=''>
<br>
Confirm Password:
<br>
<input name='Password2' type="password" value=''>
<br>
<input class='btn btn-primary' type="submit" value="Sign Up!">
</form>
login.html
<h1>로그인 페이지</h1>
<form>
Username:
<br>
<input name='username' type='text' value=''>
<br><br>
Password:
<br>
<input name='Password' type="password" value=''>
<br><br>
<input class='btn btn-primary' type="submit" value="Login">
</form>
home.html
<h1>로그인에 성공했네?ㅋㅋ</h1>
App에 view 만들기
우리가 만든 페이지를 연결해두는 것만 만듭니다.
views.py
from django.shortcuts import render
# Create your views here.
def signup(request):
return render(request, 'signup.html')
def login(request):
return render(request, 'login.html')
def home(request):
return render(request, 'home.html')
일단 이렇게 틀 만 맹글어 놓읍시다.
3. 기능 구현하기
templates 수정하기
signup.html
1. signup.html 에서 form 태그에서 받은 데이터를 POST로 받고 login.html에 넘기게 합니다.
<form action="{% url 'signup' %}" method="POST" >
2. csrf token을 템플릿언어로 추가해 보안을 강화해봅니다. ( 뭔가 해봄직한 첨가물. 궁금하면 검색 ㄲ)
{% csrf_token %}
바뀐 결과는 간단합니다.
signup.html
<h1>회원가입 페이지. </h1>
<form action="{% url 'signup' %}" method="POST" >
{% csrf_token %}
Username:
<br>
<input name='username' type='text' value=''>
<br>
Password:
<br>
<input name='password1' type="password" value=''>
<br>
Confirm Password:
<br>
<input name='password2' type="password" value=''>
<br>
<input class='btn btn-primary' type="submit" value="signup">
</form>
login.html
signup 페이지와 마찬가지로 1,2번을 추가합니다.
추가로 error가 뜨면 error가 나오게 하고, 회원가입 페이지로 갈 수 있는 a태그도 추가합니다.
바뀐결과는
<h1>로그인 페이지</h1>
{% if error %}
{{ error }}
<br>
<br>
{% endif %}
<h1>Login</h1>
<form method="POST" action="{% url 'login'%}">
{% csrf_token %}
Username:
<br>
<input name="username" type="text" value="">
<br>
Password:
<br>
<input name="password" type="password" value="">
<br>
<br>
<input class="btn btn-primary" type="submit" value="Login">
</form>
<a href="{% url 'signup' %}" method = 'POST' > 회원가입</a>
home.html 은 지금이 멋있으니깐 그대로 둡시다.
views.py 수정하기
우선 로그인 로그아웃에 관련된 함수를 쓰기 위해 다음과 같이 import해줍니다.
from django.shortcuts import render, redirect
from django.contrib.auth.models import User
from django.contrib import auth
signup 함수 수정하기
로그인 회원가입 기능은 장고의 내장 함수가 있습니다.
예를 들면 로그인을 하는 함수는
auth.login(request, user)
유저를 만드는 함수는
User.objects.create_user()
이 함수를 이용해서 username 과 password1를 post로 받아 저장하는 하는 함수를 만든다면
user = User.objects.create_user(
username=request.POST['username'],
password=request.POST['password1']
)
위에 함수를 이용해 signup 결과는
def signup(request):
if request.method == "POST":
if request.POST['password1'] == request.POST['password2']:
user = User.objects.create_user(
username=request.POST['username'],
password=request.POST['password1']
)
auth.login(request, user)
return redirect('home')
return render(request, "signup.html")
login 함수 수정하기
내장 함수를 사용하면 됩니다.
auth.authenticate() : 등록된 회원인지 확인
auth.login(request,user) : 로그인
위 함수를 사용한 코드결과는
def login(request):
if request.method == "POST":
username = request.POST['username']
password = request.POST['password']
user = auth.authenticate(
request, username=username, password=password
)
if user is not None:
auth.login(request, user)
return redirect('home')
else:
return render(request, "login.html", {
'error': 'Username or Password is incorrect.',
})
else:
return render(request, "login.html")
4. 로그아웃 만들기
urls.py 추가하기
로그인 앱에 있는 urls.py에 추가해줍니다.
from django.contrib import admin
from django.urls import path
from . import views
urlpatterns = [
path('signup/', views.signup, name='signup'),
path('', views.login, name='login'),
path('home/', views.home, name='home'),
path('logout/', views.logout, name='logout'),
]
views.py 추가하기
내장된 로그아웃 함수는 auth.logout(request)
def logout(request):
if request.method == 'POST':
auth.logout(request)
redirect('home')
return render(request,'login.html')
template 추가하기
로그인에 성공한 화면인 home.html 에서 a테그와 템플릿 언어를 통해 로그인 버튼을 구현해 봅니다.
<h1>로그인에 성공했네?ㅋㅋ</h1>
<a href="{% url "logout" %}">로그아웃하기</a>