JavaWeb项目式开发教程电子教案 项目6 构建高效的Java Web应用

项目6构建高效的JavaWeb应用教学单元任务6.1使用JavaBean+JSTL实现商品查询授课时数6授课类型理实一体课授课地点多媒体教室/机房授课对象计算机类专业二年级学生一、教学分析教学目标掌握JavaBean的规范要求和在JSP中的使用方式；掌握EL表达式的基本语法、隐式对象和运算符；掌握JSTL核心标签库的使用方法；能使用JavaBean+EL+JSTL替代JSP中嵌入的Java代码，实现商品查询功能。学情分析前面的项目中JSP页面中混杂了大量Java脚本，代码臃肿难以维护。是否能实现“JSP页面不写Java代码”，EL表达式取值路径和JSTL标签语法需要掌握和适应。教学重点JavaBean规范；EL表达式在不同作用域查找属性的规则；JSTL核心标签；useBean四个范围的区别。教学难点EL在不同作用域自动查找属性的优先级，可能产生意外取值；JavaBean+JSTL方案与原始JSP脚本方案的代码量和可维护性比较。二、教学方法与手段教学方法和手段讲授法、案例法、任务驱动法、直观对比法。三、教学实施教学环节教学内容新知导入展示一个用Java脚本实现的商品查询JSP页面，代码混杂难以阅读；再展示用EL+JSTL实现的同一页面，简洁清晰。提问："哪种写法更容易维护？怎么把Java代码从JSP中移除？"引出JavaBean+EL+JSTL技术。知识讲解6.1.1JavaBeanJavaBean是可重复使用的软件组件，通过封装属性和方法，JavaBean可以是具有特定功能或处理某项业务的对象。JavaBean不仅可以大幅扩展Java程序的功能，还能够通过其组合快速生成新的应用程序。它具有如下特点。•易于扩展、维护、使用、编写。•具备很强的可移植性，但局限于Java平台。•便于传输，可在本地或网络环境中使用。•能以组件形式与其他模块协同工作。JavaBean是一个Java类，必须遵循以下规则。•JavaBean是一个没有主方法的类，并且不需要继承于Object类。•JavaBean类必须属于一个包，而不能是单独的一个类。•JavaBean类的访问权限必须是public。•JavaBean类必须包含一个无参的构造方法。•JavaBean类中的属性的访问权限必须声明为private。•用一组Setter方法和Getter方法设置和获取JavaBean类中的内部属性，这些方法的访问权限必须是public。JavaBean的定义【例6-1】定义一个封装会员登录信息的JavaBean。在JSP中使用JavaBeanJSP提供了useBean、setProperty、getProperty三个动作标签来实现对JavaBean的应用。（1）useBean动作标签<jsp:useBeanid="JavaBean实例名"class="JavaBean类全限定名"scope="作用范围"/>（2）setProperty动作标签<jsp:setPropertyname="JavaBean实例名"param="参数名"property="属性名"value="{值|<%=表达式%>}"/>（3）getProperty动作标签<jsp:getPropertyname="JavaBean实例名"property="属性名"/>【例6-2】访问JavaBean的属性。【例6-3】使用setProperty动作标签的param属性赋值。【例6-4】使用property="*"实现赋值。3.JavaBean的有效范围在使用useBean定义JavaBean时，scope属性的取值范围决定了JavaBean的生命周期，即JavaBean的存活时间。•page范围：表示JavaBean的有效范围为当前页。•session范围：表示JavaBean的有效范围为本次会话。•request范围：表示JavaBean的有效范围为本次请求。•application范围：表示JavaBean的有效范围为整个应用程序。6.1.2ELEL是JSP2.0引入的简洁的语言，为了简化JSP页面中对象的访问方式，其主要特点如下。•可以访问JSP的内置对象，即访问pageContext、request、session、application等对象。•简化了对JavaBean的访问方式。•简化了对集合的访问方式。•可以通过关系、逻辑和算术运算符进行运算。•可以进行条件输出。1.EL基本语法EL的语法非常简单，以“${”开始，以“}”结束。${表达式}【例6-5】使用EL表达式输出JavaBean的值。2.EL关键字EL定义了16个关键字，这些关键字具有特殊含义，并且EL中的标识符不能使用关键字。andornotinstanceofeqgtneleltgedivmodemptytruefalsenull3.EL隐式对象为了更加方便地进行数据访问，EL提供了11个隐式对象，这些对象类似于JSP的内置对象，可以通过对象名进行操作。【例6-6】不同作用域下的隐式对象。【例6-7】param隐式对象的使用。•pageContext：表示JSP页面的上下文，可以获取JSP中的page、request、session、application对象，并且可以获取它们的方法•pageScope：表示page作用域范围的Map对象•requestScope：表示request作用域范围的Map对象•sessionScope：表示session作用域范围的Map对象•applicationScope：表示application作用域范围的Map对象•param：封装request.getParameter()方法，获取request对象中的参数值，返回值为String类型•paramValues：封装request.getParameterValues()方法，获取request对象中所有同名参数值的集合，返回值为String数组•header：获取HTTP请求头中一个具体的对象值，返回值为String类型•headerValues：获取HTTP请求头中所有对象的值的集合，返回值为String数组•cookie：获取当前请求的所有Cookie，并通过指定的Cookie名称访问•initParam：获取Web应用初始化参数的Map对象3.EL运算符EL提供了算术运算符、比较运算符、逻辑运算符、条件运算符和空运算符五种运算符。算术（+-*/div%）比较（==eq/!=ne/>gt/<lt/>=ge/<=le）逻辑（&&and/||or/!not）空（empty判断null或空集合）条件（A?B:C）。6.1.3JSTLJSTL（JavaServerPagesStandardTagLibrary，JSP标准标签库）是由Apache的Jakarta项目组开发的标准通用型标签库，是实现JavaWeb中常见的通用功能的定制标签库的集合。JSTL已纳入JSP2.0规范，是JSP2.0最重要的特性之一。JSTL提供的标签库主要分为五大类：核心标签库、国际化输出标签库（I18N标签库）、XML标签库、SQL标签库和EL函数标签库。•核心标签库（c）：/jsp/jstl/core，输入输出、流程控制等标准Java核心功能•I18N标签库（fmt）：/jsp/jstl/fmt，格式化数据操作，支持使用本地资源进行JSP页面的国际化•XML标签库（xml）：/jsp/jstl/xml，XML解析处理•SQL标签库（sql）：/jsp/jstl/sql，数据库连接、查询等功能•EL函数标签库（fn）：/jsp/jstl/functions，字符串处理1．安装和配置JSTL本书使用的是JSTL1.2，可以在MVN官方仓库下载和使用该版本。2．核心标签库核心标签库是JSTL中最重要的标签库，也是最常用的标签库。核心标签库中的标签按功能分为表达式标签、异常标签、条件标签、迭代标签和URL标签和。要在JSP中使用JSTL的核心标签库，必须使用taglib指令进行导入。<%@taglibprefix="c"uri="/jsp/jstl/core"%>（1）表达式标签：out标签、set标签、remove标签<c:outvalue="EL表达式"[default="默认值"]/><c:setvar="变量名"value="变量值"[scope="存储范围"]/><c:removevar="变量名"scope="存储范围"/>（2）异常标签<c:catchvar="异常名称"></c:catch>【例6-8】JSTL表达式标签和异常标签的使用。（3）条件标签：if标签<c:iftest="条件"[var="变量名"][scope="变量范围"]> //执行代码</c:if>choose标签when标签otherwise子标签<c:choose> <c:whentest="条件"> //执行代码 </c:when> <c:otherwise> //执行代码 </c:otherwise></c:choose>【6-9】JSTL条件标签的使用。（4）迭代标签forEach标签<c:forEachvar="变量名"items="集合对象"varStatus="状态信息"> //执行代码</c:forEach>或<c:forEachbegin="begin"end="end"step="step">//执行代码</c:forEach>【例6-10】forEach标签迭代集合元素。【例6-11】forEach标签指定循环范围。forTokens标签<c:forTokensitems="字符串"delims="分隔符"var="变量名"varStatus="遍历状态"> //执行代码</c:forTakens>【例6-12】forTokens标签的使用。（5）URL标签import标签<c:importurl="文件URL"[var="变量名"][scope="范围"][charEncoding="字符集"]/>redirect标签<c:redirecturl="定向资源URL">[<c:paramname="参数名"value="参数值"/>]</c:redirect>url标签<c:urlvalue="URL地址"[var="变量名"][scope="范围"]>[<c:paramname="参数名"value="参数值"/>]</c:url>3.I18N标签库I18N标签库用于创建支持多种语言的国际化Web项目，并对数字、时间和日期的输出进行标准化。<%@tagliburi="/jsp/jstl/fmt"prefix="fmt"%>【例6-13】I18N标签库的使用。任务实施：创建chap0601项目导入JAR包文件创建perties配置文件创建用于封装商品信息的JavaBean文件Product.java创建用于获取商品信息集合的JavaBean文件ProductList.java创建商品查询页面product-search.jsp新建css.css外部样式表文件启动服务，查看效果教学总结总结JavaBean+EL+JSTL三者协作关系：JavaBean封装数据和业务，Servlet处理请求并存数据到作用域，JSP使用EL取值+JSTL渲染。强调“JSP页面不写Java代码”的目标和实现路径。四、课后巩固与拓展简述JavaBean的定义需要遵循的规范。2.在product-search.jsp中使用JSTL的<c:if>标签，当搜索无结果时显示"未找到相关商品"。3.使用<fmt:formatDate>格式化商品上架日期，使用<fmt:formatNumber>格式化商品价格。教学单元任务6.2基于Maven和MVC模式实现将商品加入购物车授课时数5授课类型理实一体课授课地点机房授课对象计算机类专业二年级学生一、教学分析教学目标理解JSP开发模式的演进及各层职责；掌握Maven的核心功能；掌握Maven与IDEA的版本对应关系和配置方法；能基于Maven+MVC模式实现购物车的加入和查看功能。学情分析学生前面完成的项目，项目结构较混乱，所有Java文件均放src根目录中，对分层概念停留在理论上。Maven的目录约束和POM依赖管理是全新的工作方式，不清楚。Model2MVC中各层的调用关系和职责划分不清晰。教学重点Model2MVC模式三层职责划分；MavenPOM依赖管理、标准目录结构和生命周期；基于Maven的MVC项目分层实现。教学难点MVC各层之间的调用关系和职责边界；Maven依赖传递冲突的排查；Session中存储购物车的数据一致性问题。二、教学方法与手段教学方法和手段讲授法、案例法、任务驱动法、类比法。从无Maven无分层项目（所有代码混在一起）开始改造，让学生感受Maven统一项目结构和MVC分层的价值。三、教学实施教学环节教学内容新知导入回顾之前项目中将Java代码、数据库操作、Servlet处理全部混在一起的代码结构，提问：“如果项目有几百个类，这样的结构能维护吗？有没有办法把不同职责的代码分开管理？"引出MVC分层和Maven项目管理。知识讲解6.2.1JSP开发模式在Web开发中，JSP最初是作为Servlet的一种简化形式出现的。为了更方便地使用JSP技术，其开发模式经历了从Model1模式到Model2MVC模式的演变过程。Model2MVC模式是经典MVC模式的一种扩展，它被特别调整以满足Web环境的需求。1MVC模式MVC是20世纪70年代XeroxPARC（施乐公司帕洛阿尔托研究中心）为编程语言Smalltalk-80开发的一种设计模式。这种模式的基本原则是“关注点分离”，即将用户界面（UserInterface，UI）的设计与程序逻辑分离。基于MVC设计模式，可将应用程序分成三个互相独立的部分：Model（模型）、View（视图）和Controller（控制器）。这样可以让开发者独立开发和优化应用程序的不同方面。用户通过View交互操作，可以在View提供的用户界面上浏览数据或发送请求，View将用户的操作通知给Controller。Controller评估用户的操作（可能还有其他输入），并与Model交互以更新状态。Model在自身状态变化后，将通知View和Controller，使它们能够相应地更新。View从中获取更新后的数据，并重新渲染用户界面。2Model1模式Model1模式的View、Model和Controller全部集中在一个JSP页面中实现。对早期的Model1模式进行改进，将可以重复使用的组件从JSP页面中抽取出来交给JavaBean处理。当用户发送一个请求时，服务器通过JSP作为View调用被分离的JavaBean，这部分JavaBean负责相关数据的存取、逻辑运算等职责，并将执行结果返回给JSP页面作为用户的响应。3Model2MVC模式Model2MVC模式与前面提到的MVC模式类似，但在JSP中，JSP页面充当View，让Servlet完成处理任务充当Controller，JavaBean则只处理数据访问。基于Model2MVC构建的Web项目，客户端浏览器的请求被传递到Controller，Controller通过执行业务逻辑来获取需要显示的数据内容，并决定哪些JSP页面将显示这些数据内容，即由View把Controller传递的内容呈现出来。Model2MVC和Model1的区别：•Model2MVC使用Controller来处理用户请求，而Model1在JSP中处理用户请求。•Model2MVC通过Controller访问Model中的JavaBean对象，以处理业务逻辑。•Model2MVC通过Controller对Model中的JavaBean进行赋值和取值。•Model2MVC通过Controller基于请求的URL分派request对象到各个View。•Model2MVC的View中不存在业务逻辑，JSP页的功能是提交用户输入、显示被实例化bean中的数据。6.2.2Maven为了简化项目的依赖管理和构建流程，开发者通常会创建基于Maven的JavaWeb项目。通过Maven，项目的依赖管理、构建和发布可以实现自动化。什么是MavenMaven是Apache下的一个开源项目，在JavaWeb开发中，它是一个非常重要的工具，特别是在大型项目和团队开发中。Maven可以管理项目的依赖、构建生命周期、配置插件等，有助于简化项目的构建和管理过程。（1）依赖管理（2）构建和打包（3）项目结构管理（4）生命周期管理（5）插件支持2Maven仓库Maven仓库是存储构建Maven项目所需依赖的地方，Maven使用仓库来下载和管理项目的库（即依赖项），并将构建产物（如JAR文件、WAR文件）上传到仓库以供其他项目使用。（1）本地仓库（LocalRepository）本地仓库存储在开发者本地机器上的仓库，默认存储在用户目录下的.m2\repository文件夹中。（2）中央仓库（CentralRepository）中央仓库是Maven的官方公共仓库，包含了大量的开源库和框架。（3）私服（远程）仓库（PrivateRepository）企业内部或团队可以配置其他远程仓库，作为企业的私有仓库，用于存储企业内部或团员开发的库或一些特殊的依赖。3.Maven的下载和安装Maven的安装非常简单，从Maven官网下载安装包并解压到本地磁盘任何位置即可。由于Maven和IDEA各自独立迭代版本，不同版本间的兼容性问题频发，这影响了开发者的开发进度和效率。本书采用的IDEA的版本是IntelliJIDEA2021.1，所以选择Maven3.8.1进行下载和安装。4.Maven的配置Maven的配置包括全局配置和IDEA中的配置。Maven的全局配置文件settings.xml通常位于Maven安装目录下的conf文件夹中，也可以在用户目录下的.m2文件夹中找到（例如~\.m2\settings.xml）。主要配置项包括：（1）仓库设置：配置Maven使用的远程仓库和本地仓库路径。（2）代理设置：配置Maven通过代理服务器访问互联网。（3）镜像设置：配置Maven使用的镜像站点来加速下载依赖项。在IDEA中使用自行下载的Maven之前需要对其进行配置：（1）打开IDEA，选择“File|Settings”，打开“Settings”对话框。在左上方的搜索框中输入“maven”，找到Maven配置选项卡。（2）“Mavenhomepath”、“Usersettingsfile”和“Localrepository”配置是IDEA的默认配置，修改为自行下载的Maven。【例6-14】Maven的全局配置。6.2.3基于Maven的MVC简单应用以Model2MVC框架模式为规范，即以JavaBean+JSP+Servlet的形式来创建基于Maven的简单Web项目，Web项目结构如下。（1）Model层：以JavaBean形式创建实体类映射数据表，指定实体类的属性与数据表的字段对应。（2）DAO层：封装实体类的所有功能，可供其他层调用。（3）Servlet层：接收用户请求，根据业务逻辑实例化实体类，并返回给View。（4）View层：接收Servlet发送的信息，并将其展示到客户端的浏览器上。【例6-15】基于Maven的Model2MVC模式创建JavaWeb项目，输出所有商品信息。任务实施：创建chap0602项目修改Web项目基本配置创建perties配置文件创建用于封装商品信息的JavaBean文件Product.java创建用于封装购物车信息的JavaBean文件Cart.java创建用于封装购物车视图对象信息的JavaBean文件CartVo.java创建用于提供数据源对象的公共类文件DBUtil.java创建用于处理product表的数据库访问类文件ProductDao.java创建用于处理cart表的数据库访问类文件CartDao.java创建用于处理请求商品列表信息的Servlet类文件ProductListServlet.java创建用于处理指定用户将商品添加到购物车请求的Servlet类文件CartAddServlet.java创建用于处理显示指定用户购物车信息请求的Servlet类文件MyCartServlet.java创建用于输出所有商品信息的页面文件product_list.jsp创建用于显示指定用户的购物车信息的页面文件mycart.jsp新建css.css外部样式表文件运行项目，查看效果教学总结总结Model2MVC的完整分层体系，包括实体Entity、数据访问DAO、业务层Service、控制层Servlet、视图层JSP；Maven在项目中的实际价值包括依赖自动管理、统一项目结构、构建自动化等；购物车功能的MVC实现流程，包括商品列表、点击加入、CartAddServlet、CartDao、Session购物车、mycart.jsp展示。四、课后巩固与拓展简述什么是MVC模式。比较JSPModel1模式和JSPModel2MVC模式的区别。3.在购物车功能中增加删除商品（所有该商品从购物车移除）功能。教学单元任务6.3基于前后端分离架构实现商品浏览授课时数5授课类型理实一体课授课地点机房授课对象计算机类专业二年级学生一、教学分析教学目标理解前后端分离架构的设计思想和优劣势；掌握RESTfulAPI的设计原则；掌握使用Gson实现Java对象与JSON的序列化；掌握使用jQuery+AJAX调用后端API并渲染页面；能实现基于前后端分离的商品浏览功能。学情分析学生对Ajax异步请求有初步认知，但多数未实际编写过前后端分离项目。JSON格式虽然简单，但Java到JSON的序列化不熟悉。跨域问题是前后端分离的常见障碍，学生不理解。教学重点前后端分离架构的设计原理；RESTfulAPI设计；Gson序列化；jQueryAJAX请求配置和跨域解决方案。教学难点跨域问题和Access-Control-Allow-Origin响应头的设置；前后端联调时错误定位；JSON数据与Java对象的字段映射一致性。二、教学方法与手段教学方法和手段讲授法、案例法、任务驱动法、类比法。三、教学实施教学环节教学内容新知导入打开淘宝/京东首页，F12打开Network面板刷新页面，展示大量异步API请求。提问：“为什么网页不用刷新就能看到新数据？”“这些/开头的请求返回的是JSON数据，和之前学的JSP页面返回HTML有什么区别？”引出前后端分离架构。知识讲解6.3.1前后端分离架构1.什么是前后端分离前后端分离是指将Web应用程序的前端（用户界面）和后端（业务逻辑和数据处理）开发和部署分开的一种设计和开发模式。具体来说，前端负责构建用户界面并与用户交互，后端负责处理业务逻辑、访问数据库、提供API等。在前后端分离的架构中，前端和后端通过API（通常是RESTfulAPI）进行通信。前端通过发送HTTP请求（如GET、POST）来请求或提交JSON格式数据，后端处理这些请求和数据，将结果同样以JSON格式返回给前端。优势：（1）利于团队协作和并行开发（2）动态交互和异步更新（3）代码分离和技术灵活性高劣势：（1）架构复杂（2）数据同步复杂（3）网络开销大（4）接口安全问题2.前后端分离的技术（1）后端技术（Servlet+Gson）使用Servlet实现基于Maven的MVC模式的后端项目，负责处理请求、业务逻辑和数据访问，使用第三方库Gson来处理JSON数据。（2）前端技术（HTML+CSS+Jquery+AJAX）使用HTML+CSS展示用户界面，使用JQuery代码和AJAX与后端进行数据交换。3.RESTfulAPIREST（RepresentationalStateTransfer，描述性状态迁移）是一种基于Web的分布式系统架构风格，用来规范网络资源的访问方式。RESTfulAPI是遵循REST原则的一种WebAPI设计方式，通过HTTP实现。在设计RESTfulAPI时，每个资源都有一个唯一的URI（UniformResourceIdentifier，统一资源标识符）。/api/products或/api/product/{id}注意：RESTful风格的URL格式和传统URL格式的不同之处在于，传统URL格式的参数使用”？”连接在请求路径的后面，而RESTful风格的URL格式则将参数作为请求路径的一部分。在设计RESTfulAPI时，可以使用GET、POST、PUT和DELETE处理四种不同的请求操作。在设计RESTfulAPI时，可以使用HTTP状态码来表示请求的处理结果，状态码能够直观地告知客户端请求的结果如何，从而帮助客户端决定下一步的操作。4.JSON数据格式前后端项目的通信通常需要遵循统一的数据格式，JSON（JavaScriptObjectNotation，JavaScript对象表示法）是最常用的一种格式。JSON是一种轻量级的数据交换格式，既易于人类阅读和编写，又便于机器解析和生成。JSON的基本结构是由键值对组成的。•字符串："name":"iPhone14"•数字："price":999.99•布尔值："available":true•数组："features":["5G","128GBStorage","A15BionicChip"]•对象："dimensions":{"height":146.7,"width":71.5,"depth":7.4}•空值："discount":null【例6-16】设计所有商品信息的JSON数据格式。6.3.2后端实现RESTfulAPI为了简化Java对象与JSON格式之间的转换过程，使在Servlet中发送JSON数据变得更加简单和高效，一般会使用第三方库来完成这个转换过程。其中Gson凭借功能强大、易于使用、成熟且可靠等优势成为许多开发者的首选。Gson是一个Java库，专门用于转换Java对象和JSON数据。Gson库提供