利⽤python实现后端写⽹页(flask框架)
如何⽤python做后端写⽹页-flask框架什么是Flask安装flask模块Hello World更深⼀步:数据绑定后端传⼊数据从前端获取数据数据库连接screen创建后台查看删除后台结束
什么是Flask
Flask是⼀个使⽤ Python 编写的轻量级 Web 应⽤框架。其 WSGI ⼯具箱采⽤ Werkzeug ,模板引擎则使⽤ Jinja2 。Flask使⽤ BSD 授权。以下程序均在⾃⼰服务器上运⾏(在vs code利⽤ssh进⾏连接)
安装flask模块
⾸先使⽤pip进⾏安装:
pip install flask
在所在项⽬⽂件夹下创建templates⽂件夹(⽤于存放html等⽂件)和app.py,如图:
Hello World
我们可以在templates⽂件中新建index.html⽂件,其内容如下:
<html>
<h1>Hello Word!</h1>
</html>
在上⼀步建⽴的app.py⽂件中,写⼊:
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的⽅法定义路由地址
@ute("/")
#定义⽅法⽤jinjia2引擎来渲染页⾯,并返回⼀个index.html页⾯
def root():
return render_template("index.html")
#定义app在8080端⼝运⾏
app.run(port=8080)
我们写好app.py⽂件后,我们按F5运⾏,即终端输出:
我们访问服务器的8080端⼝,即Hello World出现在眼前!
更深⼀步:数据绑定
上⼀步我们简单地搭建好⼀个静态⽹页,它的显⽰只取决于前端,是固定不变的。我们如何做到从后端传递数值并在前端显⽰呢?这就需要使⽤数据绑定.
数据绑定,顾名思义,是为了实现⼀种“动态”的效果,后台的数据更新了,前端页⾯也⾃动更新;前端页⾯上的数据更新了,后台的数据也⾃动更新。在flask框架中,后端先将⽹页进⾏加载,并把传⼊的数据放在合适的位置后使⽤jinjia2引擎渲染,最后将渲染好的页⾯返回。
后端传⼊数据
我们⾸先在render_template函数中传递需要绑定的数据name,age:
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的⽅法定义路由地址
@ute("/")
#定义⽅法⽤jinjia2引擎来渲染页⾯,并返回⼀个index.html页⾯
def root():
return render_template("index.html",name="zxy",age=21)
#定义app在8080端⼝运⾏
app.run(port=8080)
在前端index.html中,我们获取传⼊的数据:
jquery框架定义<html>
<h1>我是{{name}},今年{{age}}岁</h1>
</html>
我们再按F5运⾏,并访问服务器的8080端⼝,页⾯显⽰:
从前端获取数据
那么,前端提交的数据如何传到后端呢?
在这⾥,我使⽤ajax实现数据的异步传输。我们将主要步骤概括为:
1.在前端页⾯中引⼊jQuery
2.创建两个输⼊框,⼀个按钮⽤于输⼊数据和事件提交。
3.在js中编写事件,使⽤ajax进⾏数据提交
4.在后端app.py中编写对应的事件处理函数
前端index.html内容如下:
<html>
<!--引⼊jQuery包⽤于使⽤ajax-->
<script type="text/javascript" src="apps.bdimg/libs/jquery/2.1.4/jquery.min.js"></script> <h1>请输⼊你的姓名和年龄</h1>
<!--创建两个input输⼊框,定义id分别为name,age-->
<input type="text" id="name" name="name" placeholder="姓名">
<br>
<input type="text" id="age" name="age" placeholder="年龄">
<br>
<!--创建button按钮,点击则激发submit()事件-->
<button onclick="submit();">提交</button>
<script>
/*在这⾥编写submit()事件*/
function submit() {
$.ajax({
url: "submit", /*数据提交到submit处*/
type: "POST", /*采⽤POST⽅法提交*/
data: { "name": $("#name").val(),"age":$("#age").val()}, /*提交的数据(json格式),从输⼊框中获取*/ /*result为后端函数返回的json*/
success: function (result) {
if (ssage == "success!") {
ssage+"你的名字是"+result.name+",你的年龄是"+result.age)
}
else {
ssage)
}
}
});
}
</script>
</html>
当我们完成ajax数据提交后,则在后端app.py处编写对应的处理函数submit()。app.py中的内容如下:
from flask import Flask, render_template, request, jsonify
#创建Flask对象app并初始化
app = Flask(__name__)
#通过python装饰器的⽅法定义路由地址
@ute("/")
#定义⽅法⽤jinjia2引擎来渲染页⾯,并返回⼀个index.html页⾯
def root():
return render_template("index.html")
#app的路由地址"/submit"即为ajax中定义的url地址,采⽤POST、GET⽅法均可提交
@ute("/submit",methods=["GET", "POST"])
#从这⾥定义具体的函数返回值均为json格式
def submit():
#由于POST、GET获取数据的⽅式不同,需要使⽤if语句进⾏判断
hod == "POST":
name = ("name")
age = ("age")
hod == "GET":
name = ("name")
age = ("age")
#如果获取的数据为空
if len(name) == 0 or len(age) ==0:
return {'message':"error!"}
else:
return {'message':"success!",'name':name,'age':age}
#定义app在8080端⼝运⾏
app.run(port=8080)
编写完成后,我们访问服务器8080端⼝进⾏测试,结果如下:
数据库连接
数据库是⼀个⽹页不可或缺的部分。前⾯的例⼦中,数据都是从前端获取或者随机输⼊的。如何从数据库中获取数据呢?⾸先我们引⼊pymysql库并编写Database类,该类写在database.py中:
import pymysql
class Database:
#设置数据库的连接参数,由于我是在服务器中编写的,所以host是localhost
host = "localhost"
user = "root"
password = "Zhangxy0212!!"
#类的构造函数,参数db为欲连接的数据库。该构造函数实现了数据库的连接
def __init__(self,db):
connect = t(host=self.host,user=self.user,password=self.password,database=db)
self.cursor = connect.cursor()
#类的⽅法,参数command为sql语句
def execute(self, command):
try:
#执⾏command中的sql语句
ute(command)
except Exception as e:
return e
else:
#fetchall()返回语句的执⾏结果,并以元组的形式保存
return self.cursor.fetchall()
我们可以在templates⽂件中新建⼀个data.html⽂件,⽤于创建⼀个新的页⾯,⽂件内容如下:
<html>
<script type="text/javascript" src="apps.bdimg/libs/jquery/2.1.4/jquery.min.js"></script>
<h1>请输⼊你的名字</h1>
<input type="text" id="name" name="name">
<button onclick="show();">提交</button>
<!--result⽤来显⽰提交结果-->
<p id="result"></p>
<script>
function show() {
$.ajax({
url: "show",
type: "POST",
data: { "name": $("#name").val()},
/*不要忘记 result为后端处理函数的返回值!*/
success: function (result) {
if (result.status == "success") {
$("#result").text($("#name").val() + "是" + ssage)
}
else {
$("#result").text("出错了")
}
}
});
}
</script>
</html>
按钮的触发事件为show();接下来我们在app.py中编写渲染data.html页⾯的函数data()和事件处理函数show().
切记,这两个函数⼀定要加在创建app对象和定义运⾏端⼝之间!!
由于我们要使⽤写好的Database类进⾏数据库的连接,因此需要在app.py顶部进⾏引⼊:
from database import Database
data()函数和show()函数如下:
#通过python装饰器的⽅法定义路由地址
@ute("/data")
#定义⽅法⽤jinjia2引擎来渲染页⾯,并返回⼀个index.html页⾯
def data():
return render_template("data.html")
#app的路由地址"/show"即为ajax中定义的url地址,采⽤POST、GET⽅法均可提交
@ute("/show",methods=["GET", "POST"])
def show():
#⾸先获取前端传⼊的name数据
hod == "POST":
name = ("name")
hod == "GET":
name = ("name")
#创建Database类的对象sql,test为需要访问的数据库名字具体可见Database类的构造函数
sql = Database("test")
try:
#执⾏sql语句多说⼀句,f+字符串的形式,可以在字符串⾥⾯以{}的形式加⼊变量名结果保存在result数组中
result = ute(f"SELECT type FROM type WHERE name='{name}'")
except Exception as e:
return {'status':"error", 'message': "code error"}
else:
if not len(result) == 0:
#这个result,我觉得也可以把它当成数据表,查询的结果⾄多⼀个,result[0][0]返回数组中的第⼀⾏第⼀列
return {'status':'success','message':result[0][0]}
else:
return "rbq"
运⾏结果如图:
多提⼀句,数据表type中的内容如下:
screen
⾄此,使⽤flask框架搭建简单⽹页的基本流程结束啦!
我想你们⼼中⼀定有个疑问,每次运⾏python程序总是需要按F5运⾏,如果关掉 VS Code ,那么进程将会被杀掉,服务器页⾯就⽆法显⽰,如图:
那么我们就需要在服务器中使⽤screen创建⼀个后台,将app.py程序放在后台中运⾏,达到持续运⾏的⽬的。
创建后台
由于我的服务器是Centos,所以我使⽤ yum install screen的⽅式下载的screen。
下载完成后,在服务器的任意位置输⼊screen命令即可创建后台,后台如图:
即上⾯会显⽰screen 0.
我们进⼊⼯程所在的⽂件try 输⼊命令:python app.py 如图:
这样我们再访问⼀下121.41.111.94,会发现⽹站已经启动啦!我们即使关闭命令⾏,程序也继续在后台运⾏。
查看删除后台
如果我们需要查看后台的运⾏情况,在服务器中输⼊命令:screen -x
如果需要停⽌后台运⾏,则先通过 screen -x [pid号] 进⼊某⼀后台。进⼊之后Ctrl+C即可停⽌运⾏。
如果删除后台,则先通过 screen -x [pid号] 进⼊某⼀后台,进⼊之后输⼊exit
结束
到此这篇关于利⽤python实现后端写⽹页(flask框架)的⽂章就介绍到这了,更多相关python后端写⽹页内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持!

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。