Flask 입문 수업을 듣고 중요한 내용을 정리했습니다.
개인 공부 후 자료를 남기기 위한 목적이므로 내용 상에 오류가 있을 수 있습니다.
flask로 정적 웹 페이지 로드하기(Python)
flask로 프론트엔트 페이지를 로드하는 연습을 하고자 한다.
정적 웹 페이지 로드(with flask)
*HTML 파일
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<form action="/login" method="get">
<p>Enter Name:</p>
<p><input type="text" name="user_name" /></p>
<p><input type="submit" value="submit" /></p>
</form>
</body>
</html>
*파이썬 파일
from flask import Flask, jsonify, request, render_template
app = Flask(__name__)
@app.route('/login')
def login():
username = request.args.get('user_name')
passwd = request.args.get('pw')
email = request.args.get('email_address')
print(username, passwd, email)
if username == 'kim':
return_data = {'auth': 'success'}
else:
return_data = {'auth': 'failed'}
return jsonify(return_data)
@app.route('/html_test')
def hello_html():
# html file은 templates 폴더에 위치해야 함
return render_template('login.html')
if __name__ == '__main__':
app.run(host="0.0.0.0", port="8080")
```
결과 :
flask의 render_template() 함수를 사용하여, flask로 프론트엔트 페이지(http://localhost:8080/html_test)를 보여줄 수 있다.
*기본 구조
- render_template(HTML 파일명) : flask로 HTML 파일 로드
단, HTML 파일은 반드시 flask가 실행되는 하위 폴더인 templates 폴더 안에 위치해야 한다.
*참고
HTML 파일에서 form 태그의 action 속성 값이 /login 이므로, submit 버튼을 누르면 http://localhost:8080/login 페이지로 넘어가는 동시에 GET 함수를 통해 HTTP 요청을 함께 한다. (파라미터는 text 상자의 입력 값으로 전달 됨)
이 때, http://localhost:8080/login 서버가 실행 중이라면 입력 값(파라미터)에 따라 HTTP 응답 결과를 해당 페이지에 보여줄 수 있다.
'Flask' 카테고리의 다른 글
| Flask - bootstrap·vue(axios)/flask로 REST API 구현 (0) | 2021.11.27 |
|---|---|
| Flask - jinja2 template (1) | 2021.11.25 |
| Flask - REST API의 이해를 위한 웹 기술 (0) | 2021.11.24 |
| Flask - flask로 REST API 구현 및 테스트 (0) | 2021.11.24 |
| Flask - 다양한 routing 기법 (0) | 2021.11.24 |
댓글