当前课程知识点：软件开发实训--动态网站开发 > 9 后台主界面实现 > 9.2登录界面及流程调试 > 9.2.1登录界面及流程调试

返回《软件开发实训--动态网站开发》慕课在线视频课程列表

9.2.1登录界面及流程调试在线视频

下一节:9.3.1管理主界面实现

返回《软件开发实训--动态网站开发》慕课在线视频列表

9.2.1登录界面及流程调试课程教案、知识点、字幕

同学你好

欢迎回到软件开发实训课堂

前面我们已经讲了登录的相关接口

以及类的定义

那么这节课咱们来看一下界面的实现与

测试整个登录的流程

首先我们在模板目录上点击右键

选择新建一个html文件

输入名称login就可以了

这个时候他帮我们生成了html文件

之前我们已经写过一个编辑用户的

simlive模板

所以我们可以把它完整地复制过来

给我们使用

这样我们就不需要再去写

头部的这些信息内容了

首先改一下它的标题

登录

然后把它的action改掉

action是login

然后我们是登录login

下面的错误处理

不变

然后账号我们不做判断

所以账号多余的地方就删掉就可以了

第二个密码也不做判断

直接把它条件给它去掉

好

下面的控件留下一个按钮就可以了

如果你还需要提供比如说记住密码

或者是找回密码这样的操作

那么在下面还可以接着去写相关的

按钮或者链接就可以了

这样我们就把登录的表单页面实现完成了

有了这个页面我们就可以去测试了

我们打开浏览器

来访问我们的登录

这里遇到了一个错误

我们来看一下

这种错误通常我们向下看

到达最后的时候他会提示你

没有这里写了

没有一个目标对象

叫做userlogin

这是因为我们缺少这个对象给他

我们需要去新建一个这样的对象

那么因为我们是转到界面来需要这个对象

的

你可以看一下

我们这里有个th object

所以我们需要在控制器里面去增加这个

对象

我们找到我们的login方法来添加

这个对象

model

userlogin

那么刚开始进来的时候

这个对象是空的

login就可以了

然后他转向了我们的界面

这个时候我们去刷新界面看一下

保存刚才没有保存

重新刷新

这样我们的界面就出来了

我们把表单改一下

让它纵向排列

首先我们把这个行表跟行里面加一个单格

让单格占满

整个一行把所有的表单内容给它包起来

然后我们把我们的所有的表单域

都加上一个row

把它变成行

保存后

打开浏览器

我们重新刷新访问

这样我们的表单就传过来了

现在我们可以输入一个用户名

我们任意输入

看一下

他已经告诉你个数必须在这之间

这个消息是怎么弹出来的

首先我们说当我们提交表单时

我们已post的形式提交了

那么他做了一个valid的验证

这个验证他会去user login类里边

去查看他的每个字段的注解

看看它都有哪些需要验证的信息

我们每一个字段

都有最小字符数和不能为空

现在我们把消息给他

他刚才显示的消息是默认的消息

我们这里添加消息

账号不能为空

账号至少六个字符

同样的密码也有

消息

我们不使用它的默认消息

密码不能为空

密码至少六个字符

当然你也可以限制它最大字符数max

保存

然后我们再次去提交

看一下它的提示已经发生了变化

这样就达到了我们一个基础的验证

同样的

你可以加入这个字段

required这样的必须输入的这种限制

当然也可以通过注解not empty

来限制他不能为空创

好

我们把保存改为登陆

现在我们输入一个正确的账号

来看一下是否能够进入

在我们的数据库里边

我们来看一下他的账号

sysadmin

密码是123456

我们输入正确的

当他正常时

他转向到我们的首页

但是这里边我们并没有首页的模板

所以它提示找不着模板

发生了错误

我们在模板上点击右键

选择html输入index

新建一个index模板

然后保存

把里面的文字修改一下

改成登录成功的提示

现在我们刷新界面

就已经提示我们登录成功了

那么在登录成功时

我们做了一件事

就是把我们登录成功的用户信息保存到了

会话里面

这样我们后期可以对这些用户进行验证

看看他是否登录了

好

关于登录的界面我们就讲完了

下节课

再见

软件开发实训--动态网站开发课程列表：

1 前端需求分析

-1.1课程介绍

--1.1.1课程介绍

--1.1.2课程介绍PPT

--1.1.3随堂测试

-1.2网站需求分析

--1.2.2网站需求分析

--1.2.3需求PPT

--1.2.4随堂测试

-1.3网站首页分析

--1.3.1网站首页分析

--1.3.2首页分析PPT

--1.3.3随堂测试

-1.4导航菜单分析

--1.4.1导航菜单分析

--1.4.2课程PPT

--1.4.3随堂测试

-1.5内容区域分析

--1.5.1内容区域分析

--1.5.2课程PPT

--1.5.3随堂测试

-1.6内容副页面分析

--1.6.1副页面分析

--1.6.2课程PPT

--1.6.3软件系统需求分析

-1.7编写需求文档

-1.8需求分析理解

2 后端分析

-2.1后端页面总体分析

--2.1.1后端页面总体设计

--2.1.2课程PPT

--2.1.3随堂测试

-2.2用户管理功能设计

--2.2.1用户管理功能分析

--2.2.2课程PPT

--2.2.3随堂测试

-2.3内容与分类功能分析

--2.3.1内容与分类功能分析

--2.3.2课程PPT

--2.3.3随堂测试

-2.4网站配置功能设计

--2.4.1网站配置功能设计

--2.4.2课程PPT

--2.4.3软件系统设计

--2.4.4随堂测试

-2.5数据库及表结构分析

--2.5.1数据库及表结构分析

--2.5.2课程PPT

--2.5.3数据库设计

-总体设计文档

3 接口设计

-3.1前台模板约定

--3.1.1前台模板约定

--3.1.2课程PPT

--3.1.3随堂测试

-3.2网站配置接口设计

--3.2.1网站配置接口设计

--3.2.2课程PPT

--3.2.3随堂测试

-3.3菜单接口设计

--3.3.1菜单接口设计

--3.3.2课程PPT

--3.3.3随堂测试

-3.4内容接口设计

--3.4.1内容接口设计

--3.4.2课程PPT

--3.4.3随堂测试

-3.5幻灯片接口设计

--3.5.1幻灯片接口设计

--3.5.2课程PPT

--3.5.3随堂测试

-补充设计文档

-3.7接口设计

4 功能设计

-4.1用户管理功能设计

--4.1.1用户管理功能设计

--4.1.2课程PPT

--4.1.3随堂测试

-4.2菜单管理功能设计

--4.2.1菜单管理功能设计

--4.2.2课程PPT

--4.2.3随堂测试

-4.3内容管理功能设计

--4.3.1内容管理功能设计

--4.3.2课程PPT

--4.3.3随堂测试

-4.4网站配置信息设计

--4.4.1网站配置信息设计

--4.4.2课程PPT

--4.4.3随堂测试

-完成设计文档

-4.6随堂测试

5 环境搭建与开发

-5.1开发环境搭建

--5.1.1环境搭建

--5.1.2随堂测试

-5.2Web前端环境搭建

--5.2.1Web前端环境

-5.3创建用户实体

--5.3.1用户实体创建

--5.3.2随堂测试

-5.4用户实体表创建与初始化

--5.4.1用户实体表创建与初始化

--5.4.2随堂测试

-5.5用户数据访问接口实现

--5.5.1用户数据访问接口实现

--5.5.2随堂测试

-5.6环境搭建问题

-5.7环境搭建问题

6 用户管理功能实现

-6.1用户服务层接口实现

--6.1.1用户服务层接口实现

--6.1.2随堂测试

-6.2用户列表和编辑控制器实现

--6.2.1用户列表和编辑控制器实现

--6.2.2随堂测试

-6.3用户存储和删除控制器实现

--6.3.1用户存储和删除控制器实现

-6.4用户添加、编辑界面实现

--6.4.1用户添加、编辑界面实现

-6.5用户管理添加用户调试

--6.5.1用户管理添加用户调试

7 用户管理功能实现二

-7.1用户查询模板实现

--7.1.1用户查询模板实现

--7.1.2随堂测试

-7.2用户信息编辑的实现

--7.2.1用户信息编辑的实现

-7.3单个用户删除实现

--7.3.2单个用户删除实现

-7.4多个用户删除实现

--7.4.1多个用户删除实现

8 用户管理功能实现三

-8.1用户列表分页基本实现

--8.1.1用户列表分页基本实现

-8.2用户列表查询结果分页实现

--8.2.1用户列表查询结果分页实现

-8.3通用日期处理

--8.3.1通用日期处理

-8.4整型日期处理

--8.4.1整型日期处理

--8.4.2随堂测试

-8.5枚举数据的应用

--8.5.1枚举数据的应用

--8.5.2Spring Boot开发

9 后台主界面实现

-9.1登录逻辑实现

--9.1.1登录逻辑实现

--9.1.2随堂测试

-9.2登录界面及流程调试

--9.2.1登录界面及流程调试

--9.2.2随堂测试

-9.3管理主界面实现

--9.3.1管理主界面实现

--9.3.2随堂测试

-9.4授权验证拦截器实现

--9.4.1授权验证拦截器实现

--9.4.2随堂测试

-9.5拦截器调试

--9.5.1拦截器调试

10 分类管理实现

-10.1分类接口实现

--10.1.1分类接口实现

-10.2分类添加、编辑实现

--10.2.1分类添加、编辑实现

-10.3分类树结构实现

--10.3.1分类树结构实现

-10.4分类删除实现

--10.4.1分类删除实现

--10.4.2随堂测试

11 内容管理实现

-11.1内容实体定义

--11.1.1内容实体定义

-11.2相关接口定义

--11.2.1相关接口定义

-11.3服务接口实现

--11.3.1服务接口实现

-11.4内容添加、编辑模板实现

--11.4.1内容添加、编辑模板实现

-11.5内容添加、编辑控制器实现

--11.5.1内容添加、编辑控制器实现

-11.6内容检索页面实现

--11.6.1内容检索页面实现

-11.7内容分类树实现

--11.7.1内容分类树实现

12 UEditor富文本编辑器

-12.1修改UEditor相关问题

--12.1.1修改UEditor相关问题

-12.2整合UEditor到内容编辑界面

--12.2.1整合UEditor到内容编辑界面

-12.3UEditor图片对话框应用

--12.3.1UEditor图片对话框应用

-12.4文件上传问题处理

--12.4.1文件上传问题处理

13 网站配置管理实现

-13.1网站配置相关类实现

--13.1.1网站配置相关类实现

-13.2网站配置界面模板实现

--13.2.1网站配置界面模板实现

-13.3网站配置调试

--13.3.1网站配置调试

14 网站前端组件实现

-14.1网站首页布局实现

--14.1.1网站首页布局实现

-14.2菜单Vue组件实现

--14.2.1菜单Vue组件实现

--14.2.2随堂测试

-14.3幻灯片Vue组件实现

--14.3.1幻灯片Vue组件实现

-14.4滚动Vue组件实现

--14.4.1滚动Vue组件实现

--14.4.2随堂测试

-14.5滚动接口实现

--14.5.1滚动接口实现

-14.6滚动接口调试

--14.6.1滚动接口调试

-14.7幻灯片接口实现

--14.7.1幻灯片接口实现

15 网站前端页面实现

-15.1首页区域实现

--15.1.1首页区域实现

-15.2首页内容脚本实现

--15.2.1首页内容脚本实现

-15.3首页完善

--15.3.1首页完善

-15.4Vue组件放入单文件

--15.4.1Vue组件放入单文件

-15.5详细页面实现

--15.5.1详细页面实现

-15.6前端问题

16 测试与发布

-16.1网站测试介绍

--16.1.1网站测试介绍

--16.1.2课程PPT

-16.2功能测试

--16.2.1功能测试

--16.2.2课程PPT

-16.3打包发布

--16.3.1打包发布

-16.4部署运行

--16.4.1部署运行

--16.4.2随堂测试

9.2.1登录界面及流程调试笔记与讨论

也许你还感兴趣的课程:

© 柠檬大学-慕课导航课程版权归原始院校所有，
本网站仅通过互联网进行慕课课程索引，不提供在线课程学习和视频，请同学们点击报名到课程提供网站进行学习。