开始Flask项目

最新推荐文章于 2025-09-08 17:11:31 发布

转载最新推荐文章于 2025-09-08 17:11:31 发布 · 50 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hxl316/p/7779451.html

文章标签：

#python

本文介绍如何创建并配置Flask应用，包括设置调试模式、理解主程序结构、使用装饰器定义路由以及通过render_template渲染不同页面。同时展示了如何在网页中实现登录和注册功能。

新建Flask项目。
设置调试模式。
理解Flask项目主程序。
使用装饰器，设置路径与函数之间的关系。
使用Flask中render_template，用不同的路径，返回首页、登录员、注册页。

用视图函数反转得到URL，{{url_for(‘login’)}}，完成导航条里的链接

from flask import Flask,render_template

app=Flask(__name__)

@app.route('/')

def base():
    return render_template('base.html')

@app.route('/login/')
def login():
    return render_template('denglu.html')

@app.route('/signin/')
def zhuce():
    return  render_template('zhuce.html')

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

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>广州商学院</title>
<nav>
    <img src="http://img.zcool.cn/community/019f9c5542b8fc0000019ae980d080.jpg@1280w_1l_2o_100sh.jpg" width="50"height="50">
    <a href="http://www.gzcc.cn/">首页</a>
    <a href="http://127.0.0.1:5000/login/">登录</a>
    <a href="http://127.0.0.1:5000/signin/">注册</a>
    <input type="text">
    <button>search</button>
</nav>
   <link rel="stylesheet" type="text/css" href="../static/css/daohang.css">
</head>
<body>
<h1 class="zao">广州商学院</h1>
<h2 >2017</h2>
<h3><span id="commentcount" >每天新鲜事</span></h3>

<div id="2015"style="width: 400px">
    <div id="header"style="background-color: pink":><h2 align="center "style="margin-bottom: 0">登录</h2></div>
    <div id="content"style="background-color: palevioletred;height:150px;width: 400px;float: left">
        <from action="">
            Username:<input type="text"name="user"placeholder="用户名"><br>
            Passward:<input type="password"name="password"><br>
            <input type="radio"name="role"value="stu">student
            <input type="radio"name="role"value="tea">teacher<br>

            <input type="checkbox"value="true"><span>记住我</span><a href="">登录遇到的问题</a><br>

            <input type="button"value="login"onclick="alert('登录验证')">
        </from>
</div>
    </div>
<hr>
<div>

    <select>
        <br><option>收藏</option>
       <br> <option>点赞</option>
       <br> <option>评论</option>
    </select>
    <hr><br>
   <br> <h3 id="学院介绍">学院介绍</h3>
    <d1>
        <br><dt><a href="http://site.gzcc.cn/">信息技术与工程学院</a> </dt>
      <br>   <dt><a href="http://st.gzcc.cn/">旅游学院</a> </dt>
        <br><dt><a href="http://sfl.gzcc.cn/">外国语学院</a></dt>
       <br> <dt><a href="http://sl.gzcc.cn/">法学院</a></dt>


    </d1>
    <hr><br>

</div>


 <a href="http://www.gzcc.cn/" >友情链接：详情请进入广州商学院官网</a>

</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <title>注册</title>
    <link href="../static/css/zhuce.css" rel="stylesheet" type="text/css">
    <script src="../static/js/zhuce.js"></script>

</head>

<body>
<div><h1>用户注册</h1></div>
  <div class="aa"><script>document.write("loading....")</script>
    </div>
<div class="flex-container">

    <div class="box">
<h2>欢迎加入</h2>
        <div class="input_box">
            请输入账号　<input id="uname" type="text"laceholder="请输入账号">   </div><br>
        <div class="input_box">
            请输入密码　<input id="upass" type="password" placeholder="请输入密码"></div><br>
         <div class="input_box">
            再输入密码　<input id="upass1" type="password" placeholder="再次输入密码"></div><br>
        <div id="error_box"><br></div>
         <div class="input_box">
            <button onclick="fnLogin()" >register</button></div>
    </div>
</div>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <title>登录</title>
    <link href="../static/css/denglu.css" rel="stylesheet" type="text/css">
    <script src="../static/js/denglu.js"></script>

</head>

<body>
  <div><h1>用户登录</h1></div>
  <div class="aa"><script>document.write("loading....")</script>
    </div>

<div class="flex-container">

    <div class="box">
        <p id="we">aaa</p>
        <script>
  document.getElementById("we").innerHTML=Date();
  <!--代替id=we的内容-->

        </script>

        <div class="input_box">
            登录　<input id="uname" type="text" placeholder="输入用户名">
        </div>
        <br>
        <div class="input_box">
            密码　<input id="upass" type="password" placeholder="输入密码">
        </div>
        <br>
        <div id="error_box"><br></div>
        <div class="input_box">
            <button onclick="fnLogin()">load</button>

        </div>
        <br>
    </div>

</div>
</body>
</html>
<style>

</style>