15-登录认证前端

好，咱们已经实现了登录认证的接口服务啊，也也通过ul去进行了一下访问啊，咱们测试过诶，这个输入用户的密码正确的情况下可以登录成功啊，输入错误会登录失败啊，这个登录的功能咱们验证没问题，那之后呢，咱们对接前端啊，把前端页面实现啊，既可以咱们创建一个新的工程啊，这块呢来创建一个新的前端工程，然后呢，实现前后端分离开发是可以的，然后呢也可以呢，在咱们现有这个SP Bo工程中，诶，借助它啊，咱们time live啊去进行一个前端搭建啊，咱们实现一下前端的对接，咱们就选择用time Le啊来去实现相对简单一些啊，带着各位咱们去实现这个相关功能，首先依然是先确认一下相关依赖啊，进到咱们工程当中去打开咱们的呃，这个po的X ma啊，去看一眼，在这儿可以看到，诶咱们的time list相关的依赖啊，已经添加好了，那之后呢，咱们还得去什么添加登录。

页面啊，咱们把登录页面给它添加一下，在咱们的资源目录下创建新的页面啊，这个就是它，哎，咱们login相关的页面创建出来。直接啊去创建login.htl哎，创建咱们的页面里面标签呢，就不带着各位啊，咱们一一个标签一个标签写啊，咱们直接参考课件，直接去添加上就可以啊，这很简单的，咱们一个STL标签啊，咱们来一个什么呢？诶phone表单提交啊，这个输入用户名密码，哎，这个输入框啊，输入用户名密码，然后呢，进行一个登录提交，诶请求到啊，咱们刚刚创建好的这个相关的controller的这个服务项啊，这块呢，进行一个user login进行一个登录操作啊，这是咱们的哎，Login相关的页面啊，这页面咱们先创建好，好除了咱们login页面的搭建之后呢，诶，咱们还得去搭建另外一个页面啊什么的，诶咱们登录之后，哎，在你输入用户密码点登录，登录成功之后，你是不是应该跳转到这个展示用户的页面对吧？哎，登录成功之后的页面咱们也得创建出来在这儿，哎，咱们创建man这个相关的页面，然后直接什么呢？哎，这个添加。

里面速就程直接去用这么一个新的啊登录之后的页面，第2HTML，好，在这下面咱们也添加一下标签啊，很简单啊，就是什么呢？在这展示啊，咱们是登录这个之后的页面，然后之后呢，诶，咱们通过session里面获得user啊相关信息啊，咱们把用户的名称展现出来啊，就是咱们登录之后，哎，这个展现的内容啊，把这个页面也准备好，那之后呢，咱们得改造一下咱们的controller了啊，把controller方法咱们去改造一下，直接进到controller里面啊，咱们需要什么呢？是不是得得有一个什么呢？咱们login啊，展现login页面的这个相关的方法咱们得创建出来，好，我就不带着各位一一去敲了，很简单啊，就是呃，请求路径跳转到对应页面啊，直接return相关的页面就好，哎，咱们直接把它复制过来，咱们进行一个页面跳转就可以，然后之后呢，还得进行改造啊，底下咱们登录成功之后，还得跳转到另外咱。

们慢点妙呢，所以这块呢，诶是页面跳转，而不是传递数据啊，传递参数，所以咱们得把这个response body这个注解得给它去掉啊，这得去掉，然后之后呢，咱们也看到了，咱们页面要从什么，是不是session里面获取数据啊，咱们登录成功之后，你是不是得把信息塞到session里面，所以在这儿需要有相关参数啊，哎，咱们的http session啊，去拿它它的session对象，然后把参数啊塞进去就可以，把user色信息塞进就可以，好，咱们再往下翻啊，找到咱们登录成功，那这回呢，就不是return登录成功了啊，咱们需要先往session里面塞入咱们的参数啊，那个user参数啊，在这section点啊，Set attribute啊，咱们直接设置一下这个相关参数是user，呃，User信息怎么取啊各位诶，咱们是不是之前把用户信息是不是塞到token里了，直接从token里取是不是就可以了，诶token点获取用户的身份认证信息点，诶to string啊转。

转换成字符串C进来就成好C入咱们的session返回的信息，然后之后呢，Return指定下我跳转到什么是不是man那个页面就可以对吧？哎跳转回相关的页面啊，千万注意啊，咱们要把上面那个哎这个responsibility啊给它得给它去掉好了之后呢，哎再往后啊，咱们进行什么呢？哎在这儿进行改造完成就可以，那之后呢，还得确认一点，就是在咱们的配置文件当中啊，去看一眼，打开咱们的配置文件。好，配置文件得确认一下啊，咱们对应的什么呢？哎，在这儿，哎，Zero啊，咱们对应的什么的login ul，指定一下咱们登录的这个ul地址啊，请求到咱们的什么的login啊，那个相关的方法刚刚咱们创建好了，好之后呢，哎，咱们再去修改一下配置类啊，配置类也得看一眼，配置类在这儿啊，咱们什么呢？诶，这个设置不认证可以访问的资源，咱们得加一个谁login啊，这块也已经加好了啊，这些都确认好以后，咱们再次启动测试一下前端，看好不好用啊，直接跑起来。

好，咱们这回访问一下这个相关的页面啊login，哎，访问一下诶login相关的页面，咱们测试一把会车，哎，可以看到啊，用户名密码要输入呢啊，咱们输入一下张三啊Z3进行一个认证点登录，哎，各位可以看到啊，这个登录认证后的主页面，然后呢，用户为什么张三啊，完成咱们的前端对接。