Flask測驗小工具平臺-有解無憂

1.首先安裝flask pip install flask，或者在setting里邊去搜flask去安裝

2.寫一個簡單的介面，輸出hello

介面是一個函式，介面要系結一個介面地址，以確定那個介面去走這個函式，系結到路由也就是介面地址

from flask import Flask

app = Flask('tools')

@app.route('/')
def home():
return 'hello'

if __name__=='__main__':
app.run()

運行結果就是在網頁上輸出一個hello

3.介面也可以回傳網頁

from flask import Flask

app = Flask('tools')

@app.route('/')
def home():
    return """<html>         ---return里可以寫一個網頁，回傳
    <head><title>第一個網頁啊</title></head>
    <body>
         <h1>你好</h1> 
         <h2>Lily</h2> 
         <h3>哈哈</h3>
    </body>
</html>
     """
if __name__=='__main__':
    app.run()

4.介面也可以回傳一個json格式，需要引入jsonify，通過jsonify來傳一個josn對

from flask import Flask,jsonify

app = Flask('tools')

@app.route('/')
def home():
    return jsonify({'name':'Kiven','age':16})
if __name__=='__main__':
    app.run()
回傳結果是json格式對
--------------------------------------------------------------------------------------------------------
但是這樣在一個檔案里寫很麻煩，可以單獨寫一個html模板，回傳一個html檔案
在根目錄下新建一個模板檔案夾templates，存放html模板
寫出來一個靜態模板home.html,要傳給介面，怎么傳呢，需要匯入render_template,匯入以后可以通過

render_template把網頁傳給介面

from flask import Flask,jsonify,render_template

app = Flask('tools')

@app.route('/')
def home():
    return render_template('./home.html')          ---把網頁傳給介面
if __name__=='__main__':
    app.run()

也可以在網頁設定一個變數，通過render_template渲染網頁的時候，傳值給設定的變數

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>小工具主頁</title>
</head>
<body>
<div id="content">
    <h2>你好，{{user}}</h2>     --user就是設定的變數，通過render_template傳值給這個變數
    <h3>測驗小工具</h3>
    <url>
        <li>Xmind轉excel</li>
        <li>HAR轉介面代碼</li>
        <li>MD5加密</li>
    </url>

    <h3>運維小工具</h3>
    <url>
        <li>Xmind轉excel</li>
        <li>HAR轉介面代碼</li>
        <li>MD5加密</li>
    </url>
</div>
</body>
</html>

from flask import Flask,jsonify,render_template

app = Flask('tools')

@app.route('/')
def home():
    return render_template('./home.html',user='Keivn')    ----這里的user賦值，傳給網頁里設定的變數
if __name__=='__main__':
    app.run()

-------------------------======================----------------------------------------------==============================----------------------------------
一些動態資料，可以從后端傳到前端，前端埋一個變數，進行遍歷，加for回圈

from flask import Flask,jsonify,render_template

app = Flask('tools')

@app.route('/')
def home():
#date就是動態資料，可以隨時改變
    date =[
        {'name':'Xmind轉excel','url':''},
        {'name':'HAR轉介面代碼','url':''},
        {'name':'md5加密','url':''}
    ]
    return render_template('./home.html',user='Keivn',tools=date)  ----tools就是html里邊的變數名稱，把date傳給tools
if __name__=='__main__':
    app.run()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>小工具主頁</title>
</head>
<body>
<div id="content">
    <h2>你好，{{user}}</h2>
    <h3>測驗小工具</h3>
    <url>
        {% for tool in tools%}   --------tools是變數，for回圈，遍歷整個tools
        <li>{{tool.name}}</li>   --------取每個變數的name
        {% endfor %}
    </url>

    <h3>運維小工具</h3>
    <url>
        <li>Xmind轉excel</li>
        <li>HAR轉介面代碼</li>
        <li>MD5加密</li>
    </url>
</div>
</body>
</html>

---------------------------------------------------------------------------------------------
還可以在小工具里加鏈接，可以點擊跳轉，單獨一個小工具新建一個頁面xmind2excel.html
跳轉到小工具頁面，需要加鏈接，需要新增一個介面，即一個新的函式

from flask import Flask,jsonify,render_template

app = Flask('tools')

@app.route('/')
def home():
    date =[
        {'name':'Xmind轉excel','url':'/xmind2excel'},
        {'name':'HAR轉介面代碼','url':''},
        {'name':'md5加密','url':''}
    ]
    return render_template('./home.html',user='Keivn',tools=date)

@app.route('/xmind2excel')        #括號里的是介面地址  --新加的介面
def xmind2excel():
    return render_template('./xmind2excel.html')

新寫的頁面，點擊主頁上的文字的鏈接，跳轉到這個頁面
<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>XMind轉Excel</title>
</head>
<body>
    <h2>XMind轉Excel</h2>
</body>
</html>

在新頁面加一些功能
加一個做加法的功能

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>XMind轉Excel</title>
</head>
<body>
    <h2>XMind轉Excel</h2>
    <form>         #表單兩個關鍵點：1 傳給哪個介面 2 每個輸入框要提供一個變數名
        <div><span>變數a </span><input type="text"></div>
        <div><span>變數b </span><input type="text"></div>
        <button type="submit">確定</button>
    </form>


</body>
</html>

在主頁寫一個介面 新引入一個request

from flask import Flask,jsonify,render_template,request

app = Flask('tools')

@app.route('/')
def home():
    date =[
        {'name':'Xmind轉excel','url':'/xmind2excel'},
        {'name':'HAR轉介面代碼','url':''},
        {'name':'md5加密','url':''}
    ]
    return render_template('./home.html',user='Keivn',tools=date)

@app.route('/xmind2excel')        #括號里的是介面地址
def xmind2excel():
    return render_template('./xmind2excel.html')

@app.route('/add',methods=['POST'])                    --新寫的加法介面,加了限制那種請求方式，可以是一個可以是多個
def add():
    a = request.form.get('a')
    b = request.form.get('b')
    c = int(a) + int(b)                            --html里拿到的變數值都是字串，需要轉換成整形的才能進行加法計算
    return str(c)                                  --做完加法計算c是整形的，需要轉換成字串形式才能傳

if __name__=='__main__':
    app.run()

新寫的頁面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>XMind轉Excel</title>
</head>
<body>
    <h2>XMind轉Excel</h2>
    #表單兩個關鍵點：1 傳給哪個介面 2 每個輸入框要提供一個變數名
    <form action="/add" method="post">     #通過post方式傳給add這個介面
        <div><span>變數a </span><input name="a" type="text"></div>   #變數名是a  輸入的值以變數a傳給介面
        <div><span>變數b </span><input name="b" type="text"></div>   #變數名是b
        <button type="submit">確定</button>
    </form>


</body>
</html>

轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/554093.html

標籤：其他

上一篇：6.1. 網路基礎知識

下一篇：返回列表