学习记录:一个简单的注册案例实现

Flask+Mysql+html注册案例实现

通过应用学的知识,简单实现一个注册页面!~

1 注册页面思路

首先我们要了解网站访问有post和get请求两种方式,通过不同的访问类型我们来区分开是返回注册页面还是提示注册成功!我们将页面的@app.route中的methods设置为get和post均可,当我们通过get请求访问时,我们让其返回注册页面,这时候正常注册即可,而在前端页面中,我们将注册的表单提交方式设置为post请求,提交地址设置为同一个register网页,这样,通过一个注册网页,两种不同的访问方式,我们就可以实现访问填写注册和提示注册成功!

值得一提的是在我看来为什么用post提交表单,是因为如果通过get方式提交表单,表单的信息会返回到网址的后面,有安全隐患,须通过一定加密手段maybe可以。

提交后通过flask连接数据库并且将得到的表单内容添加到数据库中,即完成了注册流程

2. Flask

首先搭建简单flask框架

import pymysql
from flask import Flask, render_template, request

app = Flask(__name__)


# 创建了网址 /show/info 和 函数index 的对应关系
# 以后用户在浏览器上访问 /show/info,网站自动执行 index
@app.route("/register", methods=['GET', "POST"])
def register():
    if request.method == "GET":

        return render_template("register.html")
if __name__ == '__main__':
    app.run()

3. 开启mysql服务

以下在命令行执行:
mysql -u root -p;
输入密码后进入服务
create database test1 DEFAULT CHARSET utf8 COLLATE utf8_general_ci;
use test1;
create table admin(
    -> id int not null auto_increment primary key,
    -> username varchar(16) not null,
    -> password varchar(64) not null
    -> )default charset=utf8;

4. html网页编写

这里导入了bootstrap样式构建页面,然而我们在编写时发现了一个问题,单纯打开网页,是可以看到我们从bootstrap中导入的css样式的,但是通过flask框架去运行打开网页,则发现我们通过bootstrap添加的样式无法实现出来,通过查阅,我把开头的html标签删除后,成功运行!

参考的解决方案附上:FLASK网页制作,CSS文件不显示问题

<head>
    <meta charset="UTF-8">
    <title>登录注册界面</title>
    <style>.account {
        width: 500px;
        height: 300px;
        border: 2px solid #dddddd;
        border-radius: 5px;
        box-shadow: 5px 5px 20px #aaa;

        margin-left: auto;
        margin-right: auto;
        margin-top: 100px;
        padding: 20px 40px;
    }

    .account h2 {
        margin-top: 10px;
        text-align: center;
    }
    </style>
    <link rel="stylesheet" href="../static/plugins/bootstrap-3.4.1/css/bootstrap.css">
</head>
<body>
<div class="account">
    <h2>用户登录</h2>
    <form method="post" action="/register">
        <div class="form-group">
            <label for="exampleInputEmail1">用户名</label>
            <input type="text" class="form-control" name="user" id="exampleInputEmail1" placeholder="请输入用户名">
        </div>
        <div class="form-group">
            <label for="exampleInputPassword1">密码</label>
            <input type="password" class="form-control" name="pwd" id="exampleInputPassword1" placeholder="请输入密码">
        </div>
        <div style="margin-left:180px;">
            <button style="margin:0 auto;" type="submit" onclick="myfunc()" class="btn btn-primary">注册</button>
        </div>
    </form>
</div>
<script type="text/javascript"> function myfunc() {
    alert("注册成功!~")
} </script>
</body>
</html

5. 通过pymysql连接数据库和python

import pymysql
from flask import Flask, render_template, request

app = Flask(__name__)


# 创建了网址 /show/info 和 函数index 的对应关系
# 以后用户在浏览器上访问 /show/info,网站自动执行 index
@app.route("/register", methods=['GET', "POST"])
def register():
    if request.method == "GET":

        return render_template("register.html")
    else:
        user = request.form.get("user")
        pwd = request.form.get("pwd")
        # 1.连接MySQL
        conn = pymysql.connect(host="127.0.0.1", port=3306, user='root', passwd="root123", charset='utf8', db='test1')
        cursor = conn.cursor(cursor=pymysql.cursors.DictCursor)

        # 2.发送指令(千万不要用字符串格式化去做SQL的拼接,安全隐患SQL注入)
        sql = "insert into admin(username,password) values(%s,%s)"
        cursor.execute(sql, [user, pwd])
        conn.commit()

        # 3.关闭
        cursor.close()
        conn.close()
        # 将用户信息写入文件中实现注册、写入到excel中实现注册、写入数据库中实现注册

        # 2.给用户再返回结果
        return "注册成功"


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

6.注册流程展示

1. 运行flask框架

image.png

2. 打开目标网页

image.png

3.提交注册信息

image.png

4.注册成功

image.png

5. 查询是否添加成功

image.png

posted @ 2022-08-06 17:20  粟一柯种一棵树  阅读(165)  评论(0)    收藏  举报