SpringBoot增删改的细节研究

一、Spring boot增的安全性

1.开启数据库的事务

SpringBoot中Service层有事务(保证操作成功)

两个用户操作,同时增加同一条数据(用户名,密码一致)

验证内容,开启事务

Set autocommit=0 不提交,操作表在内存中

两个用户开启事务,插入同一条数据,会出现线程阻塞,某个用户一直死机。

当业务出现问题时,会有rollback方法回滚。

Commit提交,提交后会内存数据到表中。

当B成功commit后,数据表有新的数据,B成功等待A的动作,A动作取消,B就成功。

看出:插入同一条数据,会出现线程阻塞,某个用户一直死机

实质:插入同一个id,id是主键primary key

Sql语句:

原因:用户不知道id

 

结论:

插入数据时,insert不要求用户输入primary key,这是主键值,就可以成功解决插入数据的阻塞问题。

解决学号:学号用户输入,查询学号是否重,然后插入。

二、Spring boot删的安全性

两个事务,删除同一id的用户

(1)有无阻塞:在删除同一id时有阻塞问题.

(2)数据是否安全.数据是安全,,回滚不删除,提交就删除了.

解决阻塞:不允许删除同一个id,用户把表加载内存,不存在一个id

进入事务前,先查是否有id,有id中可以删除,没有id不允许删除.

 三、Spring boot更新的安全性

两个事务,两个用户同时更新一个数据的

得现结论:更新时数据不安全

解决方法: (乐观锁,悲观锁)

  1. 加锁. Synchronized,速度下降

  1. 乐观锁

CAB模式 内存有一个旧值,修改时把旧值改新值,修改时旧值与内存旧值对比,如果一致允许修改,不一致不允许改。

实现:在数据表多一个字段version版本。

为myuser表添加一列

 

查询表时有版本version

使用乐观锁

  1. 为表增加一列version
  2. 发生更新,更新一次,把version值加1,更新条件是id和version一起作用的结果;

第一步,改sql语句

第二步:表加一列version,对应java bean多一个字段version

最后提交更新的页面多一个version的提交

Updatepage页面多一个version的提交

四、前端页面

使用bootstrap

开发按API文档

移动端

自适应:内容随宽度缩小而缩小

响应式:宽度达到一定程度时,元素发生变化(折叠或隐藏)

不使用文档中的支持文件

百度页面搜索bootcdn

网站调用前端框架,速度快

击bootcdn的开源页面

在网站中搜bootstrap

第一个链接就是网站

进入链接

一个是css文件,没有后缀 ,只有bootstrap

点击后面的复制link标签

复制到myuser.html的head中

再找js,bootstrap5找bundle后缀的

复制的script标签,放在myuser.html的head中.

从官方得到,需要两个

了解bootstrap 一行12列

           

布局以row和col为准,container居中,text-center文字居中.

三列左右留空白

把table表格放中间

看bootstrap,左边有tables

表格项设置

在表格上,使用table表格样式,table-warning表示警告色,黄色,table-striped表示单数行深色,偶数行浅色

还有按钮

这里可以选择合适的

红色的按钮删除,蓝色的用于修改。

Btn-danger红色, btn-primary 蓝色  

加入背景图片

可以网络地址

加在body上

 

加图片的相关属性

  1. 改addpage

与输入表单有关的找输入框组

 

用到的输入框组,选择合适的样式

然后设置按钮的样式.

使用br调整竖向距离。

最后可以加背景

  1. updatepage页面

同addpage页面,然后代码做修改.

        

           代码实现

   

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>添加用户</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>
</head>
<body>

<div class="container text-center">
    <div class="row">
        <div class="col">

        </div>
        <div class="col">
            <br/>
            <br/>
            <h3>注册页面</h3>
            <br/>
            <!--添加用户使用表单form,action提交地址(由谁处理)-->
            <form action="/user/add" method="post">
                <div class="input-group input-group-lg">
                    <span class="input-group-text">用户名:</span>
                    <input type="text" class="form-control" name="username"/>
                </div>
                <br/>
                <div class="input-group input-group-lg">
                    <span class="input-group-text">密&nbsp;&nbsp;&nbsp;码:</span>
                    <input type="text" class="form-control" name="password"/>
                </div>
                <br/>
                <button type="submit" class="btn btn-outline-success">注册</button>
            </form>
        </div>
        <div class="col">

        </div>
    </div>
</div>

</body>
</html>
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>显示用户</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>

</head>
<body >

<div class="container text-center">
    <div class="row">
        <div class="col"></div>


        <div class="col">
            <br/>
            <h1 class="text-center">用户列表展示</h1>
            <br/>
            <table class="table table-bordered border-primary">
                <tr class="table-info">
                    <br/>
                    <td class="table-info">id</td>
                    <td class="table-info">用户名</td>
                    <td class="table-info">用户密码</td>
                    <td class="table-info">操作</td>
                </tr>
                <tr th:each="item:${myusers}" class="table-info">
                    <td th:text="${item.id}" class="table-info"></td>
                    <td th:text="${item.username}" class="table-info"></td>
                    <td th:text="${item.password}" class="table-info"></td>
                    <td>
                        <button type="button" th:onclick="|ondel(${item.id})|"  class="btn btn-danger">删除</button>
                        <button type="button" th:onclick="|onupdate(${item.id})|" class="btn btn-primary">修改</button>
                    </td>
                </tr>
            </table>
        </div>
        <div class="col">


        </div>
    </div>
</div>

<script>
    function onupdate(id){
        //修改不需要跳转,显示原始信息
        window.location.href="/user/orign?id="+id;
    }

    function ondel(id){
        //先确认是否删除
        answer=confirm("是否需要执行删除操作?")
        if(answer==true){
            // 地址栏地址
            window.location.href="/user/del?id="+id;
        }
    }
</script>

</body>
</html>
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
<head>
    <meta charset="UTF-8">
    <title>更新页面</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>

</head>
<body>
<div class="container text-center">
    <div class="row">
        <div class="col">

        </div>
        <div class="col">
            <br/>
            <br/>
            <br/>
            <h3>用户信息更新</h3>
            <br/>
            <br/>
            <form action="/user/update" method="post">
                <input type="hidden" th:value="${oneuser.id}" name="id"/>
                <input type="hidden" th:value="${oneuser.version}" name="version"/>
                <div class="input-group input-group-lg">
                    <span class="input-group-text">用户名:</span>
                    <input th:value="${oneuser.username}" name="username"/>
                </div>
                <br/>
                <div class="input-group input-group-lg">
                    <span class="input-group-text">密&nbsp;&nbsp;&nbsp;码:</span>
                    <input th:value="${oneuser.password}" name="password"/>
                </div>
                <br/>
                <br/>
                <button type="submit" class="btn btn-outline-dark">更新</button>
            </form>
        </div>
        <div class="col">

        </div>
    </div>
</div>




</body>
</html>

点赞(0) 打赏

评论列表 共有 0 条评论

暂无评论

微信公众账号

微信扫一扫加关注

发表
评论
返回
顶部