云监控(华为) | 实训学习day4(10)

打印 上一主题 下一主题

主题 666|帖子 666|积分 1998

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更新的安全性

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

得现结论:更新时数据不安全
解决方法: (乐观锁,灰心锁)

  • 加锁. Synchronized,速率降落


  • 乐观锁
CAB模式 内存有一个旧值,修改时把旧值改新值,修改时旧值与内存旧值对比,如果同等允许修改,差别等不允许改。
实现:在数据表多一个字段version版本。
为myuser表添加一列
 


查询表时有版本version

利用乐观锁
   

  • 为表增长一列version
  • 发生更新,更新一次,把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上
 

加图片的相干属性


  • 改addpage
与输入表单有关的找输入框组
 


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

然后设置按钮的样式.

利用br调解竖向距离。

末了可以加配景


  • updatepage页面
同addpage页面,然后代码做修改.
        
           代码实现

   
  1. <!DOCTYPE html>
  2. <html lang="en" xmlns="http://www.w3.org/1999/html">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>添加用户</title>
  6.     <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
  7.     <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>
  8. </head>
  9. <body>
  10. <div class="container text-center">
  11.     <div class="row">
  12.         <div class="col">
  13.         </div>
  14.         <div class="col">
  15.             <br/>
  16.             <br/>
  17.             <h3>注册页面</h3>
  18.             <br/>
  19.             <!--添加用户使用表单form,action提交地址(由谁处理)-->
  20.             <form action="/user/add" method="post">
  21.                 <div class="input-group input-group-lg">
  22.                     <span class="input-group-text">用户名:</span>
  23.                     <input type="text" class="form-control" name="username"/>
  24.                 </div>
  25.                 <br/>
  26.                 <div class="input-group input-group-lg">
  27.                     <span class="input-group-text">密&nbsp;&nbsp;&nbsp;码:</span>
  28.                     <input type="text" class="form-control" name="password"/>
  29.                 </div>
  30.                 <br/>
  31.                 <button type="submit" class="btn btn-outline-success">注册</button>
  32.             </form>
  33.         </div>
  34.         <div class="col">
  35.         </div>
  36.     </div>
  37. </div>
  38. </body>
  39. </html>
复制代码
  1. <!DOCTYPE html>
  2. <html xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>显示用户</title>
  6.     <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
  7.     <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>
  8. </head>
  9. <body >
  10. <div class="container text-center">
  11.     <div class="row">
  12.         <div class="col"></div>
  13.         <div class="col">
  14.             <br/>
  15.             <h1 class="text-center">用户列表展示</h1>
  16.             <br/>
  17.             <table class="table table-bordered border-primary">
  18.                 <tr class="table-info">
  19.                     <br/>
  20.                     <td class="table-info">id</td>
  21.                     <td class="table-info">用户名</td>
  22.                     <td class="table-info">用户密码</td>
  23.                     <td class="table-info">操作</td>
  24.                 </tr>
  25.                 <tr th:each="item:${myusers}" class="table-info">
  26.                     <td th:text="${item.id}" class="table-info"></td>
  27.                     <td th:text="${item.username}" class="table-info"></td>
  28.                     <td th:text="${item.password}" class="table-info"></td>
  29.                     <td>
  30.                         <button type="button" th:onclick="|ondel(${item.id})|"  class="btn btn-danger">删除</button>
  31.                         <button type="button" th:onclick="|onupdate(${item.id})|" class="btn btn-primary">修改</button>
  32.                     </td>
  33.                 </tr>
  34.             </table>
  35.         </div>
  36.         <div class="col">
  37.         </div>
  38.     </div>
  39. </div>
  40. <script>
  41.     function onupdate(id){
  42.         //修改不需要跳转,显示原始信息
  43.         window.location.href="/user/orign?id="+id;
  44.     }
  45.     function ondel(id){
  46.         //先确认是否删除
  47.         answer=confirm("是否需要执行删除操作?")
  48.         if(answer==true){
  49.             // 地址栏地址
  50.             window.location.href="/user/del?id="+id;
  51.         }
  52.     }
  53. </script>
  54. </body>
  55. </html>
复制代码
  1. <!DOCTYPE html>
  2. <html lang="en" xmlns:th="http://www.thymeleaf.org" >
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>更新页面</title>
  6.     <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/css/bootstrap.css" rel="stylesheet">
  7.     <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.js"></script>
  8. </head>
  9. <body>
  10. <div class="container text-center">
  11.     <div class="row">
  12.         <div class="col">
  13.         </div>
  14.         <div class="col">
  15.             <br/>
  16.             <br/>
  17.             <br/>
  18.             <h3>用户信息更新</h3>
  19.             <br/>
  20.             <br/>
  21.             <form action="/user/update" method="post">
  22.                 <input type="hidden" th:value="${oneuser.id}" name="id"/>
  23.                 <input type="hidden" th:value="${oneuser.version}" name="version"/>
  24.                 <div class="input-group input-group-lg">
  25.                     <span class="input-group-text">用户名:</span>
  26.                     <input th:value="${oneuser.username}" name="username"/>
  27.                 </div>
  28.                 <br/>
  29.                 <div class="input-group input-group-lg">
  30.                     <span class="input-group-text">密&nbsp;&nbsp;&nbsp;码:</span>
  31.                     <input th:value="${oneuser.password}" name="password"/>
  32.                 </div>
  33.                 <br/>
  34.                 <br/>
  35.                 <button type="submit" class="btn btn-outline-dark">更新</button>
  36.             </form>
  37.         </div>
  38.         <div class="col">
  39.         </div>
  40.     </div>
  41. </div>
  42. </body>
  43. </html>
复制代码



免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

九天猎人

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表