python flask快速搭建website

文章目录

• ​​1. app.py配置首页​​
• ​​2. views.py配置首页​​
• ​​3. templates配置首页​​
• ​​4. 设置变量​​
• ​​5. 接口变量​​
• ​​6. 接口传参​​
• ​​7. 接口返回json​​
• ​​8. 接口跳转​​
• ​​9. index.html添加javascript​​
• ​​10. 设置风格​​

视频：​​https://mp.weixin.qq.com/s/Az1LmhgYjURjsqJW4cBcLg​​​原创：​​https://www.youtube.com/watch?v=kng-mJJby8g​​github：​​https://github.com/Ghostwritten/flask_simple_demo.git​​

​

python -m pip install flask
mkdir flask_web1
cd flask_web1
mkdir flask_web1/template
mkdir flask_web1/static
touch app.py views.py

1. app.py配置首页

app.py

from flask import Flask

app = Flask(__name__)

@app.route("/")
def home():
    return "this is the home page"

if __name__=='__main__':
    app.run(debug=True, port=8080)

运行
访问：http://127.0.0.1:8080

2. views.py配置首页

app.py

from flask import Flask
from views import views

app = Flask(__name__)

app.register_blueprint(views, url_prefix="/views")

if __name__=='__main__':
    app.run(debug=True, port=8080)

views.py

from flask import Blueprint

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return "home page"

运行app.py，此效果调用views.py的blueprint

3. templates配置首页

mkdir templates/index.html

自动创建html模板文件

lang="en">

    charset="UTF-8">
    name="viewport" content="width=device-width, initial-scale=1.0">
    http-equiv="X-UA-Compatible" content="ie=edge">
    


    

修改：

lang="en">

    charset="UTF-8">
    name="viewport" content="width=device-width, initial-scale=1.0">
    http-equiv="X-UA-Compatible" content="ie=edge">
    


    
Home Page

views.py修改：

from flask import Blueprint, render_template

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html")

app.py不变
运行：

4. 设置变量

views.py

from flask import Blueprint, render_template

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim",ago=21)

index.html

lang="en">

    charset="UTF-8">
    name="viewport" content="width=device-width, initial-scale=1.0">
    http-equiv="X-UA-Compatible" content="ie=edge">
    


    
Home Page

    
hello, {{ name }}, you are {{ ago }} years old!

5. 接口变量

views.py

from flask import Blueprint, render_template

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim")

@views.route("/profile/")
def profile(username):
    return render_template("index.html",name=username)

index.html

lang="en">

    charset="UTF-8">
    name="viewport" content="width=device-width, initial-scale=1.0">
    http-equiv="X-UA-Compatible" content="ie=edge">
    


    
Home Page

    
hello, {{ name }}

运行：
死的用户

动态

6. 接口传参

from flask import Blueprint, render_template, request

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim")

@views.route("/profile")
def profile():
    args = request.args
    name = args.get('name')
    return render_template("index.html",name=name)

7. 接口返回json

views.py

from flask import Blueprint, render_template, request, jsonify

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim")

@views.route("/profile")
def profile():
    args = request.args
    name = args.get('name')
    return render_template("index.html",name=name)


@views.route("/json")
def get_json():
    return jsonify({'name': 'liming','coolness': 10})

8. 接口跳转

views.py

from flask import Blueprint, render_template, request, jsonify,redirect, url_for

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim")

@views.route("/profile")
def profile():
    args = request.args
    name = args.get('name')
    return render_template("index.html",name=name)


@views.route("/json")
def get_json():
    return jsonify({'name': 'liming','coolness': 10})

@views.route("/data")
def get_data():
    data = request.json
    return jsonify(data)

@views.route("/go-to-home")
def go_to_home():
    return redirect(url_for("views.get_json"))

回车go-to-home跳转json

修改为views.py：

return redirect(url_for("views.home"))

go-to-home跳转home

9. index.html添加javascript

index.html

lang="en">

    charset="UTF-8">
    name="viewport" content="width=device-width, initial-scale=1.0">
    http-equiv="X-UA-Compatible" content="ie=edge">
    


    

        Home Page
       
hello, {{ name }}

     

     

创建index.js

touch static/index.js

index.js写入console日志

console.log("I am running");

运行：

10. 设置风格

touch template/profile.html

profile.html写入风格

{% extends "index.html" %}
{% block content %}
 This is the profile page!
{% endblock %}

views.py

from flask import Blueprint, render_template, request, jsonify,redirect, url_for

views = Blueprint(__name__, "views")


@views.route("/")
def home():
    return render_template("index.html",name="Tim")

@views.route("/profile")
def profile():
    args = request.args
    name = args.get('name')
    return render_template("profile.html")


@views.route("/json")
def get_json():
    return jsonify({'name': 'liming','coolness': 10})

@views.route("/data")
def get_data():
    data = request.json
    return jsonify(data)

@views.route("/go-to-home")
def go_to_home():
    return redirect(url_for("views.home"))

运行：