• 需求

网上购书系统是常见的一类电商系统，也是Web的一个核心应用，通过本实验（可以综合前面实现的功能，进行代码的复用）。利用1-6章的内容的综合知识实现网上购物购书系统的用户的注册，登陆，产品展示，购书四个主要的流程。

修改第一次的综合实验之登陆页面的，实现登录时使用的验证码的验证功能（防止机器的恶意登陆。）。

• 设计思路（实现原理）
• 编写验证码的生成的类。
• 在登录页面中使用验证码（jsp）。
• 在登录处理servlet中对用户输入的验证进行验证。

• 编程实现（具体实验）

按照我们讲授的步骤，进行编程实现。

CheckServlet的代码如图1、图2、图3所示。

IndexServlet的代码如图4所示。

LoginServlet的代码如图5所示。

LogoutServlet的代码如图6所示。

USER的代码如图7所示。

Web.xml的配置如图8所示。

Login.html的代码如图9所示。

测试：错误的用户名和密码以及验证码。过程如图10所示，结果如图11所示。

测试：用户名、密码、验证码都正确，过程如图12所示，结果如图13所示。

• 实验心得

通过实验，了解了目前网页常用的验证码识别登录模块，提高了实操技能。为以后的工作业务打下基础。

源代码：

4-1 [任务4-2]实现网页定时刷新并跳转

一、实验描述

1、考核知识点

    名称：[任务4-2]实现网页定时刷新并跳转

2、练习目标

• 掌握页面定时刷新跳转功能的基本用法。

3、需求分析

    在web开发中，有时会遇到定时跳转页面的需求。在HTTP协议中，定义了一个Refresh头字段，它可以通知浏览器在指定的时间内自动刷新并跳转到其它页面。通过本任务的学习，读者能够使用response对象实现网页的定时刷新并跳转。本将演示模拟用户注册成功后跳转到首页面的使用。

4、设计思路（实现原理）

1. 创建ReqServlet1类，编写跳转功能
2. 在web.xml中配置初始化参数和类的映射

       3）通过浏览器访问ReqServlet1，查看浏览器跳转效果。

二、具体实现

编写ReqServlet1，其代码：

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/f4/ ReqServlet1，浏览器显示结果图：

页面2秒后自动跳转到其他网页，如下：

三、总结

4-2  通过Request对象传递数据

一、实验描述

1. 考核知识点

名称：通过Request对象传递数据

• 练习目标
• 掌握通过Request对象传递数据、获取对象等常用方法。
• 需求分析

在一个request请求中，通常可以通过Request对象传递数据，本将演示通过Request对象传递数据。

• 设计思路（实现原理）
• 编写ReqServlet2类，在servlet中获取请求参数并进行相关数据传递
• 配置web.xml文件
• 通过浏览器访问ReqServlet2，展示效果

二、具体实现                   

编写ReqServlet2，其代码：

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter04/ ReqServlet2，查看控制台显示结果图：

三、总结

4-3  请求转发

一、实验描述

1. 考核知识点

名称：请求转发

• 练习目标
• 掌握ServletConfig对象的使用
• 需求分析

在Servlet中，如果当前Web资源不想处理请求时，可以通过forward()方法将当前请求传递给其它的Web资源进行处理，这种方式称为请求转发。本将模拟演示在一个servlet查询到用户id，然后请求转发到另外一个servlet，再通过该用户id来获取用户信息进行响应。

• 设计思路（实现原理）
• 创建ReqServlet3和ReqServlet4两个servlet类，
• 在ReqServlet3中，将获取的用户id放在request域中，并请求转发到另一个ReqServlet4中，
• 在ReqServlet4中，获取用户id，然后查询该用户信息，并响应，
• 在web.xml中配置初始化参数和类的映射

       5）通过浏览器访问ReqServlet3，展示查询信息

二、具体实现

创建ReqServlet3类，代码：

创建ReqServlet4类，代码：

在web.xml中配置映射：

启动Tomcat服务器，在浏览器的地址栏中输入URL地址http://localhost:8080/chapter04/ReqServlet3，显示的结果图：

三、总结

4-4请求包含

一、描述

1、考核知识点

    名称：请求包含  

2、练习目标

• 掌握请求包含include()方法的基本使用和特点。

3、需求分析

    模拟分别有UserServlet和OrderServlet两个servlet类，想要通过在UserServlet中获取某用户信息的同时在OrderServlet也获取其对应的订单信息并一同展示到页面上。本将模拟演示查询用户信息同时包含订单信息查询展示。

4、设计思路（实现原理）

1. 创建两个Servlet，UserServlet用于存储，OrderServlet用于查询。
2. 在类OrderServlet查询订单信息，在UserServlet查询用户信息并关联请求查询订单信息。
3. 服务器启动后，访问UserServlet映射的路径，查询页面查询信息。

二、实现

       创建类UserServlet，代码：

创建类OrderServlet，代码：

修改web.xml中配置：

启动服务，访问http://localhost:8080/chapter04/ UserServlet可看到浏览器显示图：

三、总结

源代码：

实验7-1 BeanUtils工具的介绍和使用

一、实验描述

1、考核知识点

    名称：BeanUtils工具的介绍和使用  

2、练习目标

• 掌握实际开发中BeanUtils工具的使用。

3、需求分析

   在实际开发中用户注册登录页面或者新增订单页面等一次性请求参数比较大，后台如果用request.getParameter(arg0)方法获取参数的话非常麻烦，这时候就可以考虑使用BeanUtils的popular()方法进行快速封装。本实验将模拟使用BeanUtils的popular()方法进行用户登录信息封装。

4、设计思路（实现原理）

1. 创建Demo1类，用于用户注册信息封装到JavaBean对象中
2. 创建User类用户实体对象
3. 创建login.jsp用户注册页面

       4）通过浏览器访问login.jsp，展现页面servlet处理响应信息。

二、实验实现

编写Demo1，代码：

编写User类，代码：

编写login.jsp，代码：

在web.xml文件中配置Servlet，代码：

参考演示效果如下：在地址栏中输入http://localhost:8080/chapter07/login.jsp，浏览器显示的结果如下图所示：

然后填写用户名和和密码，点击登录按钮，查看控制台，结果显示如下（显示登录填写信息封装到了User对象中）：

三、实验总结

实验7-2  EL中的运算符

一、实验描述

1. 考核知识点

名称：EL中的运算符

• 练习目标
• 掌握EL中的运算符的基本语法和使用。
• 需求分析

EL表达式中的empty运算符用于判断某个对象是否为null或””，结果为布尔类型，其基本的语法格式如下所示：${empty var}。本实验演示EL中empty运算符对集合类对象的判断。

• 设计思路（实现原理）
• 编写EmptyEl类，在里面创建list集合，
• 编写emptyEl.jsp文件，用empty运算符读取list集合，判断是否为空
• 配置web.xml文件
• 通过浏览器访问EmptyEl，展现页面servlet处理响应信息。

二、实验实现                   

编写EmptyEl2，其代码如下：

编写emptyEl.jsp，其代码如下：

配置web.xml文件:

参考掩饰效果：启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter07/EmptyEl，浏览器显示的结果如下图所示：

三、实验总结

实验7-3  EL中的隐式对象

一、实验描述

1. 考核知识点

名称：EL中的隐式对象

• 练习目标
• 掌握EL中的隐式对象使用和作用范围。
• 需求分析

在Web开发中，PageContext、HttpServletRequest、HttpSession和ServletContext这四个对象之所以可以存储数据，是因为它们内部都定义了一个Map集合，这些Map集合是有一定作用范围的，在EL表达式中，为了获取指定域中的数据，提供了pageScope、requestScope、sessionScope和applicationScope4个隐式对象。本实验将模拟展示后台在域中存储数据并在页面显示。

• 设计思路（实现原理）
• 编写ELObjects类，在不同域中存储信息，
• 编写ELObjects.jsp文件，获取域中存储的数据展示
• 配置web.xml文件
• 通过浏览器访问ELObjects，展现页面servlet处理响应信息。

二、实验实现                   

编写ELObjects，代码：

编写ELObjects.jsp，代码：

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter07/ELObjects，浏览器显示的结果如下图所示：

三、实验总结

实验7-4  JSTL中的Core标签库

一、实验描述

1. 考核知识点

名称：JSTL中的Core标签库

• 练习目标
• 掌握JSTL中的Core标签库中常用标签的语法和使用。
• 需求分析

在页面中JSTL的核心标签库使用非常广泛，本实验将使用其中几个常用标签模拟查询用户订单并在页面显示的效果。

• 设计思路（实现原理）
• 编写JSTLCore类，在里面模拟登录后的用户封装订单并返回页面显示，
• 编写Orders类，用来模拟存储订单信息的实体类，
• 编写JSTLCore.jsp用户订单查看页面，用来模拟查看用户订单信息，
• 配置web.xml文件
• 通过浏览器访问JSTLCore.jsp，展现页面servlet处理响应信息。

二、实验实现                   

编写JSTLCore类，代码：

编写Orders类，代码：

编写JSTLCore.jsp，代码：

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter07/JSTLCore.jsp，浏览器显示的结果如下图所示：

然后点击上方的登录链接，再查看页面效果，浏览器显示的结果如下图所示：

三、实验总结

6-1编写第一个JSP文件

一、描述

1、考核知识点

    名称：编写第一个JSP文件  

2、练习目标

• 掌握实际开发中对html文件改写为JSP文件的方法。

3、需求分析

    可能在实际工作中，开发公司都会是前后端分离，前段可能只是设计html网页，后台开发人员就需要将html页面更改为动态的jsp文件，同时再根据需求绑定一些ajax事件等。本就简单的介绍将html文件改为jsp文件的基本方法。

4、设计思路（实现原理）

1. 创建login.html静态的登陆文件，
2. 将login.html进行更改替换为login.jsp文件

       3）通过浏览器访问login.jsp，展现页面信息。

二、实现

编写login.jsp，粘贴代码：

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter06/login.jsp，实验效果如下图：

三、总结

通过实例操作，可以了解jsp的基本语法。

6-2  include指令

一、描述

1. 考核知识点

名称：include指令

• 练习目标
• 熟悉常用开发中include指令的用法。
• 需求分析

实际开发网页中，将网页根据功能结构划分为多个模块，比如说一个淘宝商城，顶部有登陆、注册等导航页，左侧有主题市场类别导航，最底部是网站信息和版权等。其中这些基本的公用页面就可以使用include指令包含进来各个公共的jsp页面。本就模拟一个简单的网页使用include指令做法。

• 设计思路（实现原理）
• 编写一个head.jsp的顶部页面
• 编写一个content.jsp的内容页面
• 编写一个foot.jsp的底部页面
• 在content.jsp的内容页面中使用include指令引入其他公用jsp文件。

二、实现                           

编写head.jsp，粘贴代码：

编写content.jsp，粘贴代码：

编写foot.jsp，粘贴代码：

启动Tomcat服务器，在地址栏中输入http://localhost:8080/f2/content.jsp，浏览器显示的效果如下图所示：

三、总结

通过实训，可以了解jsp include函数的使用方式。

6-3  exception对象

一、描述

1. 考核知识点

名称：exception对象

• 练习目标
• 掌握jsp页面中exception对象的基本使用。
• 需求分析

在jsp页面编写或者遍历后台传递的数组集合等数据的时候都可能出现意外，导致jsp页面产生错误信息，如果是运行时异常则会在页面产生错误，这时就可以使用exception对象进行捕获来查看具体错误信息。

• 设计思路（实现原理）
• 创建order.jsp页面，书写错误代码，并引入错误异常jsp页面
• 创建errorjsp异常捕获页面

       3）通过浏览器访问order.jsp，查看页面信息。

二、实现

创建order.jsp，粘贴代码：

创建error.jsp，粘贴代码：

启动Tomcat服务器，在浏览器的地址栏中输入URL地址http://localhost:8080/chapter06/order.jsp，显示的效果如下图所示（显示异常问题）：

三、总结

通过实验，可以了解JSP的错误页面设置。

6-4 <jsp:forward>动作元素

一、描述

1、考核知识点

    名称：<jsp:forward>动作元素   

2、练习目标

• 熟悉<jsp:forward>动作元素的使用。

3、需求分析

    开发的时候可能会存在一个中间跳转页面，根据不同的结果向不同的页面进行跳转。本就简单模拟一个随机情况下同一个请求跳转不同页面的情况。

4、设计思路（实现原理）

1. 创建一个jspForward.jsp跳转页面，编写不同跳转情况也跳转页面
2. 创建2个跳转页面forward1.jsp和forward2.jsp
3. 通过浏览器访问jspForward.jsp，查看页面信息。

二、实现

       创建jspForward.jsp，粘贴代码：

       创建forward1.jsp，粘贴代码：

创建forward2.jsp，粘贴代码：

启动服务，访问jspForward.jsp可看到浏览器显示效果如下图：

刷新多次此页面后可看到浏览器显示如下图：

三、总结

通过jsp:forward元素的练习，可以理解并掌握jsp的跳转技术。

代码：

5-1 Cookie对象和常用API介绍

一、描述

1、考核知识点

    名称：Cookie对象和常用API介绍

    编号：028005002

2、练习目标

• 掌握Cookie对象和常用API的运用。

3、需求分析

    现状电商网站发展迅速，在网站浏览的客户，包括非注册用户较多，时常浏览各种商品信息，在用户关闭浏览器，下次再进行访问的时候，有些网站会记住该浏览器用户上次的访问查看记录，这是一种非常便捷友好的设计。本就模拟演示展示用户上次浏览商品记录信息。

4、设计思路（实现原理）

1. 创建Demo1类继承Httpservlet类，
2. 在Demo1中获取所有的cookie并遍历，查看是否有上次存储的浏览商品记录信息，然后进行相关处理
3. 在web.xml中配置初始化参数和类的映射

       4）通过浏览器访问Demo1，查看页面效果。

二、实现

编写Demo1，

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/f2/ Demo1，首次访问浏览器显示的结果如下图所示：

在浏览器上新打开一个页面，再次访问http://localhost:8080/f2/ Demo1，浏览器显示的结果如下图所示：

三、总结

通过实验可以简单了解cookie原理。

5-2 Session对象和常用API介绍

一、描述

1、考核知识点

    名称：Session对象和常用API介绍

    编号：028005004

2、练习目标

• 掌握Session对象和常用API的运用。

3、需求分析

    在实际运用中的表单信息提交的时候，可能会由于网络原因导致提交页面刷新缓慢，有些用户就会重复提交表单，就会产生重复数据和请求。本就模拟演示在servlet中如何使用session对象控制表单重复提交。

4、设计思路（实现原理）

1. 创建Demo2类，用户返回表单，同时生成唯一的随机token，
2. 创建Demo2类， Demo2类中获取提交的表单信息，同时验证token来验证用户是否重复提交，
3. 在web.xml中配置初始化参数和类的映射

       4）通过浏览器访问Demo2，查看页面效果。

二、实现

编写Demo2，

编写Demo3，

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter05/ Demo2，访问浏览器显示的结果如下图所示：

在输入框随机输入用户名，如”zhangsan”，连续2次点击提交按钮，浏览器显示的结果如下图所示：

再在浏览器上新打开一个页面，再次在地址栏中输入http://localhost:8080/f2/ Demo2，在浏览器输入框输入用户名，后再次点击一次提交按钮，短暂延迟后浏览器显示的结果如下所示：

三、总结

通过实验可以简单了解session会话原理。

5-3 Session的超时管理

一、描述

1、考核知识点

    名称：Session的超时管理

    编号：028005005

2、练习目标

• 掌握Session失效的一般用法和场景。

3、需求分析

    在实际网站用户登陆后，在浏览其他页面过程中，可能中间会有其他事情停顿，一段时间内没有对该网站页面再次发送请求访问，待到一定时间过后（即保存登陆用户信息的session超时），当该用户再次点击其他请求链接的时候，就会返回到登陆界面，要求用户重新登陆。本将模拟简单的登陆然后session超时跳转到再次登陆界面。

4、设计思路（实现原理）

1. 创建User用户实体类，有username和password两个属性，
2. 创建Demo4类，Demo4类提供用户登陆跳转方法，
3. 创建Demo5类，Demo5类模拟session超时失效，然后再次跳转到登陆页面
4. 创建login.html登陆页面，
5. 在web.xml中配置初始化参数和类的映射

       6）通过浏览器访问login.html，并进行相关操作，查看页面效果。

二、实现

编写User，

编写Demo4，

编写Demo5，

编写login.html，

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/f2/ login.html，访问浏览器显示的结果如下图所示：

在输入框随机输入用户名和密码，如”zhangsan”、”123”，然后提交，浏览器显示的结果如下图所示：

在上图中显示用户登陆成功，并将用户放在了session中管理，再点击上图中的查看手机商品链接，短暂延迟后浏览器显示的结果如下所示：

同时观察Eclipse项目控制台可以发现报错Session already invalidated（session已经失效），信息如下：

三、总结

5-4 [任务5-3]Session实现用户登录

一、描述

1、考核知识点

    名称：[任务5-3]Session实现用户登录

    编号：028005007

2、练习目标

• 掌握Session对象和常用API的运用。

3、需求分析

    在实际运用中的用户登陆网站中，多提供有记住密码和自动登陆等功能，方便同一用户短时间内不用再输入用户名和密码等繁琐信息可以快捷登陆。本将模拟用户自动登陆功能。

4、设计思路（实现原理）

• 创建login.html页面，编写用户登陆界面
• 创建Demo6类， 编写用户登陆判断逻辑处理和自动登陆业务，
• 在web.xml中配置初始化参数和类的映射

       4）通过浏览器访问login.html，进行相关操作，查看页面效果。

二、实现

编写Demo6，

配置login.html文件:

配置web.xml文件:

启动Tomcat服务器，在地址栏中输入http://localhost:8080/chapter05/ login.html，访问浏览器显示的结果如下图所示：

在输入框随机输入用户名，如”zhangsan”，第一次不选中自动登陆框，然后点击提交按钮，浏览器显示的结果如下图所示：

       则用户就会登陆网站了，当点击上图页面中的退出按钮就又返回到了初始登陆页面，如下所示；

可以在不输入用户名的情况下点击提交按钮，查看浏览器页面出现以下结果：

提醒用户输入用户名（因为还没有选中自动登陆功能），2秒后自动跳转到登陆页面，让用户必须登陆才可以；

第二次，在登陆界面随机输入用户名，如”zhangsan”，在勾选自动登陆框，点击提交按钮，浏览器显示结果如下：

则用户就会登陆网站了，当点击上图页面中的退出按钮就又返回到了初始登陆页面，这次不用输入用户名（必须在退出后的5秒内，因为代码中设置cookie的有效期是5秒钟），再次直接点击提价按钮，浏览器显示结果如下（用户实现了自动登陆功能）：（复制链接，点击退出之后，在浏览器新标签页5秒内粘贴链接，还是显示已经登录的状态）

三、总结

通过实验可以简单了解cookie用户登陆的过程以及自动登录的操作方式。

代码：

2.命名项目名称，可以随意命名，这里以【t1】为例，如图2所示。

3.在src/main/java处右键新建一个包，如图3所示。

4.命名包的名字，这里也以【t1】为例，如图4所示。

5.导入文末附件提供的代码包中的java文件，记得修改package的名字为你自己创建的package的名字（这里的名字见第4步）。如图5所示。

6.在src/main/webapp/WEB-INF导入文末附件提供的代码包的web.xml文件，如图6所示。

7.编辑web.xml，记得修改红框处的文字为你自己创建的包的名字。如图7所示。

8.编辑【ListBookServlet】和【PurchaseBookServlet】两个文件，将红框处的路径修改为你自己创建的项目（Project）的名字，如图8，图9所示。

9.此时就可以运行了，使用浏览器输入链接（这里的链接可以通过Eclipse内置的浏览器获得），可以打开网页，如图10所示。

10.对图10的任意一本图书点按”点击购买“，便会跳转到CartServlet。如果后退，再继续点击其他图书，则会叠加，如图11所示。

附件：本文所使用的代码包。

一、案例描述

1、考核知识点

Web 应用的介绍和配置  

2、练习目标

掌握实际开发中Web 配置简单运用。

3、需求分析

    当访问一个 Web 应用程序时，通常需要指定访问的资源名称，如果没有指定资源名称，则会访问默认的页面现，本案例将演示使用 2 中方式访问页面首页。

4、设计思路（实现原理）

1. 创建 my.jsp 网站首页，
2. 配置 web.xml 文件
3. 启动服务器，分别以两种路径情况访问 my.jsp 首页面。

二、案例实现

1.在已有的项目里创建一个新的JSP文件，如图1所示。

2.尝试编写一段简单的程序，如图2所示。

3.尝试运行输出，在IDE里面的运行结果参考图3所示。

4.修改web.xml，更改默认页面的名称，如图4所示。

5.根据要求，以my.jsp作为默认文件，先尝试使用完整路径访问，如图5所示。再使用目录路径（不完整）访问，如图6所示。网页显示结果相同，配置完成。

三、案例总结

学会了访问入口的配置方法

1. 理解C/S，B/S的结构
2. 熟悉web程序开发环境
3. 熟悉Tomcat服务器
4. 能够正确发布一个Web程序
5. 掌握实验环境的搭建步骤

二、 实训内容（小题）：

1. 简单举例实验电脑上的C/S，B/S不同架构的应用程序；
2. 尝试通过浏览器打开运行例题：1-1、1-2、1-3，看看运行效果如何。服务器端脚本和客户端脚本的不同。
3. 熟悉实验环境：eclipse平台的使用
4. 熟悉Tomcat的服务器结构，能够将一个Web程序发布到服务器，并且正确的通过浏览器浏览。
5. 浏览你经常去的一些网站，观察它所用的网页技术及其所具备的常用功能。
6. 课下在自己的电脑上安装本课程需要的实验环境。（课下完成）

三、 实训步骤：（具体做上面的实验内容，可以截图）

1. C/S 架构应用程序：微信,QQ 等社交软件 B/S 架构应用程序：网页服务，如淘宝

如需要进行环境的配置，教程可以参见JAVA-WEB课程环境配置。

• 分别运行 1-1，1-2，1-3 如图 1，图 2，图 3 所示。

3.完成环境的配置及运行，如图 4 所示。

1.在Eclipse官网下载 eclipse-jee-2021-06-R-win32-x86_64 的文件。大小应该有500多MB，如图1所示

2.解压，点击文件夹里面的【eclipse.exe】，启动程序。

3.点按Window-Preferences

4.按下图顺序点开Server-Runtime Environments，如果已经下载好了tomcat，使用search找到对应的文件夹。没有就Add下载一个。如图3所示。

5.创建第一个应用程序，步骤如图4，图5所示。

6.创建JSP文件，如图6，图7所示。

7.设置访问首页，如图8所示。

8.运行，用浏览器打开，此时可见URL中不会显示my.jsp，如图9所示。