로그인 후 엑셀파일을 올려 계산 및 정리해주는 사이트를 django로 구현해보자.
0-1. 프로젝트 알고리즘
0-2. 로그인 기능 logic
- 사용자가 가입창에서 정보 입력 후 ’회원가입하기’ 클릭
- 입력 정보로 유저 데이터 생성, 아직은 인증되지 않은 유저로 등록 DB에 저장
- 사용자가 입력한 이메일 주소로 인증 코드 발송
- 발송된 인증 코드는 유저 이름과 함께 쿠키로 저장 후 인증 코드 입력 화면으로 전환
- 인증 코드 입력 화면에서 인증 코드 입력 후 ’인증하기’ 버튼을 클릭하면 입력된 코드와 쿠키에 저장된 인증 코드 비교 후 회원 성공/실패 처리
- 인증 성공시 인증된 유저로 DB에 저장 cookie를 session으로 변경후 cookie 삭제 로그인 화면으로
- 실패 시 인증코드 확인 페이지 다시 띄우기
- 로그인 성공시 파일 올리는 사이트로
- 로그인 실패시 로그인 실패 사이트로
1. 프로젝트 구현을 위한 세팅
가상환경 생성 및 라이브러리 설치
$ Virtualenv venv가상환경 생성 (virtualenv가 없다면, ‘pip install virtualenv’ 실행)
$ source venv/Scripts/activate
가상환경 실행 (해당 경로에 venv 폴더가 있어야함)
$ which python가상환경 여부 확인
실습에 필요한 여러가지 패키지들을 한꺼번에 설치하기 위해 'requirements.txt' 파일을 생성한다.
django
openpyxl
pandas
jinja2
pandasrequirements.txt 파일 내용 (작성 후 저장)
$ pip install -r requirements.txt'requirements.txt' 파일을 읽어들여 필요한 패키지 설치
2. 프로젝트 시작 및 App 구성
$ django-admin startproject ExcelCalculateExcelCalculate 프로젝트 생성
$ cd ExcelCalculate
$ python manage.py startapp main
$ python manage.py startapp sendEmail
$ python manage.py startapp calculate프로젝트 폴더로 이동 후, main, sendEmail, calculate 3개의 APP 생성
- main : 페이지 구현, 로그인/아웃 기능, 엑셀 파일 업로드 기능
- sendEmail : 회원 가입 시, 인증 코드 메일로 발송
- calculate : 업로드된 엑셀 파일을 읽어 계산 후 요약
기존에 만든 3개의 app을 settings.py에 등록시켜준다.
ExcelCalculate > ExcelCalculate > settings.py
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'main',
'sendEmail',
'calculate'
]main', 'sendEmail', 'calculate' (추가)
3. 세션을 활용한 로그인을 위한 설정
쿠키는 사용자의 브라우저에 저장되어 있어서 개인정보 유출이나 해킹의 우려가 있다.
쿠키는 관리자가 통제할 수 있는 세션으로 변경해준 다음 삭제해준다.
'django.contrib.sessions'
'django.contrib.sessions.middleware.SessionMiddleware'파일에 위 두 부분이 있는 지 확인하고 없으면 적어준다.
4. Gmail사용을 위한 SMTP 설정
# Email Settings
EMAIL_BACKEND = 'django.core.mail.backends.smtp.EmailBackend'
EMAIL_HOST = 'smtp.gmail.com'
EMAIL_USE_TLS = True
EMAIL_PORT = 587
EMAIL_HOST_USER = '이메일아이디@gmail.com'
EMAIL_HOST_PASSWORD = '앱 비밀번호'위 내용 (+추가)
Gmail 사용 가이드는 아래 이전 글을 확인바란다.
Django로 Gmail 보내기
1. 가상환경 및 django 프레임워크 설치 먼저 빈 폴더를 생성 후, 가상환경을 생성한다. (virtualenv 미설치한 경우) $ pip install virtualenv virtualenv 다운 이미 설치가 되어 있다면 아래 코드를 실행해 가상
sim-ds.tistory.com
5-1. templates HTML 파일 추가 (main)
< error.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
<h1>Excel Calculate <small>with Django</small></h1>
</div>
</div>
<div class='body'>
<h1>오류가 발생했어요 :'(</h1>
<h4>{{ message }}</h4>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< index.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.content{
height: 75%;
}
.messageDiv{
margin-top: 20px;
margin-bottom: 50px;
}
.custom-btn{
font-size: 10px;
}
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<h1>Excel Calculate <small>with Django</small><a href="logout" class="btn btn-danger btn-xs" style="margin-left: 30px">로그아웃</a></h1>
</div>
</div>
<div class="content">
<div class="fileInputDiv">
<form action="calculate/" method="POST" enctype="multipart/form-data">{% csrf_token %}
<div class="input-group">
하단 버튼을 통해 파일을 업로드 해주세요.(.xlsx 확장자의 파일만 가능합니다.)<br>
<input id="fileInput" name="fileInput" type="file" class="form-control">
<input type="submit" class="btn btn-success btn-lg" value="파일 제출">
</div>
</form>
</div>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< loginFail.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
<h1>Excel Calculate <small>with Django</small></h1>
</div>
</div>
<div class='body'>
<h1>로그인 실패</h1>
<h4>아이디 또는 비밀번호가 틀렸습니다. 로그인을 다시 시도해주세요.</h4>
<a href="/signin" class="btn btn-success btn-xs" style="margin: 10px">로그인 하기</a>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< result.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.content{
height: 75%;
}
.messageDiv{
margin-top: 20px;
margin-bottom: 50px;
}
.custom-btn{
font-size: 10px;
}
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
<h1>Excel Calculate <small>with Django</small></h1>
</div>
</div>
<div class='body'>
<div class="resultDiv">
<h3> * Excel 결과 확인 </h3><br>
<h4> [grade별 최솟값, 최댓값, 평균값] </h4>
{% if grade_calculate_dic %}
{{ grade_calculate_dic.grade_df|safe }}
{% endif %}
<hr>
<br>
<h4> [이메일별 주소 도메인 인원] </h4>
{% if email_domain_dic %}
{{ email_domain_dic.email_df|safe }}
{% endif %}
<br>
</div>
<hr>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< signin.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.content{
height: 75%;
}
.messageDiv{
margin-top: 20px;
margin-bottom: 50px;
}
.custom-btn{
font-size: 10px;
}
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<h1>
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
Excel Calculate <small>with Django</small>
</h1>
</div>
</div>
<div class="content">
<div class="mainDiv">
<h3>안녕하세요. 로그인을 진행해주세요.</h3><br>
<form action="signin/login" method="POST">{% csrf_token %}
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">이메일</span>
<input type="email" name='loginEmail' class="form-control" placeholder="이메일을 적어주세요." aria-describedby="basic-addon1">
</div><br>
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">비밀번호</span>
<input type="password" name='loginPW' class="form-control" placeholder="비밀번호를 적어주세요." aria-describedby="basic-addon1">
</div><br>
<input type="submit" class="btn btn-success btn-lg" value="로그인">
</form>
<a href="signup">회원가입하기</a>
</div>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< signup.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.content{
height: 75%;
}
.messageDiv{
margin-top: 20px;
margin-bottom: 50px;
}
.custom-btn{
font-size: 10px;
}
.panel-footer{
height:10%;
color:gray;
}
.userInfoInputDiv{
text-align: center;
}
</style>
<script>
function submit_click(){
var pw = document.getElementById('signupPW').value
var pwcheck = document.getElementById('signupPWcheck').value
if(pw == pwcheck){
document.getElementById('signup-form').submit();
}else{
alert("비밀번호가 일치하지 않습니다.")
document.getElementById('signupPWcheck').focus()
}
}
</script>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
<h1>Excel Calculate <small>with Django</small>
</h1>
</div>
</div>
<div class="content">
<div class="userInfoInputDiv">
<h1> 회원가입 하기 </h1><br>
<form action="signup/join" method="POST" id="signup-form">{% csrf_token %}
<div class="input-group">
<span class="input-group-addon">이름</span>
<input id="signupName" name='signupName' type="text" class="form-control" placeholder="이름을 적어주세요." aria-describedby="basic-addon1">
</div><br>
<div class="input-group">
<span class="input-group-addon">이메일</span>
<input id="signupEmail" name='signupEmail' type="email" class="form-control" placeholder="이메일을 적어주세요." aria-describedby="basic-addon1">
</div><br>
<div class="input-group">
<span class="input-group-addon">비밀번호</span>
<input id="signupPW" name='signupPW' type="password" class="form-control" placeholder="비밀번호를 적어주세요." aria-describedby="basic-addon1">
</div><br>
<div class="input-group">
<span class="input-group-addon">비밀번호 확인</span>
<input id="signupPWcheck" name='signupPWcheck' type="password" class="form-control" placeholder="비밀번호 적어주세요." aria-describedby="basic-addon1">
</div><br>
<input type="button" class="btn btn-primary btn-lg" id="btn-submit" onclick="submit_click();" value="회원가입하기">
</form>
</div>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
< verifyCode.html >
<html lang="ko">
<head>
<meta charset="UTF-8">
<!-- Boot strap -->
<!-- 합쳐지고 최소화된 최신 CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- 부가적인 테마 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- 합쳐지고 최소화된 최신 자바스크립트 -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<style>
.content{
height: 75%;
}
.messageDiv{
margin-top: 20px;
margin-bottom: 50px;
}
.custom-btn{
font-size: 10px;
}
.panel-footer{
height:10%;
color:gray;
}
</style>
<title>Excel Calculate</title>
</head>
<body>
<div class="container">
<div class="header">
<div class="page-header">
<h1>
<a href="/" class="btn btn-default btn-xs" style="margin: 10px">메인화면</a>
Excel Calculate <small>with Django</small>
</h1>
</div>
</div>
<div class="content">
<div class="mainDiv">
<h4>회원가입을 위해 입력하신 이메일로 인증코드를 보냈습니다.</h4>
<h3>이메일로 전송된 메일의 인증코드를 입력해주세요.</h3><br>
<form action="verify" method="POST">{% csrf_token %}
<div class="input-group">
<span class="input-group-addon" id="basic-addon1">인증코드</span>
<input name='verifyCode' type="text" class="form-control" placeholder="인증코드를 적어주세요." aria-describedby="basic-addon1">
</div><br>
<input type="submit" class="btn btn-success btn-lg" value="인증하기">
</form>
</div>
</div>
<div class="panel-footer">
실전예제로 배우는 Django. Project3-ExcelCalculate
</div>
</div>
</body>
</html>
7개의 HTML 파일을 main > templaters > main 경로에 생성
5-2. templates HTML 파일 추가 (sendEmail)
< email_format.html >
<html >
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>ExcelCalculate 회원가입</h1>
<p>아래의 인증코드를 입력해주세요.</p>
<h2>{{ verifyCode }}</h2>
</body>
</html>HTML 파일을 sendEmail > templaters > sendEmail 경로에 생성
6. 프로젝트 urls.py 설정
ExcelCalculate > ExcelCalculate > urls.py
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('email/', include('sendEmail.urls'), name="email"),
path('calculate/', include('calculate.urls'), name="calculate"),
path('', include('main.urls'), name="main"),
path("admin/", admin.site.urls),
]urlpatterns 에서 경로(path) 추가
7. App의 urls.py & views.py 설정
(1) sendEmail
ExcelCalculate > sendEmail > urls.py 파일 생성 및 아래 코드 작성
from django.urls import path
from . import views
urlpatterns = [
path('send', views.send, name='email_send'),
]url에 send가 붙었을때, SendEmail 앱의 views.py 파일의 send 함수로 처리
ExcelCalculate > sendEmail > views.py 아래코드 작성
from django.shortcuts import render
from django.http import HttpResponse
from django.core.mail import send_mail, EmailMessage
from django.template.loader import render_to_string
# Create your views here.
def send(receiverEmail, verifyCode):
try:
content = {'verifyCode':verifyCode}
msg_html = render_to_string('sendEmail/email_format.html',content)
msg = EmailMessage(subject="인증코드 발송 메일",body=msg_html,from_email="djangoemailtester001@gmail.com",bcc=[receiverEmail])
msg.content_subtype='html'
msg.send()
return True
except:
return False[ send 함수의 역할 ]
- 인증코드를 사용자 메일로 보냄 정상 작동시 True
- 오류 발생시 False
(2) calculate
ExcelCalculate > calculate > urls.py 파일 생성 및 아래 코드 작성
from django.urls import path
from . import views
urlpatterns = [
path('', views.calculate, name='calculate_do'),
]url이 ~/calculate 일때 calculate 앱의 views.py 파일의 calculate 함수 참조
ExcelCalculate > calculate > views.py 코드 작성
from django.shortcuts import render
from django.http import HttpResponse
# Create your views here.
def calculate(request):
return HttpResponse("calculate, calculate function!")지금 당장은 동작 확인만 되게 코드를 작성한다.
(3) main
ExcelCalculate > main > urls.py 파일 생성 및 아래 코드 작성
from django.urls import path
from . import views
urlpatterns = [
path('', views.index, name='main_index'),
path('signup', views.signup, name='main_signup'),
path('signup/join', views.join, name='main_join'),
path('signin', views.signin, name='main_signin'),
path('signin/login', views.login, name='main_login'),
path('loginFail', views.loginFail, name='main_loginFail'),
path('verifyCode', views.verifyCode, name='main_verifyCode'),
path('verify', views.verify, name='main_verify'),
path('result', views.result, name='main_result'),
path('logout', views.logout, name='main_logout')
]( 경로 설명)
기본
- ‘~/main’ url에서 views.py (main 앱에 있는 파일 이하 동문)의 index 함수 참조
회원가입
- ‘signup’url에서 views.py의 signup 함수 참조
- ‘signup/join’ url에서 views.py의 join 함수 참조
로그인
- ‘signin’ url에서 views.py의 signin 함수 참조
- ‘signin/login’ url에서 views.py의 login 함수 참조
로그인 실패
- ‘loginFail’ url에서 views.py의 loginFail 함수 참조
인증코드 확인
- ‘verifyCode’ url에서 views.py의 verifyCode 함수 참조
- ‘verify’ url에서 views.py의 verify 함수 참조
결과
- ‘result’ url에서 views.py의 result 함수 참조
로그아웃
- ‘logout’ url에서 views.py의 logout 함수 참조
ExcelCalculate > main > views.py 아래 코드 작성
from django.shortcuts import render, redirect
from random import *
from .models import *
from sendEmail.views import *
import hashlib
# Create your views here.
def index(request):
if 'user_name' in request.session.keys():
return render(request, 'main/index.html')
else:
return redirect('main_signin')
def signup(request):
return render(request, 'main/signup.html')
def join(request):
print(request)
name = request.POST['signupName']
email = request.POST['signupEmail']
pw = request.POST['signupPW']
# pw encryption
encoded_pw = pw.encode()
encrypted_pw = hashlib.sha256(encoded_pw).hexdigest()
user = User(user_name = name, user_email = email, user_password = encrypted_pw)
user.save()
code = randint(1000, 9999)
response = redirect('main_verifyCode')
response.set_cookie('code',code)
response.set_cookie('user_id',user.id)
# 이메일 발송 함수 호출
send_result = send(email,code)
if send_result:
return response
else:
content = {'message':'이메일 발송에 실패하였습니다.'}
return render('main/error.html',content)
def signin(request):
return render(request, 'main/signin.html')
def login(request):
loginEmail = request.POST['loginEmail']
loginPW = request.POST['loginPW']
try:
user = User.objects.get(user_email = loginEmail)
except:
return redirect('main_loginFail')
# 사용자가 입력한 PW 암호화
encoded_loginPW = loginPW.encode()
encrypted_loginPW = hashlib.sha256(encoded_loginPW).hexdigest()
if user.user_password == encrypted_loginPW:
request.session['user_name'] = user.user_name
request.session['user_email'] = user.user_email
return redirect('main_index')
else:
return redirect('main_loginFail')
def loginFail(request):
return render(request, 'main/loginFail.html')
def logout(request):
del request.session['user_name']
del request.session['user_email']
return redirect('main_signin')
def verifyCode(request):
return render(request, 'main/verifyCode.html')
def verify(request):
user_code = request.POST['verifyCode']
cookie_code = request.COOKIES.get('code')
if user_code == cookie_code:
user = User.objects.get(id = request.COOKIES.get('user_id'))
user.user_validate = 1
user.save()
response = redirect('main_index')
response.delete_cookie('code')
response.delete_cookie('user_id')
request.session['user_name'] = user.user_name
request.session['user_email'] = user.user_email
return response
else:
redirect('main_verifyCode')
def result(request):
if 'user_name' in request.session.keys():
content = {}
content['grade_calculate_dic'] = request.session['grade_calculate_dic']
content['email_domain_dic'] = request.session['email_domain_dic']
del request.session['grade_calculate_dic']
del request.session['email_domain_dic']
return render(request, 'main/result.html',content)
else:
return redirect('main_signin')
views.py에서 urls.py가 참조하는 각 기능들의 함수를 만들어 준다.
[ index 함수의 역할 ]
- 로그인된 상태라면 파일 업로드 페이지(기본주소) 보여주기
- 로그인된 상태가 아니라면 로그인 페이지 보여주기
[ signup 함수의 역할 ]
- 회원가입 사이트 보여주기
[ join 함수의 역할 ]
- 회원가입시 사용자가 입력한 이름, 이메일, 암호를 받아와 객체에 저장
- 받아온 암호는 인코딩한 후 ‘hashlib’으로 암호화해준다.
- User DB에 정보 저장 후 랜덤 인증 코드 4자리 생성
- 사용자 아이디와 비번을 쿠키로 저장후 이메일을 보낸다.
- 이메일 발송에 성공하면 쿠키정보와 함께 인증코드 입력 페이지로 보냄 동시에 인종 코드 생성 후 사용자의 이메일로 인증 코드를 보내준다.
- 이메일 발송 실패시 에러 페이지 보여줌
[ signin 함수의 역할 ]
- 로그인 화면 보여줌
[ login 함수의 역할 ]
- 로그인 화면에서 사용자가 입력한 이메일과 비밀번호 저장
- 이메일이 인증된 유저 정보 DB에 등록되어있는지 확인, 없으면 로그인 실패 화면으로
- 사용자가 입력한 비밀번호 암호화
- DB에 저장되어 있는 정보와 일치하는지 확인, 일치하면 파일 올리는 페이지로 그렇지 않으면 로그인 실패 화면으로
[ loginFail 함수의 역할 ]
- 로그인 실패 화면을 보여줌
[ logout 함수의 역할 ]
- 로그인 세션 정보 삭제
- 로그인 화면으로 보내기
[ verifyCode 함수의 역할 ]
- 인증코드 입력 화면으로 보냄
[ verify 함수의 역할 ]
- 사용자가 입력한 인증코드를 받아 쿠키로 저장
- 메일로 보낸 인증코드가 사용자가 입력한 인증코드와 일치할 때, 인증된 유저로 변환 및 쿠키 삭제
- 인증코드가 잘못됐을 때 인증코드 입력화면 초기화
[ result 함수의 역할 ]
- 인증된 유저가 세션에 있을 때 계산 결과를 content에 저장
- 기존 세션을 삭제 (개인정보 추적 방지)
- 계산 및 정리 결과 화면 보여줌
- 로그인 된 상태가 아니라면 로그인 화면으로 보냄 (url로 임의접근 차단)
8. 유저 정보 DB 생성
ExcelCalculate > main > models.py 아래 코드 작성
from django.db import models
# Create your models here.
class User(models.Model):
user_name = models.CharField(max_length = 20)
user_email = models.EmailField(unique=True)
user_password = models.CharField(max_length = 100)
user_validate = models.BooleanField(default=False)사용자 계정 정보와 인증 여부를 DB에 저장할 수 있도록 models.py에 클래스 생성
9. Superuser 생성
관리자 페이지를 설정하기 위해서는 superuser를 생성해야한다.
프로젝트 manage.py가 있는 경로에서 다음 명령어들을 차례대로 실행해준다.
$ python manage.py makemigrations
$ python manage.py migrate
$ python manage.py createsuperuser
Username (leave blank to use 'OS계정명'): root
Email address: 아이디@email.com
Password: temp1234!@
Password (again): temp1234!@
Superuser created successfully.root 라는 이름으로 관리자 계정 생성
내 이메일 주소 입력
비밀번호 입력시에는 화면에 표시안되므로 신중하게 치자!
python manage.py runserver서버 실행 후 admin 페이지에 접속한다. ( 127.0.0.1:8000/admin )
10. admin.py 설정
실제 회원 가입 화면에서 알맞은 정보를 입력한 후에 회원 가입 버튼을 누를 시, 실제로 데이터가 잘 저장되었는지 확인하기 위해 admin 페이지를 이용한다.
User 모델에 대해서는 admin 페이지에 등록하지 않았기 때문에 모델에 대한 등록을 먼저 진행한다.
ExcelCalculate > main > admin.py
from django.contrib import admin
from .models import *
# Register your models here.
admin.site.register(User)위 코드 작성
$ python manage.py runserver서버를 실행 한 후 ( http://127.0.0.1:8000/admin )에서 superuser로 로그인 하면, MAIN 카테고리에 Users라는 이름으로 계정 정보 DB와 연동됨.
11. 회원가입 테스트
http://127.0.0.1:8000/signin에서
‘회원가입하기’ 클릭
메일 인증이 가능한 이메일 주소 사용
이름과 비번은 하고싶은대로 생성
‘회원가입하기’ 버튼 누르기
메일을 확인하여 인증코드 확인
인증코드를 입력 후 ‘인증하기’ 버튼 클릭
로그인 성공시 파일 업로드 페이지로 이동
12. 인증된 유저 확인
http://127.0.0.1:8000/admin/에서 MAIN > Users 클릭
User validate 확인 가능.
13. 로그인 실패 테스트
기존 세션에서 로그아웃
아무거나 입력해 일부로 틀려본다.
‘로그인’ 버튼 클릭
실패 시, 위와 같은 화면이 나오면 제대로 구현된 것이다.
'# Coding > Django' 카테고리의 다른 글
| Django의 MTV 패턴 (MVC 패턴과 비교) (0) | 2023.08.21 |
|---|---|
| Django로 엑셀파일 계산 페이지 만들기 (계산 기능 구현) (0) | 2023.08.12 |
| Django로 Gmail 보내기 (0) | 2023.07.29 |
| Django To-do List 사이트 생성 (2) (0) | 2023.07.27 |
| Django To-do List 사이트 생성 (1) (0) | 2023.07.26 |
