Java Web应用开发项目教程- 课件 第1、2章 Java Web应用开发基础、E-Store电子商城项目概述

JavaWeb应用开发计算机与软件学院课程的任务Web服务、Web应用、B/S结构的应用将成为主流基础Web开发导论计算机网络技术静态网页设计数据库原理及应用任务Web应用的规划、设计动态页面设计与实现课程的基本内容

本课程选用教学内容JSPServletJSP技术力量背景强大语言环境(Java)教材及主要参考书目孙卫琴．Tomcat与JavaWeb开发技术详解（第2版）电子工业出版社耿祥义．JSP实用教程（第2版）清华大学出版社JSP程序设计类教材课时安排和成绩评定总学时：75学时，讲课与实验结合。成绩评定3次旷课没有平时成绩,3次迟到算旷课一次。30%30%平时成绩项目成绩40%期末考试作业考勤态度静态网页静态文档超文本HTML(HypertextMarkupLanguage,超文本链接标示语言)静态网页人工手动维护HTML代码交互性差动态网页动态网页交互性自动更新(信息）数据库的存取文件的访问…通过数据库进行动态网页的生成提高了网页设计和开发的效率保证Internet应用的数据一致性和设计风格的一致性提高Internet应用数据维护的方便性和效率。第1章JavaWeb应用开发基础■本章要点：★软件常用体系结构C/S和B/S结构

★静态网页和动态网页

★

Web应用和Web应用技术

★动态网页技术CGI/ASP/PHP/JSP

★JSP的常用开发模式

★

JavaWeb应用的运行环境

★

JDK的下载、安装和配置

★

Tomcat的下载、安装和配置

★编写简单的JSP程序，并能够使之在Tomcat等JSP服务器上运行1.1C/S结构与B/S结构■C/S结构

Client/Server软件系统分成Client和Server两个部分Client和Server通常处在不同的计算机上1.1C/S结构与B/S结构■优点●人机交互性强●具有安全的存取模式●网络响应速度快●利于处理大量数据■缺点●维护和管理的难度较大●需要安装相应的客户端程序●不同的操作系统系统开发不同版本的软件1.1C/S结构与B/S结构■B/S结构Browser/Server核心概念是将整个应用的主要业务逻辑集中在服务器端执行，而客户端只负责简单的数据表示和交互典型3层结构的Web应用1.1C/S结构与B/S结构Web应用建立在Web系统之上，而且加以扩展，即添加了业务功能简单来说，Web应用利用Web浏览器执行业务逻辑的Web系统后台数据库的支持使得其内容具有动态性1.1C/S结构与B/S结构1.1C/S结构与B/S结构■B/S结构的优点分布性强维护方便开发简单且共享性强总体拥有成本低■B/S结构的缺点数据安全性问题对服务器要求过高数据传输速度慢软件的个性化特点低1.2Web应用■Web应用基础

Web应用：网站，网站由大量的页面组成，每个页面通常是由一个或者多个文件组成。组成网站的大量文件之间通过特定的方式进行组织，并且由一个系统来管理这些文件。应用服务器：管理网站的文件1.2Web应用■网站的文件通常类型网页文件如.html、.jsp等网页的格式文件如.css等资源文件：文字、图形、声音、动画、资料库、以及各式各样的软件配置文件处理文件：用于对用户的请求进行处理，如供网页调用、读写文件或访问数据库等1.2Web应用■Web应用运行环境

客户端环境: 浏览器服务器端环境: 服务器端程序网络环境: 网络连接动态网页技术CGI/ASP/PHP/JSP■CGI(CommonGatewayInterface)●优点可以独立运行，易于使用●缺点当大量用户同时访问同一网页时会同时使用一个CGI应用程序，响应会变慢，Web服务器速度也会受到很大影响对服务器系统提出极高的要求。动态网页技术CGI/ASP/PHP/JSP■ASP(ActiveServerPages)微软1996年推出ASP不是一种语言而是一种技术使用VBScript、JavaScript等简单易懂的脚本语言，结合HTML代码无须编译，可以直接在服务器端执行动态网页技术CGI/ASP/PHP/JSP■ASP(ActiveServerPages)●优点支持动态网页功能，易于使用●缺点脚本是在服务器端运行的，只能在可以支持的服务器上运行，但目前只能在微软公司的NT平台的IIS服务器上执行,限制了ASP的应用。动态网页技术CGI/ASP/PHP/JSP■PHP(PersonalHomePage)是一种在服务器端执行的嵌入HTML文档的脚本语言，语言的风格有点类似于C语言，现在被很多的网站编程人员广泛的运用PHPPHP对MYSQL数据库的支持最全面，因此有人曾把“Apache+PHP+MYSQL”组合称作Web开发中的黄金搭档动态网页技术CGI/ASP/PHP/JSP■JSP(JavaServerPage)在服务器端编译执行的Web设计技术Sun公司1999年6月推出JSP技术是完全与平台无关的设计JSP环境下，HTML代码主要负责描述信息的显示样式，而程序代码则用来描述处理逻辑。JSP下的编程语言是Java动态网页技术CGI/ASP/PHP/JSP■JSP(JavaServerPage)广泛的服务器支持，同PHP类似，几乎可以运行于所有平台，如WindowsNT、Linux、Unix。WindowsNT下的IIS通过一个插件，例如JRUN或者ServletExec就能支持JSP1.4JSP的开发模式■纯粹JSP实现■JSP+JavaBean实现■

JSP+JavaBean+Servlet实现

■J2EE模式实现

1.5JavaWeb应用的运行环境主要涉及下述两方面内容■JDK的下载、安装和配置下载地址：/java/technologies/downloads

安装：直击双击即可，一路next；配置：涉及环境变量JAVA_HOME和添加相应path；■Tomcat的下载、安装和配置下载地址：/

安装：直击解压；配置：涉及环境变量CATALINA_HOME和添加相应path；

1.5JavaWeb应用的运行环境■JDK的下载和安装

JDK中包括Java编译器（javac）、打包工具（jar）、文档生成器（javadoc）、查错工具（jdb），以及完整的JRE（JavaRuntimeEnvironment，Java运行环境），也被称为PrivateRuntimeJDK开发工具包的官方网址为/java/technologies/downloads1.5JavaWeb应用的运行环境■JDK的下载和安装/java/technologies/javase/javase8u211-later-archive-downloads.html1.5JavaWeb应用的运行环境■JDK的下载和安装选择合适的JDK下载，如本机是32位机器，选择Windowsx86版本，64位机器选择windowsX64版本1.5JavaWeb应用的运行环境■JDK的下载和安装1.5JavaWeb应用的运行环境■配置JDK1.5JavaWeb应用的运行环境■配置JDK参考：/kevinlocn/archive/2009/10/12/1581855.html

1.5JavaWeb应用的运行环境■安装和配置Tomcat服务器

●Tomcat简介

是Sun公司官方推荐的Servlet和JSP容器Tomcat是完全免费的软件Tomcat和IIS、Apache等Web服务器一样，具有处理HTML页面的功能Tomcat处理静态HTML的能力不如Apache

1.5JavaWeb应用的运行环境■安装和配置Tomcat服务器

●下载Tomcat,可以直接在网络上搜索或者从Tomcat官方网站获取并解压。/1.5JavaWeb应用的运行环境■安装和配置Tomcat服务器

1、计算机>属性>环境变量,新建环境变量java_home,变量值tomcat的解压目录。2、添加java_home，值为JDK的安装路径3、启动:进入命令行cmd，输入startup.bat4、测试：http://localhost:8080,看tomcat是否正常启动5、关闭：进入命令行cmd，输入shutdown.bat1.5JavaWeb应用的运行环境■安装和配置Tomcat服务器

●测试安装Tomcat是否成功

1.6测试一个JSP程序■测试一个JSP程序

在安装成功后打开Tomcat安装目录，可以看到几个文件夹。其中，Tomcat将由JSP文件转译后的Java源文件和class文件存放在work文件夹下，bin为Tomcat执行脚本目录，conf文件夹下存放有Tomcat的配置文件，lib文件夹为Tomcat运行时需要的库文件，Tomcat执行时的日志文件存放在logs文件夹下，webapps为Tomcat的Web发布目录。按照下面的操作过程创建和运行第一个JSP程序：（1）在Tomcat安装目录下的Webapps目录中，可以看到ROOT、examples、manager、tomcat-docs之类Tomcat自带的Web应用范例。（2）在webapps目录下新建一个名称为HelloJsp的文件夹。（3）在HelloJsp下新建一个文件夹Web-INF。注意，目录名称是区分大小写的。1.6测试一个JSP程序■测试一个JSP程序（4）在Web-INF下新建一个文件web.xml，该文件为Tomcat的部署文件，并在其中添加如下代码：<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEweb-appPUBLIC"-//SunMicrosystems,Inc.//DTDWebApplication2.3//EN""/dtd/web-app_2_3.dtd"><web-app><display-name>MyWebApplication</display-name><description>AJSPapplicationfortest</description><welcome-file-list><welcome-file>Test.jsp</welcome-file></welcome-file-list></web-app>1.6测试一个JSP程序■测试一个JSP程序（5）在HelloJsp目录下创建文本文件，并为其指定文件名为Test.jsp。注意JSP页面的扩展名必须为.jsp。然后在该文本文件中输入如下代码：<%@pagecontentType="text/html;charset=gb2312"%><html><head><title>

第一个JSP程序

</title></head><body><h2align="center"><%=newjava.util.Date()%></h2></body></html>1.6测试一个JSP程序■测试一个JSP程序（6）启动Tomcat，当Tomcat重新启动时会自动部署webapps下的所有Web应用。（7）打开浏览器，输入http://localhost:8080/HelloJsp/Test.jsp第1章JavaWeb应用开发基础■思考题：1、简述HTTP协议和一次HTTP请求与响应的过程。2、试阐述JSP服务器端运行环境的安装与配置。3、试编写一个简单的JSP程序，并能够使之在Tomcat服务器上运行。

JavaWeb应用开发第2章E-Store电子商城项目概述■本章要点:

★E-Store电子商城需求 ★E-Store电子商城总体设计，包括系统架构设计、功能结构划分、业务流程设计 ★JavaWeb应用开发环境搭建 ★创建E-Store电子商城项目 ★JavaWeb应用程序组成及结构 ★网站欢迎页面实现 ★JSP基本语法2.1项目概述■E-Store电子商城简介

E-Store电子商城系统是基于Internet网络平台，利用Web技术、数据库技术、Java技术、面向对象技术等进行开发的Web应用系统。系统中不同权限的用户分别可以实现商城的管理和网上购物等操作。

实现：JSP+BeanJSP+Bean+Servlet基于springMVC框架2.2系统分析与总体设计■前台功能结构图2.2系统分析与总体设计■后台功能结构图2.2系统分析与总体设计■前台业务流程图2.2系统分析与总体设计■后台业务流程图2.2系统分析与总体设计■系统预览

前台首页

商品详细信息展示

2.2系统分析与总体设计■系统预览

购物车查看页面后台订单信息显示页面

2.2系统分析与总体设计■系统预览后台商品添加页面

后台用户管理页面2.3系统架构设计与搭建■系统架构设计2.3系统架构设计与搭建■业务实体介绍●会员（Customer）：代表一个会员实体，主要包括会员的详细信息。如会员名，密码，地址等。●商品信息（Product）：代表每一个具体的商品信息，主要包括商品名称、类别、产地、价格等。●商品类别（Category）：代表商品类别信息，主要包括商品所属类别、名称等。●购物车（Cart）：代表会员一次购物时商品暂时存放的地方，在生成订单后便不再需要。2.3系统架构设计与搭建■业务实体介绍●购物车中的具体商品（CartItem）代表购物车中每一个具体商品的购买情况，包含购买价格、数量等。●订单（Order）代表会员的订单，主要包括订单号，会员信息，订单的具体内容。●订单明细（OrderItem）代表订单中具体项，一个订单应包括一个或多个商品的购买情况。2.3系统架构设计与搭建■业务实体关系图2.3系统架构设计与搭建■

业务逻辑设计DAO模式2.3系统架构设计与搭建■

开发环境

服务器端：

操作系统：Windows10Web服务器：Tomcat9.0以上开发环境：EclipseOxygen.3aReleaseWeb开发框架：SpingMVCJava开发包：JDK1.8.0_311以上数据库：MySQL8.0.15浏览器：IE7.0以上分辨率：最佳效果为1024×768像素客户端：浏览器：IE7.0及以上版本分辨率：最佳效果为1024×768像素

2.3系统架构设计与搭建■

启动EclipseOxygen.3aRelease集成开发环境

2.3系统架构设计与搭建■

创建工程项目

1)选择【File】→【New】→【Project】2)如下图所示，工程类型选择【DynamicWebProject】2.3系统架构设计与搭建

3)如下图所示，在ProjectName处填写工程名E-Store，其他选项保持默认值，单击Finish按钮，Web工程就创建结束。2.3系统架构设计与搭建■

Web应用的目录结构

目录描述/WebContentWeb应用的根目录，所有的JSP、HTML文件、CSS文件、资源文件都存放于此目录下，可在此目录下创建其他目录，以便于文件的管理。/WebContent/WEB-INF存放Web应用的发布描述文件web.xml等。/WebContent/WEB-INF/classes存放各种class文件，javaweb组件Servlet类文件也放于此目录下。/WebContent/WEB-INF/lib存放Web应用所需的各种jar文件，如可以存放JDBC驱动程序的jar文件。2.3系统架构设计与搭建■

E-Store应用的目录

2.4JSP页面基本语法■

JSP元素2.4JSP页面基本语法■

JSP元素_指令格式：包含在<%@%>标签里作用：向JSP引擎提供该页的全局信息。例如：页面的状态，错误处理，是否是session的一部分等。指令类型：page指令include指令taglib指令

2.4JSP页面基本语法■

JSP元素_指令例如：指定在页面中引入其他的Java类，可用：

<%@pageimport="java.util.Date"%>当本页面在执行过程中发生异常时将把异常信息传送到errorPage.jsp统一处理，可用：

<%@pageerrorPage="errorPage.jsp"%>设置JSP文件执行后返回给浏览器的文件类型和字符编码方式，缺省为：

<%@pageContentType="text/html;charset=ISO-8859-1"%>指明返回给浏览器的文件是普通的HTML类型的文本文件，字符编码方式是ISO-8859-12.4JSP页面基本语法■

JSP元素_

注释输出注释两种不同类型的注释：HTML、JSPHTML注释客户端源文件可以看到：

<!--comment[<%=expression%>]-->

例如：

<!--现在时间为：<%=(newjava.util.Date()).toLocaleString()%>-->

在客户端的HTML源文件中显示为：

<!--现在时间为：January1,2009-->

2.4JSP页面基本语法■

JSP元素_

注释隐藏注释JSP注释是JSP本身用于描述JSP程序代码的注释，用于描述JSP页面执行后的结果页面。格式如下：

<%--JSP的注释不会在客户端显示--%>例如：<%--现在时间为：<%=(newjava.util.Date()).toLocaleString()%>--%>2.4JSP页面基本语法■

JSP元素_

注释在JSP的“脚本代码”部分，“Scriptlet”可以直接在“<%%>”中使用Java的语法，所以下面形式的注释也是合法的：

<%/*这是一个Scriptlet中的注释*/%>

<%/**这也是一个Scriptlet中的注释，可以用javadoc从生成的Java文件中提取出注释来*/%>2.4JSP页面基本语法■

JSP元素_

脚本

在JSP中，主要的动态程序部分是脚本元素。声明（Declaration）：用于声明一个或多个变量和方法。表达式（Expression）：一个完整的语言表达式。脚本代码（Scriptlet）：程序片断。2.4JSP页面基本语法■

JSP元素_

脚本1）声明用于声明一个或多个变量和方法，这些声明不会被输出到浏览器中去。在声明元素中声明的变量和方法将在JSP页面初始化时被赋初值。语法为： <%!Declaration%> <%!inti=0;%> <%! publicStringf(inti){ if(i<3)return("..."); ... } %>2.4JSP页面基本语法■

JSP元素_

脚本

2）表达式

JSP中的表达式可以被看作一种简单的输出形式，但表达式一定要有一个可以输出的值。

语法为：<%=expression%>例如：

<%=(newjava.util.Date()).toLocaleString()%>

在页面上输出目前日期的值。2.4JSP页面基本语法■

JSP元素_

脚本

3）脚本代码

JSP的代码部分，其中可以使用任何Java的语法。语法为：<%scriptlet%>

<% if(Calendar.getInstance().get(Calendar.AM_PM)==Calendar.AM){%>GoodMorning,nowis:<%=(newjava.util.Date()).toLocaleString()%><% }else{%>GoodAfternoon,nowis:<%=(newjava.util.Date()).toLocaleString()%><% }%>2.4JSP