WEB數(shù)據(jù)庫(kù)系統(tǒng)
Web 2.0專注于讓網(wǎng)站上的用戶生成內(nèi)容，自從它開(kāi)始，網(wǎng)絡(luò)編程就成為了熱門話題。一直以來(lái)都可以使用Python創(chuàng)建網(wǎng)站，但這是一個(gè)相當(dāng)無(wú)" />

国产成人精品无码青草_亚洲国产美女精品久久久久∴_欧美人与鲁交大毛片免费_国产果冻豆传媒麻婆精东

15158846557 或 在線咨詢 在線咨詢
15158846557 或 在線咨詢
所在位置： 首頁(yè) > 營(yíng)銷資訊 > 網(wǎng)站運(yùn)營(yíng) > Python Web 開(kāi)發(fā)框架Flask快速入門

Python Web 開(kāi)發(fā)框架Flask快速入門

時(shí)間：2023-05-29 01:36:01 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-05-29 01:36:01 來(lái)源：網(wǎng)站運(yùn)營(yíng)

Python Web 開(kāi)發(fā)框架Flask快速入門：

Python Web 開(kāi)發(fā)框架Flask快速入門




WEB數(shù)據(jù)庫(kù)系統(tǒng)


Web 2.0專注于讓網(wǎng)站上的用戶生成內(nèi)容，自從它開(kāi)始，網(wǎng)絡(luò)編程就成為了熱門話題。一直以來(lái)都可以使用Python創(chuàng)建網(wǎng)站，但這是一個(gè)相當(dāng)無(wú)聊的任務(wù)。因此，有很多框架和工具被創(chuàng)造出來(lái)，幫助開(kāi)發(fā)人員創(chuàng)建更快，更強(qiáng)大的網(wǎng)站。本文描述了一些將Python和Web服務(wù)器組合以創(chuàng)建動(dòng)態(tài)內(nèi)容的方法。這不是一個(gè)完整的介紹，因?yàn)檫@個(gè)話題過(guò)于廣泛，不可能在一篇文章中講清楚。所以本次課程主要講解PythonWeb框架中常用的Flask框架的使用。





了解框架：


Flask作為Web框架，它的作用主要是為了開(kāi)發(fā)Web應(yīng)用程序。那么我們首先來(lái)了解下Web應(yīng)用程序。Web應(yīng)用程序 (World Wide Web)誕生最初的目的，是為了利用互聯(lián)網(wǎng)交流工作文檔。





一切從客戶端發(fā)起請(qǐng)求開(kāi)始。





安裝框架

pip install flask





最小的Flask應(yīng)用程序




編寫(xiě)代碼


一個(gè)最小的 Flask 應(yīng)用看起來(lái)會(huì)是這樣，找到一個(gè)目錄新建一個(gè)Python文件，比如叫做 helloFlask.py，編寫(xiě)代碼如下:


from flask import Flaskapp = Flask(__name__)@app.route('/')def hello_world(): return 'Hello World!'if __name__ == '__main__': app.run()


運(yùn)行


運(yùn)行Flask項(xiàng)目只需要執(zhí)行編寫(xiě)的Python文件即可：


python helloFlask.py
運(yùn)行成功會(huì)看到如下頁(yè)面：





在瀏覽器訪問(wèn)：









外部可訪問(wèn)的服務(wù)器


如果你運(yùn)行了這個(gè)服務(wù)器，你會(huì)發(fā)現(xiàn)它只能從你自己的計(jì)算機(jī)上訪問(wèn)，網(wǎng)絡(luò)中其它任何的地方都不能訪問(wèn)。在調(diào)試模式下，用戶可以在你的計(jì)算機(jī)上執(zhí)行任意 Python 代碼。因此，這個(gè)行為是默認(rèn)的。

如果你禁用了 debug 或信任你所在網(wǎng)絡(luò)的用戶，你可以簡(jiǎn)單修改調(diào)用 run() 的方法使你的服務(wù)器公開(kāi)可用，如下:


app.run(host='0.0.0.0')
這會(huì)讓操作系統(tǒng)監(jiān)聽(tīng)所有網(wǎng)絡(luò)。





路由


現(xiàn)代 Web 應(yīng)用的 URL 十分優(yōu)雅，易于人們辨識(shí)記憶，這一點(diǎn)對(duì)于那些面向使用低速網(wǎng)絡(luò)連接移動(dòng)設(shè)備訪問(wèn)的應(yīng)用特別有用。如果可以不訪問(wèn)索引頁(yè)，而是直接訪問(wèn)想要的那個(gè)頁(yè)面，他們多半會(huì)笑逐顏開(kāi)而再度光顧。

如上所見(jiàn)， route() 裝飾器把一個(gè)函數(shù)綁定到對(duì)應(yīng)的 URL 上。

這里是一些基本的例子:


@app.route('/')def index(): return 'Index Page'@app.route('/hello')def hello(): return 'Hello World'
但是，不僅如此！你可以構(gòu)造含有動(dòng)態(tài)部分的 URL，也可以在一個(gè)函數(shù)上附著多個(gè)規(guī)則。





模板


怎么給服務(wù)器的用戶呈現(xiàn)一個(gè)漂亮的頁(yè)面呢？

肯定需要用到 html、css ，如果想要更炫的效果還要加入 js ，問(wèn)題來(lái)了，這么一大堆字段串全都寫(xiě)到視圖中通過(guò) return 返回，這樣定義就太麻煩了吧，因?yàn)槎x字符串是不會(huì)出任何效果和錯(cuò)誤的，如果有一個(gè)專門定義前端頁(yè)面的地方就好了。

為此Flask 配備了 Jinja2 模板引擎。





創(chuàng)建模板


Flask 會(huì)在 templates 文件夾里尋找模板。所以，如果你的應(yīng)用是個(gè)模塊，這個(gè)文件夾應(yīng)該與模塊同級(jí)；如果它是一個(gè)包，那么這個(gè)文件夾作為包的子目錄:

例如在應(yīng)用下的template文件夾下創(chuàng)建模板index.html





接下來(lái)你可以使用 render_template() 方法來(lái)渲染模板。你需要做的一切就是將模板名和你想作為關(guān)鍵字的參數(shù)傳入模板的變量。這里有一個(gè)展示如何渲染模板的簡(jiǎn)例:


from flask import render_template@app.route('/index/')def hello(name=None): name = "張三" return render_template('index.html', name=name)
在 index.html 中添加如下代碼：


<!doctype html><title>Hello from Flask</title>{% if name %} <h1>Hello {{ name }}!</h1>{% else %} <h1>Hello World!</h1>{% endif %}
運(yùn)行Flask 程序輸入 127.0.0.1:5000/index 即可看到如下結(jié)果：









模板的基本語(yǔ)法


模板中使用變量：



使用判斷語(yǔ)句：


{% if name %}{% else %}{% endif %}
使用循環(huán)語(yǔ)句：


{% for i in range(1,10) %} {% for j in range(1,i+1) %} {{ j }} x {{ i }} = {{ i*j }} {% endfor %} <br>{% endfor %}


ORM


我們之前操作數(shù)據(jù)庫(kù)是通過(guò)寫(xiě)sql語(yǔ)句，那么能不能不寫(xiě)sql語(yǔ)句就可以操作數(shù)據(jù)庫(kù)呢？ 答案是可以的。

ORM框架
O是object，也就類對(duì)象的意思，R是relation，翻譯成中文是關(guān)系，也就是關(guān)系數(shù)據(jù)庫(kù)中數(shù)據(jù)表的意思，M是mapping，是映射的意思。在ORM框架中，它幫我們把類和數(shù)據(jù)表進(jìn)行了一個(gè)映射，可以讓我們通過(guò)類和類對(duì)象就能操作它所對(duì)應(yīng)的表格中的數(shù)據(jù)。ORM框架還有一個(gè)功能，它可以根據(jù)我們?cè)O(shè)計(jì)的類自動(dòng)幫我們生成數(shù)據(jù)庫(kù)中的表格，省去了我們自己建表的過(guò)程。









模型設(shè)計(jì)


在Flask中使用mysql數(shù)據(jù)庫(kù)，需要安裝一個(gè)flask-sqlalchemy的擴(kuò)展。


pip install flask-sqlalchemy
要連接mysql數(shù)據(jù)庫(kù)，還需要安裝 flask-mysqldb


pip install flask-mysqldb


flask連接數(shù)據(jù)庫(kù)


下列代碼即可連接本機(jī)MySQL的test3數(shù)據(jù)庫(kù)，假設(shè)用戶名為root，密碼為mysql


app.config['SQLALCHEMY_DATABASE_URI'] = 'mysql://root:mysql@127.0.0.1:3306/test3'


定義模型類進(jìn)行數(shù)據(jù)庫(kù)操作

from flask import Flaskfrom flask_sqlalchemy import SQLAlchemyapp = Flask(__name__)#設(shè)置連接數(shù)據(jù)庫(kù)的URLapp.config['SQLALCHEMY_DATABASE_URI'] = 'mysql://root:mysql@127.0.0.1:3306/Flask_test'#設(shè)置每次請(qǐng)求結(jié)束后會(huì)自動(dòng)提交數(shù)據(jù)庫(kù)中的改動(dòng)app.config['SQLALCHEMY_COMMIT_ON_TEARDOWN'] = Trueapp.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = True#查詢時(shí)會(huì)顯示原始SQL語(yǔ)句app.config['SQLALCHEMY_ECHO'] = Truedb = SQLAlchemy(app)class Role(db.Model): # 定義表名 __tablename__ = 'roles' # 定義列對(duì)象 id = db.Column(db.Integer, primary_key=True) name = db.Column(db.String(64), unique=True) us = db.relationship('User', backref='role')class User(db.Model): __tablename__ = 'users' id = db.Column(db.Integer, primary_key=True) name = db.Column(db.String(64), unique=True, index=True) email = db.Column(db.String(64),unique=True) pswd = db.Column(db.String(64)) role_id = db.Column(db.Integer, db.ForeignKey('roles.id'))if __name__ == '__main__': db.drop_all() db.create_all() ro1 = Role(name='admin') ro2 = Role(name='user') db.session.add_all([ro1,ro2]) db.session.commit() us1 = User(name='wang',email='wang@163.com',pswd='123456',role_id=ro1.id) us2 = User(name='zhang',email='zhang@189.com',pswd='201512',role_id=ro2.id) us3 = User(name='chen',email='chen@126.com',pswd='987654',role_id=ro2.id) us4 = User(name='zhou',email='zhou@163.com',pswd='456789',role_id=ro1.id) db.session.add_all([us1,us2,us3,us4]) db.session.commit() app.run(debug=True)
代碼解釋：





創(chuàng)建表：

db.create_all()


刪除表：

db.drop_all()


插入一條數(shù)據(jù):

ro1 = Role(name='admin')db.session.add(ro1)db.session.commit()#再次插入一條數(shù)據(jù)ro2 = Role(name='user')db.session.add(ro2)db.session.commit()


一次插入多條數(shù)據(jù)

us1 = User(name='wang',email='wang@163.com',pswd='123456',role_id=ro1.id)us2 = User(name='zhang',email='zhang@189.com',pswd='201512',role_id=ro2.id)us3 = User(name='chen',email='chen@126.com',pswd='987654',role_id=ro2.id)us4 = User(name='zhou',email='zhou@163.com',pswd='456789',role_id=ro1.id)db.session.add_all([us1,us2,us3,us4])db.session.commit()


查詢:filter_by精確查詢


返回名字等于wang的所有人


User.query.filter_by(name='wang').all()


first()返回查詢到的第一個(gè)對(duì)象

User.query.first()


all()返回查詢到的所有對(duì)象

User.query.all()


filter模糊查詢，返回名字結(jié)尾字符為g的所有數(shù)據(jù)。

User.query.filter(User.name.endswith('g')).all()


get()，參數(shù)為主鍵，如果主鍵不存在沒(méi)有返回內(nèi)容

User.query.get()


邏輯非，返回名字不等于wang的所有數(shù)據(jù)。

User.query.filter(User.name!='wang').all()


邏輯與，需要導(dǎo)入and，返回and()條件滿足的所有數(shù)據(jù)。

from sqlalchemy import and_User.query.filter(and_(User.name!='wang',User.email.endswith('163.com'))).all()


邏輯或，需要導(dǎo)入or_

from sqlalchemy import or_User.query.filter(or_(User.name!='wang',User.email.endswith('163.com'))).all()


查詢數(shù)據(jù)后刪除

user = User.query.first()db.session.delete(user)db.session.commit()User.query.all()


更新數(shù)據(jù)

user = User.query.first()user.name = 'dong'db.session.commit()User.query.first()


使用update

User.query.filter_by(name='zhang').update({'name':'li'})


關(guān)聯(lián)查詢示例：角色和用戶的關(guān)系是一對(duì)多的關(guān)系，一個(gè)角色可以有多個(gè)用戶，一個(gè)用戶只能屬于一個(gè)角色。


查詢角色的所有用戶：


#查詢r(jià)oles表id為1的角色ro1 = Role.query.get(1)#查詢?cè)摻巧乃杏脩?/span>ro1.us
查詢用戶所屬角色：


#查詢users表id為3的用戶us1 = User.query.get(3)#查詢用戶屬于什么角色us1.role
總的來(lái)說(shuō)使用Flask進(jìn)行數(shù)據(jù)庫(kù)開(kāi)發(fā)的步驟如下：


  1. 配置連接數(shù)據(jù)庫(kù)的選項(xiàng)
  2. 定義模型類
  3. 通過(guò)類和對(duì)象完成數(shù)據(jù)庫(kù)增刪改查操作



案例


基本知識(shí)點(diǎn)已經(jīng)學(xué)完了，接下來(lái)完成一個(gè)示例項(xiàng)目：

現(xiàn)在還需要的代碼包括三個(gè)方面，三個(gè)方面順序不分先后。


  1. 定義視圖
  2. 定義模板
  3. 連接操作數(shù)據(jù)庫(kù)

目標(biāo)是完成城市應(yīng)用的增刪改查功能。

表結(jié)構(gòu)如下：

| 列名 | 說(shuō)明 | 類型 | | --- | --- | --- | | id | 表id（自動(dòng)遞增，主鍵） | int | | provincename | 省名 | varchar | | cityname | 省會(huì)名 | varchar | | usernumber | 用戶數(shù)量 | int |


要求實(shí)現(xiàn)Flask對(duì)數(shù)據(jù)庫(kù)的增刪改查操作。





定義視圖、連接操作數(shù)據(jù)庫(kù)

from flask import Flask,render_template,request,redirectfrom flask_sqlalchemy import SQLAlchemyapp = Flask(__name__)db = SQLAlchemy(app)#設(shè)置數(shù)據(jù)庫(kù)連接app.config['SQLALCHEMY_DATABASE_URI'] = 'mysql://root:asd8283676@127.0.0.1:3306/web'#定義模型class City(db.Model): #表模型 id = db.Column(db.Integer,primary_key=True,autoincrement=True) provincename = db.Column(db.String(255)) cityname = db.Column(db.String(255)) usernumber = db.Column(db.Integer)#查詢所有數(shù)據(jù)@app.route("/select")def selectAll(): cityList = City.query.order_by(City.id.desc()).all() return render_template("index.html",city_list = cityList)@app.route('/')def index(): return selectAll()#添加數(shù)據(jù)@app.route('/insert',methods=['GET','POST'])def insert(): #進(jìn)行添加操作 province = request.form['province'] cityname = request.form['city'] number = request.form['number'] city = City(provincename=province,cityname=cityname,usernumber=number) db.session.add(city) db.session.commit() #添加完成重定向至主頁(yè) return redirect('/')@app.route("/insert_page")def insert_page(): #跳轉(zhuǎn)至添加信息頁(yè)面 return render_template("insert.html")#刪除數(shù)據(jù)@app.route("/delete",methods=['GET'])def delete(): #操作數(shù)據(jù)庫(kù)得到目標(biāo)數(shù)據(jù)，before_number表示刪除之前的數(shù)量，after_name表示刪除之后的數(shù)量 id = request.args.get("id") city = City.query.filter_by(id=id).first() db.session.delete(city) db.session.commit() return redirect('/')#修改操作@app.route("/alter",methods=['GET','POST'])def alter(): # 可以通過(guò)請(qǐng)求方式來(lái)改變處理該請(qǐng)求的具體操作 # 比如用戶訪問(wèn)/alter頁(yè)面 如果通過(guò)GET請(qǐng)求則返回修改頁(yè)面 如果通過(guò)POST請(qǐng)求則使用修改操作 if request.method == 'GET': id = request.args.get("id") province = request.args.get("provincename") cityname = request.args.get("cityname") usernumber = request.args.get("usernumber") city = City(id = id,provincename=province,cityname=cityname,usernumber = usernumber) return render_template("alter.html",city = city) else: #接收參數(shù)，修改數(shù)據(jù) id = request.form["id"] province = request.form['province'] cityname = request.form['city'] number = request.form['number'] city = City.query.filter_by(id = id).first() city.provincename = province city.cityname = cityname city.usernumber = number db.session.commit() return redirect('/')if __name__ == "__main__": app.run(debug = True,host='0.0.0.0',port=8080)


定義模板


主頁(yè)：
index.html


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>首頁(yè)</title></head><body> <div align="center"> <br> <a href="insert_page">添加城市</a> <br> <br> <table width="600" cellpadding="5" align="center" border="1" cellspacing="0"> <th align="center" colspan="4">城市信息</th> <tr> <td>province</td> <td>cityname</td> <td>usernumber</td> <td>操作</td> </tr> {% for item in city_list %} <tr> <td>{{item.provincename}}</td> <td>{{item.cityname}}</td> <td>{{item.usernumber}}</td> <td><a href='/alter?id={{item.id}}&provincename={{ item.provincename }}&cityname={{ item.cityname }}&usernumber={{item.usernumber}}'>編輯</a> <a href="/delete?id={{ item.id }}">刪除</a> </td> </tr> {% endfor %} </table> </div></body></html>
修改頁(yè)面
alter.html


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>修改</title></head><body><div class="layui-main"> <div class="site-content"> <br><br> <h1 class="site-h1">修改信息</h1> <br><br> <form class="layui-form" action="alter" method="post"> <input type="hidden" name = 'id' value="{{city.id}}"> <div class="layui-form-item"> <label class="layui-form-label">省份</label> <div class="layui-input-block"> <input type="text" name="province" required lay-verify="required" placeholder="請(qǐng)輸入省份" autocomplete="off" class="layui-input" value="{{city.provincename}}"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">城市</label> <div class="layui-input-block"> <input type="text" name="city" required lay-verify="required" placeholder="請(qǐng)輸入城市名稱" autocomplete="off" class="layui-input" value="{{city.cityname}}"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">人數(shù)</label> <div class="layui-input-block"> <input type="number" name="number" required lay-verify="required" placeholder="請(qǐng)輸入人數(shù)" autocomplete="off" class="layui-input" value="{{city.usernumber}}"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> </div></div></body></html>
添加數(shù)據(jù)頁(yè)面
insert.html


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>增加</title></head><body><div class="layui-main"> <div class="site-content"> <br><br> <h1 class="site-h1">添加信息</h1><br><br> <form class="layui-form" action="insert" method="post"> <div class="layui-form-item"> <label class="layui-form-label">省份</label> <div class="layui-input-block"> <input type="text" name="province" required lay-verify="required" placeholder="請(qǐng)輸入省份" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">城市</label> <div class="layui-input-block"> <input type="text" name="city" required lay-verify="required" placeholder="請(qǐng)輸入城市" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">用戶數(shù)</label> <div class="layui-input-block"> <input type="number" name="number" required lay-verify="required" placeholder="請(qǐng)輸入用戶數(shù)量" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> </div></div></body></html>


執(zhí)行項(xiàng)目、查看效果、測(cè)試功能










網(wǎng)頁(yè)美化




下載LayUI


在LayUI官網(wǎng) 下載layui相關(guān)組件。





項(xiàng)目引入


將Layui相關(guān)文件放入項(xiàng)目的static目錄下（static目錄用于存放靜態(tài)文件如css，js文件可以讓網(wǎng)站看起來(lái)更加美觀）。





引入LayUI需要在HTML文件中導(dǎo)入LayUI的CSS文件和JS模塊，格式如下：












修改項(xiàng)目HTML文件


index.html:


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>首頁(yè)</title> <link rel="stylesheet" href="/static/layui/css/layui.css"></head><body> <div align="center"> <br> <a href="insert_page">添加城市</a> <br> <br> <table id = 'tabledemo'lay-filter="test"> <thead> <tr> <th lay-data="{field:'id', width:100}">編號(hào)</th> <th lay-data="{field:'provincename', width:100}">省份</th> <th lay-data="{field:'cityname', width:80, sort:true}">城市名稱</th> <th lay-data="{field:'usernumber'}">用戶數(shù)量</th> <th lay-data="{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}"></th> </tr> </thead> <tbody> {% for item in city_list %} <tr> <td>{{item.id}}</td> <td>{{item.provincename}}</td> <td>{{item.cityname}}</td> <td>{{item.usernumber}}</td> </tr> {% endfor %} </tbody> </table> </div><script type="text/html" id="barDemo"> <a class="layui-btn layui-btn-xs" lay-event="edit">編輯</a> <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">刪除</a></script><script src="/static/layui/layui.js"></script><script> layui.use('table', function () { var table = layui.table;//轉(zhuǎn)換靜態(tài)表格 table.init('test', { height: 1000, width: 600//設(shè)置高度 ,limit:100 }); table.on('tool(test)', function(obj){ //注：tool 是工具條事件名，test 是 table 原始容器的屬性 lay-filter="對(duì)應(yīng)的值" var data = obj.data //獲得當(dāng)前行數(shù)據(jù) ,layEvent = obj.event; //獲得 lay-event 對(duì)應(yīng)的值 if(layEvent === 'detail'){ layer.msg('查看操作'); } else if(layEvent === 'del'){ layer.confirm('真的刪除行么', function(index){ location.href='/delete?id='+data.id; }); } else if(layEvent === 'edit'){ location.href='/alter?id=' + data.id + "&provincename=" +data.provincename + "&cityname=" + data.cityname + "&usernumber=" + data.usernumber; } }); });</script></body></html>
alter.html:


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>修改</title> <link rel="stylesheet" href="/static/layui/css/layui.css"></head><body><div class="layui-main"> <div class="site-content"> <br><br> <h1 class="site-h1">修改信息</h1> <br><br> <form class="layui-form" action="alter" method="post"> <input type="hidden" name = 'id' value="{{city.id}}"> <div class="layui-form-item"> <label class="layui-form-label">省份</label> <div class="layui-input-block"> <input type="text" name="province" required lay-verify="required" placeholder="請(qǐng)輸入省份" autocomplete="off" class="layui-input" value="{{city.provincename}}"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">城市</label> <div class="layui-input-block"> <input type="text" name="city" required lay-verify="required" placeholder="請(qǐng)輸入城市名稱" autocomplete="off" class="layui-input" value="{{city.cityname}}"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">人數(shù)</label> <div class="layui-input-block"> <input type="number" name="number" required lay-verify="required" placeholder="請(qǐng)輸入人數(shù)" autocomplete="off" class="layui-input" value="{{city.usernumber}}"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> </div></div><script src="/static/layui/layui.js"></script><script> //Demo layui.use('form', function () { var form = layui.form; });</script></body></html>
insert.html:


<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>增加</title> <link rel="stylesheet" href="/static/layui/css/layui.css"></head><body><div class="layui-main"> <div class="site-content"> <br><br> <h1 class="site-h1">添加信息</h1><br><br> <form class="layui-form" action="insert" method="post"> <div class="layui-form-item"> <label class="layui-form-label">省份</label> <div class="layui-input-block"> <input type="text" name="province" required lay-verify="required" placeholder="請(qǐng)輸入省份" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">城市</label> <div class="layui-input-block"> <input type="text" name="city" required lay-verify="required" placeholder="請(qǐng)輸入城市" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">用戶數(shù)</label> <div class="layui-input-block"> <input type="number" name="number" required lay-verify="required" placeholder="請(qǐng)輸入用戶數(shù)量" autocomplete="off" class="layui-input"> </div> </div> <div class="layui-form-item"> <div class="layui-input-block"> <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button> <button type="reset" class="layui-btn layui-btn-primary">重置</button> </div> </div> </form> </div></div><script src="/static/layui/layui.js"></script><script> layui.use('form', function () { var form = layui.form; });</script></body></html>


重新運(yùn)行項(xiàng)目


可以看到頁(yè)面的顏值已經(jīng)比之前沒(méi)加任何樣式提升了很多：







將網(wǎng)站發(fā)布到公網(wǎng)




配置環(huán)境


選擇一臺(tái)云主機(jī)，在云主機(jī)上配置好Python環(huán)境和MySQL環(huán)境。





部署服務(wù)


使用 nohup 命令可以后臺(tái)部署python服務(wù)：


nohup python app.py &
然后使用exit命令退出 linux 的連接





購(gòu)買域名


在公網(wǎng)的機(jī)器上部署好的服務(wù)器，現(xiàn)在還只能通過(guò)公網(wǎng)訪問(wèn)，要想通過(guò)域名能訪問(wèn)網(wǎng)站，還需要設(shè)置域名解析。

要給 web服務(wù)配置上域名，還需要到服務(wù)商網(wǎng)站購(gòu)買域名，例如：阿里云、騰訊云等等。





域名備案


購(gòu)買了域名之后無(wú)法直接使用，需要進(jìn)行域名備案，同樣在服務(wù)商那里備案即可。





域名接下


備案之后的域名就可以使用了，

使用域名解析，將指定域名解析到服務(wù)器的公網(wǎng)ip上，就可以通過(guò)這個(gè)域名來(lái)訪問(wèn)web服務(wù)器。





反向代理


域名解析完成之后，還需要做的工作是反向代理。

使用 nginx 服務(wù)器可以作為域名代理服務(wù)。

通過(guò)這幾個(gè)步驟就可以讓你的web服務(wù)成為面向互聯(lián)網(wǎng)的web服務(wù)啦。

可以參考的最簡(jiǎn)單 nginx 配置文件配置如下：

這個(gè)代表將 http://flask.codejiaonang.com 域名，映射到本地web服務(wù)器的8848端口。


server {listen 80;autoindex on;server_name flask.codejiaonang.com;access_log /usr/local/nginx/logs/access.log combined;location / { proxy_pass http://127.0.0.1:8848/; }}


總結(jié)




網(wǎng)站項(xiàng)目開(kāi)發(fā)的基本模式


通過(guò)Flask快速入門，我們可以將網(wǎng)站項(xiàng)目開(kāi)發(fā)的基本模式總結(jié)為下圖：





以 Flask 項(xiàng)目為例，F(xiàn)lask作為Web框架，它的作用主要是為了開(kāi)發(fā)Web應(yīng)用程序。

一個(gè)Web應(yīng)用程序包含了三個(gè)部分，前端，服務(wù)端，數(shù)據(jù)庫(kù)。





這個(gè)項(xiàng)目的線索


如果你也想讓你的網(wǎng)站成為一個(gè)像那些商業(yè)級(jí)網(wǎng)站一樣面向整個(gè)互聯(lián)網(wǎng)的話。

可以按照下列線索，從購(gòu)買服務(wù)器到購(gòu)買域名，最后通過(guò)將域名與服務(wù)器和服務(wù)器中部署的網(wǎng)站相關(guān)聯(lián)，一步一步來(lái)完成，當(dāng)然其中會(huì)遇到很多困難和挑戰(zhàn)和很多一時(shí)半會(huì)無(wú)法解決的錯(cuò)誤，但是當(dāng)你自己通過(guò)查找資料，解決問(wèn)題，最終能把網(wǎng)站部署成功，你會(huì)發(fā)現(xiàn)這些知識(shí)都自然而然的融入到自己的知識(shí)體系中了。





關(guān)鍵詞：入門

74
73
25
news

版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。

為了最佳展示效果，本站不支持IE9及以下版本的瀏覽器，建議您使用谷歌Chrome瀏覽器。 點(diǎn)擊下載Chrome瀏覽器
關(guān)閉