플라스크 (Flask) - 회원가입 기능 만들기 (MVC 패턴 )

*Flask 회원가입기능 만들기

 

 

*구조 (Structure)

Flask폴더
│   ├── templates (폴더)
│          ├── register.html                                    
│          

├── app.py (실행파일)                                           
├── db.sqlite (이건 자동으로 생성됨)
├── models.py                  

 

* app.py                                  

from flask import Flask, render_template, request, redirect #render_template으로 html파일 렌더링
from models import db
import os
from models import Fcuser
app = Flask(__name__)

@app.route('/')
def hello():
    return render_template("hello.html")
#GET = 페이지가 나오도록 요청. POST = 버튼을 눌렀을때 데이터를 가지고오는 요청/ 요청정보확인하려면 request 임포트 필요
@app.route('/register', methods=['GET','POST'])
def register():
    if request.method == 'GET':
        return render_template("register.html")
    else:
        #회원정보 생성
        userid = request.form.get('userid') 
        username = request.form.get('username')
        password = request.form.get('password')
        re_password = request.form.get('re_password')
        print(password) # 들어오나 확인해볼 수 있다. 


        if not (userid and username and password and re_password) :
            return "모두 입력해주세요"
        elif password != re_password:
            return "비밀번호를 확인해주세요"
        else: #모두 입력이 정상적으로 되었다면 밑에명령실행(DB에 입력됨)
            fcuser = Fcuser()         
            fcuser.password = password           #models의 FCuser 클래스를 이용해 db에 입력한다.
            fcuser.userid = userid
            fcuser.username = username      
            db.session.add(fcuser)
            db.session.commit()
            return "회원가입 완료"

        return redirect('/')

if __name__ == "__main__":
    basedir = os.path.abspath(os.path.dirname(__file__))  # database 경로를 절대경로로 설정함
    dbfile = os.path.join(basedir, 'db.sqlite') # 데이터베이스 이름과 경로
    app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + dbfile
    app.config['SQLALCHEMY_COMMIT_ON_TEARDOWN'] = True     # 사용자에게 원하는 정보를 전달완료했을때가 TEARDOWN, 그 순간마다 COMMIT을 하도록 한다.라는 설정
    #여러가지 쌓아져있던 동작들을 Commit을 해주어야 데이터베이스에 반영됨. 이러한 단위들은 트렌젝션이라고함.
    app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False   # True하면 warrnig메시지 유발, 

    db.init_app(app) #초기화 후 db.app에 app으로 명시적으로 넣어줌
    db.app = app
    db.create_all()   # 이 명령이 있어야 생성됨. DB가


    app.run(host='127.0.0.1', port=5000, debug=True) 

return render_template('xxxx.html') - template 폴더 안의 html파일을 렌더링합니다. 

@app.route('/register', methods=['GET','POST']) - GET 와 POST 두가지 메서드를 허용합니다.

허용하지 않으면 아래 그림처럼 Method Not Allowed 메시지가 발생합니다.

 

 

 추가로 POST, GET은 둘다 정보를 서버로 전달하기위한 기능입니다.

차이점은 GET : 저장된 정보를 단순히 요청할때 사용되며, url에 정보의 이름이 노출됩니다. 

POST : url에 쿼리가 노출되지 않으며, 요청시 데이터 양에 제한이 없습니다.

 

POST는 한마디로 데이터에 수정이 있는경우 (게시글 작성, 회원가입 정보 받기)

GET은 단순히 정보를 보기위한 용도? (게시글 읽기, 회원가입창 보기)

*register.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</head>
<body>
    <div class = "container">
        <div class="row mt-5">
            <h1>회원가입</h1>
        </div>
        <div class="row mt-5">
        <div class="col-12">
            <form method="POST" >
                <div class="form-group">
                    <label for="userid">아이디</label>
                    <input type="text" class="form-control" id="userid" placeholder="아이디" name="userid"/>
                    <!-- id는 삭제해도 되더라. 마지막에 name과 app.py의 get 메소드 사용하는 부분이 일치해야 상응한다 -->
                </div>
                <div class="form-group">
                    <label for="username">사용자 이름</label>
                    <input type="text" class="form-control" id="username" placeholder="사용자 이름" name="username"/>

                </div>
                <div class="form-group">
                    <label for="password">비밀번호</label>
                    <input type="password" class="form-control" id="password" placeholder="비밀번호" name="password"/>
                </div>
                <div class="form-group">
                    <label for="re_password">비밀번호확인</label>
                    <input type="password" class="form-control" id="re_password" placeholder="비밀번호확인" name="re_password"/>
                </div>
                <button type="submit" class="btn btn-primary">등록</button>
            </form>
        </div>
        </div>
</body>
</html>

form은 부트스트랩(bootstrap)을 이용했습니다.

<form method="POST" >: input을 감싸는 태그에 메소드를 표시해줘야 합니다.

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

<input type="text" class="form-control" id="userid" placeholder="아이디" name="userid"/>

 

 

*Models.py (데이터 베이스)

from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy()           #SQLAlchemy를 사용해 데이터베이스 저장

class Fcuser(db.Model): 
    __tablename__ = 'fcuser'   #테이블 이름 : fcuser
    id = db.Column(db.Integer, primary_key = True)   #id를 프라이머리키로 설정
    password = db.Column(db.String(64))     #패스워드를 받아올 문자열길이 
    userid = db.Column(db.String(32))       #이하 위와 동일
    username = db.Column(db.String(8))

 여기까지 만들고 app.py를 파이썬상에서 실행시키면

 

 

다운로드.png

여기까지하면 완성입니다. 아이디, 이름, 비밀번호를 입력한 후, 제출버튼을 누르면 db.sqlite 데이터베이스에 입력됩니다.

*DB로 잘 넘어가는지 확인하기

 

 

(비밀번호는 input type='password' 라서 동그라미로 표시되었으나, 1234로 입력하였습니다.)

제출을 누른뒤 db.sqlite를 열어보겠습니다.

 

 

 

잘 들어간 모습입니다.

[출처] https://infinitt.tistory.com/m/30

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
82 [Python, 인터넷] 네이버 뉴스 기사 크롤링 졸리운_곰 2021.05.23 540
81 [python][flask] webpage-scraper file 졸리운_곰 2021.04.28 314
80 [python][자동화] python으로 카카오톡 자동 메시지 전송 졸리운_곰 2021.04.27 635
79 [python][ip 추적] 영화와 같은 ip 위치 추적 python 소스 IP Radar 2 file 졸리운_곰 2021.04.15 1519
78 [python][jupyter notebook][JSON API] Building a JSON API Using Jupyter Notebooks in Under 5 Minutes file 졸리운_곰 2021.03.28 537
77 Python Flask 프레임워크 이해하기 file 졸리운_곰 2021.03.21 470
76 Python Flask 로 간단한 REST API 작성하기 file 졸리운_곰 2021.03.21 465
75 [python internet, MSA] REST API Development with Flask file 졸리운_곰 2021.03.14 350
74 간단한 Flask, mysql, 파이썬 기반 Open API 웹서버 개발 방법 file 졸리운_곰 2021.03.14 416
73 [python, 인터넷, 인공지능] 다중 사용자를 위한 Jupyterhub 설치Install jupyterhub for multi-user file 졸리운_곰 2021.02.17 331
72 Building beautiful REST APIs using Flask, Swagger UI and Flask-RESTPlus file 졸리운_곰 2021.02.09 517
71 gRPC 뽀개보기 졸리운_곰 2021.01.30 514
70 python으로 gRPC / tools 설치 및 작동시키기 file 졸리운_곰 2021.01.02 390
69 파이썬 플라스크와 MySQL을 사용해 flask, python, mysql file 졸리운_곰 2020.12.29 756
68 flask - apache 연동(mod_wsgi) file 졸리운_곰 2020.12.29 440
67 Continuous Integration Testing For Flask with Jenkins Create a simple flask app 졸리운_곰 2020.12.29 352
66 네이버 사전에 네이버 번역 API 연동하기 (파파고) file 졸리운_곰 2020.11.21 815
65 PS4 프로 자동 구입 매크로 만들기 -5- file 졸리운_곰 2020.11.21 461
64 PS4 프로 자동 구입 매크로 만들기 -4- file 졸리운_곰 2020.11.21 585
63 PS4 프로 자동 구입 매크로 만들기 -3- file 졸리운_곰 2020.11.21 585
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED