Python Web框架Flask下网站开发入门实例

发布时间：2024-04-15 14:09:20 来源：好代码

.

山有山的沉稳厚重，一年四季却能以不同的色彩风光展示山的美丽。活泼的有单调的一面，安静的有变换的色彩。静与动的搭配，单调与精彩的结合，也就组成了最美的风景。

一、Flask简介

Flask 是一个 Python 实现的 Web 开发微框架。官网：http://flask.pocoo.org/

二、Demo

1、代码结构

.
├── blog.py
├── static
│ ├── css
│ │ └── index.css
│ ├── images
│ │ ├── cat.jpg
│ │ └── sheying1229.jpg
│ └── js
└── templates
├── index.html
├── login.html
├── regist.html
└── upload.html

5 directories, 8 files

2、主程序blog.py



#!/usr/bin/python

#coding:utf8
from flask import Flask, render_template, url_for, request,redirect,make_response,session

import os,MySQLdb
app = Flask(__name__)

app.secret_key='afjlsjfowflajflkajfkjfkaljf'

user_list = ['jim','max','py']
imagepath = os.path.join(os.getcwd(),"static/images")
@app.route('/')

def index():

 username = request.cookies.get('username')

 if not username:

 username = u'请先登录'

 islogin = session.get('islogin')

 nav_list = [u'首页',u'经济',u'文化',u'科技',u'娱乐']

 blog = {'title':'welcome to my blog','content':'hello, welcome to my blog.'}

 blogtag = {'javascript':10,"python":20,"shell":5}

 img = url_for('static', filename="images/cat.jpg")

 return render_template('index.html', nav_list=nav_list, username=username, blog = blog, blogtag = blogtag, img=img, islogin=islogin)
@app.route('/reg', methods=['GET','POST'])

def regist():

 if request.method == 'POST':

 username = request.form['username']

 conn = MySQLdb.connect(user='root',passwd='admin',host='127.0.0.1')

 conn.select_db('blog')

 curr = conn.cursor()

 sql = 'insert into `user` (`id`,`username`) values (%d,"%s")' % (1,username)

 curr.execute(sql)

 conn.commit()

 curr.close()

 conn.close()

 return "user %s regist ok!" % request.form['username']

 else:

 #request.args['username']

 return render_template('regist.html')
@app.route('/upload', methods=['GET','POST'])

def upload():

 if request.method == 'POST':

 username = request.form['username']

 file = request.files['img']

 filename = file.filename

 file.save(os.path.join(imagepath,filename))

 return "<img src='static/images/%s' alt="'/>" % filename

 else:

 return render_template('upload.html')
@app.route('/login/', methods=['GET','POST'])

def login():

 if request.method == 'POST':

 username = request.form.get('username')

 if username in user_list:

 response = make_response(redirect('/'))

 response.set_cookie('username', value=username, max_age=300)

 session['islogin'] = '1'

 return response

 else:

 session['islogin'] = '0'

 return redirect('/login/')

 else:

 return render_template('login.html')
if __name__ == '__main__':

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

主要有首页、注册、登录、上传页面。

blog.py主要是展示了Flask中常见功能用法：路由，数据库操作，cookie，session，redirect，表单，文件上传，调试，Web服务器的IP和端口，静态文件读取等。

3、首页模板index.html



<!DOCTYPE html>

<html>

<head>

 <meta charset="utf-8"/>

 <title>Flask DEMO</title>

 <link rel="stylesheet" type="text/css" rel="nofollow noopener noreferrer" href="static/css/index.css"/>

</head>

<body>

 <div class="header">

 {%if islogin == '1' %}

 <h1>Welcome ,{{username}}!</h1>

 {%else%}

 <h1>{{username}}!</h1>

 {%endif%}

 <div class="nav">

 <ul>

 {%for nav in nav_list%}

 <li><a rel="nofollow noopener noreferrer" href="{{nav}}">{{nav}}</a></li>

 {%endfor%}

 </ul>

 </div>

 </div>

 <div class="container">

 <div class="item">

 <h1>{{blog['title']}}</h1>

 <div class="content">

 <img src="/static/images/cat.jpg" alt="cat" />

 <p>{{blog['content']}}</p>

 <img src="{{img}}" alt="cat" />

 </div>

 </div>

 <div class="side">

 <ul>

 {%for key,value in blogtag.items()%}

 <li>{{key}}({{value}})</li>

 {%endfor%}

 </ul>

 </div>

 </div>

</body>

</html>

这个模板主要展示了在Flask模板中如何读取各种类型的变量。

4、登录页面login.html



<!DOCTYPE html>

<html>

<head>

 <meta charset="utf-8"/>

 <title>Login</title>

 <link rel="stylesheet" type="text/css" rel="nofollow noopener noreferrer" href="static/css/index.css"/>

</head>

<body>

 <div class="header">

 <h1>Login</h1>

 </div>

 <div class="container">

 <div class="item">

 <form action="" method="post">

 <input type="text" placeholder="please input username" name="username" /><br/>

 <input type="submit" value="Login"/>

 </form>

 </div>

 </div>

</body>

</html>

结合blog.py主要展示表单如何提交取值，cookie和session应用。

5、注册页面regist.html



<!DOCTYPE html>

<html>

<head>

 <meta charset="utf-8"/>

 <title>Regist</title>

 <link rel="stylesheet" type="text/css" rel="nofollow noopener noreferrer" href="static/css/index.css"/>

</head>

<body>

 <div class="header">

 <h1>Regist</h1>

 </div>

 <div class="container">

 <div class="item">

 <form action="" method="post">

 <input type="text" placeholder="please input username" name="username" /><br/>

 <input type="submit" value="Regist"/>

 </form>

 </div>

 </div>

</body>

</html>

结合blog.py主要展示了数据库操作。

6、上传页面upload.html



<!DOCTYPE html>

<html>

<head>

 <meta charset="utf-8"/>

 <title>Upload</title>

 <link rel="stylesheet" type="text/css" rel="nofollow noopener noreferrer" href="static/css/index.css"/>

</head>

<body>

 <div class="header">

 <h1>Upload</h1>

 </div>

 <div class="container">

 <div class="item">

 <form action="" method="post" enctype="multipart/form-data">

 <input type="text" name="username" /><br/>

 <input type="file" name="img" /><br/>

 <input type="submit" value="Upload"/>

 </form>

 </div>

 </div>

</body>

</html>