FLASK 프레임워크 만들기

1. 개요

간호사 업무 해소 환자 위치 찾기 프로젝트를 제작하던 도중, raspberry를 적극적으로 활용하자는 이야기가 나와서

기존에 eclipse로 제작하던 프로젝트를 FLASK형태로 다시 만들었다.

결과적으로는 다시 eclipse로 돌아가긴 했지만, FLASK 형태로 프로젝트를 만들고 DB와 연동하고 pythonanywhere로 배포하는 경험을 했다.

 

2. 프레임워크 형태

FLASK에서 주의할 점은 static 폴더와 templates 폴더이다.

css, js, img같은 정적 resources들을 이용하려면 static 폴더에 꼭 들어가 있어야하고

html파일은 templates 폴더에 위치해야 한다.

 

또한, 서버를 시작하는 메인 python 파일이 필요하다. 이번 프로젝트에서는 app.py로 지정했다.

 

3. app.py

from flask import Flask, render_template

from flask_mysqldb import MySQL

from GeolcationController import GeolcationController

from MedicalMemberController import MedicalMemberController

from LocationDataController import LocationDataController

import config

app = Flask(__name__)

# config 객체 생성

app.config.from_object(config)

# MySQL 연결 설정

app.config['MYSQL_HOST'] = config.MYSQL_HOST  # MySQL 호스트 주소

app.config['MYSQL_PORT'] = config.MYSQL_PORT

app.config['MYSQL_USER'] = config.MYSQL_USER  # MySQL 사용자명

app.config['MYSQL_PASSWORD'] = config.MYSQL_PASSWORD  # MySQL 비밀번호

app.config['MYSQL_DB'] = config.MYSQL_DB  # 사용할 데이터베이스명

# MySQL 초기화

mysql = MySQL(app)

# DB 연결 블루 프린트 ( CONTROLLER )

app.register_blueprint(GeolcationController)

app.register_blueprint(MedicalMemberController)

app.register_blueprint(LocationDataController)

@app.route('/')

def index():

    return render_template('index.html')

# 이동용 route

@app.route('/Geolocation')

def Geolocation():

    return render_template('Geolocation.html')

@app.route('/locationManagement')

def locationManagement():

    KAKAOMAP_API_KEY = app.config['KAKAOMAP_API_KEY']

    return render_template('locationManagement.html', KAKAOMAP_API_KEY = KAKAOMAP_API_KEY)

@app.route('/member')

def member():

    return render_template('member.html')

@app.route('/a')

def a():

    KAKAOMAP_API_KEY = app.config['KAKAOMAP_API_KEY']

    return render_template('a.html', KAKAOMAP_API_KEY = KAKAOMAP_API_KEY)

@app.route('/homeLED')

def homeLED():

    return render_template('homeLED.html')

# 이동용 route 끝

if __name__ == '__main__':

    app.run()

기본적으로 프로젝트를 실행할 수 있는 파일이자 가장 기본이 되는 파일이다.

FLASK 프로젝트 자체를 app이라는 변수에 저장하고, app.run()을 통해 서버를 실행한다.

 

.route() 방식으로 데이터를 주고 받을 수 있으며, .route()의 return에 render_template를 통해 유저에게 보여 주고 싶은 화면을 불러올 수 있다.

 

프로젝트의 모든 기능을 app.py에 담아서 사용하면 유지 및 보수에 어려움이 생기기 때문에,

app.py에는 DB와 연동 및 페이지 이동 요소만 넣어두고

기능적인 부분은 blueprint 를 활용해서 기능별로 분리해뒀다.

 

4. blueprint

블루 프린트를 이용하기 위해서 먼저 app.py에 import 및 실행 명령을 해야한다.

from LocationDataController import LocationDataController

 

app.register_blueprint(LocationDataController)

 

import json

from flask import Blueprint

from flask_mysqldb import MySQL

LocationDataController = Blueprint('LocationDataController',__name__)

mysql = MySQL()

# 환자 위치 정보 불러오기

@LocationDataController.route('/getLocationData/<hospital>')

def get_location_data(hospital):

    cur = mysql.connection.cursor()

    cur.execute("""SELECT ld.* FROM locationdata ld INNER

                JOIN ( SELECT name, phone FROM register WHERE hospital = %s GROUP BY name, phone)

                r ON ld.name = r.name AND ld.phone = r.phone INNER

                JOIN ( SELECT name, phone, MAX(getTime) as maxTime FROM locationdata GROUP BY name, phone )

                t ON ld.name = t.name AND ld.phone = t.phone AND ld.getTime = t.maxTime""", (hospital,))

    data = cur.fetchall()

    cur.close()

   

    location_data = []

    for row in data:

        location = {

            'x': row[0],

            'y': row[1],

            'phone': row[2],

            'name': row[4]

        }

        location_data.append(location)

   

    return json.dumps(location_data)

# 집중 관찰 환자 위치 불러오기

@LocationDataController.route('/focusToPatient/<name>/<phone>')

def get_focused_patient_location(name,phone):

    cur = mysql.connection.cursor()

    cur.execute("""SELECT * FROM locationdata

                WHERE name = %s AND phone = %s AND getTime = ( SELECT MAX(getTime)

                FROM locationdata WHERE name = %s AND phone = %s )""", (name,phone,name,phone,))

    data = cur.fetchall()

    cur.close()

    location_data = []

    for row in data:

        location = {

            'x': row[0],

            'y': row[1],

            'phone': row[2],

            'name': row[4]

        }

        location_data.append(location)

    return json.dumps(location_data)

그리고 해당 파일이 blueprint 임을 선언하는 부분

LocationDataController = Blueprint('LocationDataController',__name__) 에서는

블루프린트의 이름을 정의하고, 도매인 끝 부분의 주소를 설정할 수 있다.

 

5. html

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<link rel="stylesheet" href="{{ url_for('static', filename='css/Geolocation.css') }}">

</head>

<body>

<form class="locationform"  method="post">

 사용자 이름:<input type="text" id="name">

 핸드폰 번호:<input type="text" id="phone">

 

 <button type="button" id="btnStart"> 확인 </button>

 

        위도:<span id="x"></span>

        경도:<span id="y"></span>

       

</form>

   

 <input id="btnStop" type="button" value="감시를 끝낸다" />

   

<script src="http://code.jquery.com/jquery-1.11.0.js"></script>

<script src="{{ url_for('static', filename='js/Geolocation.js') }}"></script>

</body>

</html>

html 파일에서 js나 css를 불러올 때는 다음과 같이 static 폴더에서 꺼내오는 명령어를 사용해야한다.

 

6. pythonanywhere

https://www.pythonanywhere.com/

Host, run, and code Python in the cloud: PythonAnywhere

파이썬으로 만든 장고나 플라스크 프로젝트를 간단히 배포할 수 있는 홈페이지다.

깃허브에 업로드한 프로젝트를 쉽게 다운받아서 사용할 수 있고

 

특징으로는, WSGI configuration file 을 이용해서 프로젝트 실행 환경을 설정해야만 하고

배포하는 과정에서 자체적으로 지원하는 DB가 있다. 기본적으로 sqlite 를 이용하고 Mysql이나 Maria DB를 활용할 수 있다. 후자의 경우 필요한 모듈을 다운받아야만 한다.

 

console 창에서 가상환경 ( Virtualenv )을 생성하고, 해당 폴더 내부에 사용하고자 하는 모듈을 설치해야한다 ( DB나 selenium , jinja 등의 pip에서 이용할 수 있는 기능들 )