实验1.在Eclipse中开发Web应用 实验内容 在这个实验中,将学习在Eclipse+MyEclipse8.6集成开发环境下创建Web应用,创建 JSP、JavaBean、Servlet,并测试。 实验目的 ◆掌握Eclipse中Web应用的开发以及在Tomcat中的部署和访问。 ◆掌握JSP、JavaBean和Servlet的开发。 实验介绍 本实验将实现一个简单的登录功能,用户在登录界面输入用户名和口令。用户名和口 令需要进行客户端验证。如果输入的用户名和口令合法,会出现成功页面。如果用户名或口 令不合法, 则出现登 失收页面。 由于登录功能是通过MVC模式进行设计的,因此,在实现的时候也是采用分层实现的 方式。在这个实验中,将首先建立一个Wb应用,名字是myweb::然后进行视图层的实现, 涉及3个JSP页面:login jsp,.failure.jsp,success.jsp:接着进行模型层的实现,涉及1个 再接着是控制层的实现涉及1个Servleta:servlets.LoginServlet: 最后对整个Web应用进行测试 环境要求 服务器:Tomcat6.0 集成开发环境:Eclipse+MyEclipse8.6 实验指导 步骤1:创建Web应用myweb L.创建web工程 a)在主菜单中选择【File】→【New】→【Web Project】,出现New Web Project 对话框。如果没有【Web Project】则选择【File】→【New】→【Other】,在 弹出的菜单中再选择【Web Project】
实验 1. 在 Eclipse 中开发 Web 应用 实验内容 在这个实验中,将学习在 Eclipse+MyEclipse 8.6 集成开发环境下创建 Web 应用,创建 JSP、JavaBean、Servlet,并测试。 实验目的 ◆ 掌握 Eclipse 中 Web 应用的开发以及在 Tomcat 中的部署和访问。 ◆ 掌握 JSP、JavaBean 和 Servlet 的开发。 实验介绍 本实验将实现一个简单的登录功能,用户在登录界面输入用户名和口令。用户名和口 令需要进行客户端验证。如果输入的用户名和口令合法,会出现成功页面。如果用户名或口 令不合法,则出现登录失败页面。 由于登录功能是通过 MVC 模式进行设计的,因此,在实现的时候也是采用分层实现的 方式。在这个实验中,将首先建立一个 Web 应用,名字是 myweb;然后进行视图层的实现, 涉及 3 个 JSP 页面:login.jsp,failure.jsp,success.jsp;接着进行模型层的实现,涉及 1 个 JavaBean:beans.LoginBean;再接着是控制层的实现涉及 1 个 Servlet:servlets.LoginServlet; 最后对整个 Web 应用进行测试。 环境要求 服务器:Tomcat6.0 集成开发环境:Eclipse+MyEclipse 8.6 实验指导 步骤 1:创建 Web 应用 myweb 1. 创建 Web 工程 a) 在主菜单中选择【File】→【New】→【Web Project】,出现 New Web Project 对话框。如果没有【Web Project】则选择【File】→【New】→【Other】,在 弹出的菜单中再选择【Web Project】
New Web Project 回☒ Cr eate a Web Project reate a web project in the workspace or an external location Web Proiect Details Proiect Nane myweb Location ☑Use default location Directory D:\nyapp\HyEclipse 6.0\workspaceinyveb Browse. sre Web root folder WebRoot T2EE Specification Level O5ava里50OJ2理1.4OJ2E1.3 JSTL Support Add JSTL libraries to WEB-INF/lib folder? JSTL 1.1 iih☐Cacl b)在New Web Project对话框的【Project Name】文本框中输入myweb::J2EE Specification Level项选择“Java EE5.0”,点击【Finish】按钮。 c)观察【package】视图中出现如下内容,表示Web应用myweb创建成功, 回nb sre 田=JRE Systen Library 日C-WE-I级 合1ib d)注意Web应用的文档结构(WebRoot下的内容),其中classes文件夹需要将 视图转换为Resource视图才能看到
b) 在 New Web Project 对话框的【Project Name】文本框中输入 myweb;J2EE Specification Level 项选择“Java EE 5.0”,点击【Finish】按钮。 c) 观察【package】视图中出现如下内容,表示 Web 应用 myweb 创建成功。 d) 注意 Web 应用的文档结构(WebRoot 下的内容),其中 classes 文件夹需要将 视图转换为 Resource 视图才能看到
白白YebRoot 于合ETA-IF 白EB-IF 配文件中的内。 ing-"0TF-82> file-list> index.jsp 2.配置服务器 a在工具栏点击按钮,出现下拉莱单 MyEclipse Derby 4 Configure Server b)选择Configure Server,出现如下窗口,在该窗口进行相应配置。 ⊙2rfac:15 回 Tomcat6× G:\apsche-tondat-0 rovse G:\agache-toncat-6.0. G:\apacha-tonaat-6.0 rovse.. (?
e) 注意 web.xml 配置文件中的内容。 index.jsp 2. 配置服务器 a) 在工具栏点击 按钮,出现下拉菜单 b) 选择Configure Server,出现如下窗口,在该窗口进行相应配置
c)启动服务器如下图所示: yEclipse Derby MyEelipse Toncat Toncat B.x Start itop Server Configure Server 得anage Deployments.. Configure Server Connector 3. 部署Web应用 )在工具栏点击部署按钮,出现Project eplots对话框。 ⊙Froject Deployments Manage Deployments Deploy and udeploy J2EE projects. Project nyweb Deployments Server Type Location Add Renove Redeploy Browse b)在Project Deployments对话框的【Project】下拉列表框中选择“yweb”. 点击【Add】按钮,出现New Deployment对话框。 ⊙ev Deploynent 回 New Deployment Create nev project deployment for nyweb 星eb Project: Server Edit server comnectors. Deploy type: Deploy Location:G:\JavaEServer\apache-toncat-6.0.18\webappsmyweb c) 在New Deployment对话框中,【Server】下拉列表框选择Tomcat6.O,点击 【Finish】,回到Project Deployments对话框。点击【OK】即可
c) 启动服务器如下图所示: 3. 部署 Web 应用 a) 在工具栏点击 部署按钮,出现 Project Deployments 对话框。 b) 在 Project Deployments 对话框的【Project】下拉列表框中选择“myweb”。 点击【Add】按钮,出现 New Deployment 对话框。 c) 在 New Deployment 对话框中,【Server】下拉列表框选择 Tomcat6.0,点击 【Finish】,回到 Project Deployments 对话框。点击【OK】即可
⊙ew Deployment 回X Create new project deployment for nyweb 冒eb Project: Server: Deploy Location:G:JavaEServerlapache-toncat-8.0.18\webappsmyeb d)在Project Deployments对话框中,【Remove】表示别除己经部署的工程: 【o老示断备罗使的以道宽已登烤的应用.女 中 用 位 "C:\bea\user pro jects\domains\base domain'\autodeploy\myweb". 4.访问测试Wb应用 a)如果1 omcat服务器没有启动,则先启动服务器。在工具栏点击调·的箭头按 钮,选择【Tomcat6.0】→【Start。 b)打开浏览器。这里可以使用yEclipse内置的浏览器。点击工具栏中的9按 钮,出现【yEclipse Web Browser】,在地址栏输入 http://localhost:8080/myweb/index.isp http://localhost:8080/myw 出现如下运行结果,表示b应用访问成功。注意 index..jsp在eb.xml中 己经配置为默认访问文件,因此在访问地址中可以省略。 步豫2:创建SP页面 L在Web应用的根路径下制建login.isD a)在主菜单中选择【Ne】【USP(dvance Templaes】或者右键点击工程 上的【WebRoot】并在弹出菜单中选择【N w】→【UsP(Advanced Templates)】, 都会弹出Create a new JSP Page对话框。在File Path中输入或确认 myweb/WebRoot,.在File Name中输入login jsp,点击【Finish】. b)注意:如果没有【JSP(Advanced Templates)】则选择【NeW】→【Other】,在 弹出的菜单中再选择【MyEclipse】→【Web】→【JSP】。 ●Create a new JSP page. 日回☒ JSP Wizard File Path: /nyweb/WebRoot Browse..: Fi1ene Template to use Default JSP template
d) 在 Project Deployments 对话框中,【Remove】表示删除已经部署的工程; 【Redeploy】表示重新部署;点击【Browse】则可以浏览已经部署的应用。如 本 实 验 中 , 部 署 的 Web 应 用 位 于 “C:\bea\user_projects\domains\base_domain\autodeploy\myweb”。 4. 访问测试 Web 应用 a) 如果 Tomcat 服务器没有启动,则先启动服务器。在工具栏点击 的箭头按 钮,选择【Tomcat6.0】→【Start】。 b) 打开浏览器。这里可以使用 MyEclipse 内置的浏览器。点击工具栏中的 按 钮,出现【 MyEclipse Web Browser 】 , 在 地 址 栏 输 入 http://localhost:8080/myweb/index.jsp 或 http://localhost:8080/myweb, 出现如下运行结果,表示 Web 应用访问成功。注意:index.jsp 在 web.xml 中 已经配置为默认访问文件,因此在访问地址中可以省略。 步骤 2:创建 JSP 页面 1. 在 Web 应用的根路径下创建 login.jsp。 a) 在主菜单中选择【New】→【JSP(Advanced Templates)】或者右键点击工程 上的【WebRoot】并在弹出菜单中选择【New】→【JSP(Advanced Templates)】, 都会弹出 Create a new JSP Page 对话框。在 File Path 中输入或确认 /myweb/WebRoot,在 File Name 中输入 login.jsp,点击【Finish】。 b) 注意:如果没有【JSP(Advanced Templates)】则选择【New】→【Other】,在 弹出的菜单中再选择【MyEclipse】→【Web】→【JSP】
2.编写login.jsp的代码,如下: ent Type- text/html.charset-gb2312" function isValidate(form) ∥得到用户输入的信息 userame-form.username.value userpass=form.userpass value. ∥判断用户名长度 if(!minLength(username.6)) c心用户名长度小于6位!” form.username.focus() return false: if(!maxLength(username.8)) alert(用户名长度大于8位"方 form.username.focus(); return false; ∥判断口令长度 if(minLength(userpass,6)) alert(口令长度小于6位!"方 form.userpass focus() if(!maxLength(userpass,8)) aert(口令长度大于8位!" form user return true: 验证是否满足最小长度 function minLength(str.length) if(str.length>=length)
2. 编写 login.jsp 的代码,如下: function isValidate(form) { // 得到用户输入的信息 username = form.username.value; userpass = form.userpass.value; // 判断用户名长度 if(!minLength(username,6)) { alert("用户名长度小于 6 位!"); form.username.focus(); return false; } if(!maxLength(username,8)) { alert("用户名长度大于 8 位!"); form.username.focus(); return false; } // 判断口令长度 if(!minLength(userpass,6)) { alert("口令长度小于 6 位!"); form.userpass.focus(); return false; } if(!maxLength(userpass,8)) { alert("口令长度大于 8 位!"); form.userpass.focus(); return false; } return true; } // 验证是否满足最小长度 function minLength(str,length) { if(str.length>=length)
return true. else return false; ∥判断是否满足最大长度 function maxLength(str.length) if(str.length 用户登陆 用户登录 用户名: 口令: 3 访问测试login. )如果 Tomcat没有启动,则启动Tomcat b)打开浏览器,输入地址http://ocalhost:8080 myweh//login isp。 ©)出现登录界面,并且客户端验证正确,并且提交后地址栏的地址为 “htp://localhos:8080/myweb/ogin”则表示测试成功。 同样方法在web应用的根路径下创建success jsp 编写success,jp的代码,如下: %@page contentType="text/html.charsct=gb2312%> 登录成功 S{sessionScope..userid,您好,欢迎登录网上书店!
return true; else return false; } // 判断是否满足最大长度 function maxLength(str,length) { if(str.length 用户登陆 用户登录 用户名: 口令: 3. 访问测试 login.jsp。 a) 如果 Tomcat 没有启动,则启动 Tomcat。 b) 打开浏览器,输入地址 http://localhost:8080/myweb/login.jsp。 c) 出现登录界 面,并 且客户端 验证正 确,并且 提交后 地址栏的 地址为 “http://localhost:8080/myweb/login”则表示测试成功。 4. 同样方法在 Web 应用的根路径下创建 success.jsp。 5. 编写 success.jsp 的代码,如下: 登录成功 ${sessionScope.userid}您好,欢迎登录网上书店!
6.同样方法访问测试success.jsp. 打开浏览器, 入地址 host:8080/mvweb/success isp 出现“您好,欢迎登录网上书店!”表示测试成功。 7. 同样方法在Web应用的根路径下创建failure.jsp. 8.编写failure.jsp的代码,如下: %@page contentType="text/html:charset-gb2312 登录失败 h2>用户名或者口令不正确,请重新登录! 9.同样方法访问测试failure.jsp,出现“用户名或者口令不正确,请重新登录!”表示 测试成功。 步臻3:创建JavaBean 创建包 在工程上的【sc】点击右键,在弹出莱单中选择【New】【package】,在Names 文本框中输入beans,点击【Finish】。 2.创建Java类 a)在工程上的【src】→【beans】点击右键,在弹出菜单中选择【New】→【class】, 在Names文本框中输入LoginBean,并选中“public static void main(String] args)”点击【Finish】
6. 同样方法访问测试 success.jsp。 a) 如果 Tomcat 没有启动,则启动 Tomcat。 b) 打开浏览器,输入地址 http://localhost:8080/myweb/success.jsp。 c) 出现“您好,欢迎登录网上书店!”表示测试成功。 7. 同样方法在 Web 应用的根路径下创建 failure.jsp。 8. 编写 failure.jsp 的代码,如下: 登录失败 用户名或者口令不正确,请重新登录! 9. 同样方法访问测试 failure.jsp,出现“用户名或者口令不正确,请重新登录!”表示 测试成功。 步骤 3:创建 JavaBean 1. 创建包 在工程上的【src】点击右键,在弹出菜单中选择【New】→【package】,在 Names 文本框中输入 beans,点击【Finish】。 2. 创建 Java 类 a) 在工程上的【src】→【beans】点击右键,在弹出菜单中选择【New】→【class】, 在 Names 文本框中输入 LoginBean,并选中“public static void main(String[] args)”点击【Finish】
ew Java C1ass 回☒ Java Class Source folder myweb/src Package beans ☐inclosing te Modifiers: ⊙pub1ic Odefault private●protecte ☐abstract☐finl☐ctatig Superelass java lang Object Browss... Interfaces sdd.. Which method stubs would you like to create? ☑public static void mainString[]rgs) Constructors fron superclass Do you want to add red in the propartiss of the current project? Einish☐Cancel b)编写LoginBean的validate方法,如下: public boolean validate(String username,String userpass) if(username==nullluserpass==null) return false: return username.equals(userpass) cd)在LoginBean的main方法中编写代码测试。 public static void main(String[]args){ LoginBean test new LoginBean(); E南的用户名日令运 an,“z ngsan")). System.out.printIn(" 错误的用户名口令,返回 +test.validate("zhangsan","123456)): 右键点击工程中的LoginBean,,弹出菜单选择【Run as】→【Java Application】
b) 编写 LoginBean 的 validate 方法,如下: public boolean validate(String username,String userpass){ if(username==null||userpass==null) return false; return username.equals(userpass); } c) 在 LoginBean 的 main 方法中编写代码测试。 public static void main(String[] args){ LoginBean test = new LoginBean(); System.out.println(" 正确的用户名口令,返回 "+test.validate("zhangsan","zhangsan")); System.out.println(" 错 误 的用户名口令,返 回 "+test.validate("zhangsan","123456")); } 右键点击工程中的 LoginBean,弹出菜单选择【Run as】→【Java Application】
运行Java程序,在控制台出现如下结果,表示测试成功。 正确的用户名口今,返回t 错误的用户名口令,返回fals 步4:创建Servlet 1.创建包 a)在工程上的【src】点击右键,在弹出菜单中选择【New】→【package】,在 Names文本框中输入servlets,点击【Finish】. 2. 创建Sc 国金的【心】)【】点击右谜,在出来中选择e习 【Servlet】,在Name文本框中输入LoginServlet,点击【Next】,出现Create a new Servlet对话框。 b)注意:如果没有【Servlet】则选择【eW】→【Other】,在弹出的菜单中再选 择【MyEclipse】→【eb】→【Servlet】 回x Servlet Wizard Generate/llap web.xml file Servlet/JSP Class Hane servlets.LoginServlets Servlet/TSP Happine URI File Eath of web.xnl /myweb/WebRoot/WEB-INF Browse... Display Nane: This is the display name of my J2 component This is the description of my J2EE component 〈aek☐xt☐inih☐Cancel c)在Create a new Servlet对话框中,修改Servlet/JSP Name为:“LoginServlets”, 点击【Finish】。注意:创建Servlet之后会自动修改配置文件Web.xml。如下:
运行 Java 程序,在控制台出现如下结果,表示测试成功。 正确的用户名口令,返回 true 错误的用户名口令,返回 false 步骤 4:创建 Servlet 1. 创建包 a) 在工程上的【src】点击右键,在弹出菜单中选择【New】→【package】,在 Names 文本框中输入 servlets,点击【Finish】。 2. 创建 Servlet a) 在工程上的【src】→【servlets】点击右键,在弹出菜单中选择【New】→ 【Servlet】,在 Name 文本框中输入 LoginServlet,点击【Next】,出现 Create a new Servlet 对话框。 b) 注意:如果没有【Servlet】则选择【New】→【Other】,在弹出的菜单中再选 择【MyEclipse】→【Web】→【Servlet】。 c) 在 Create a new Servlet 对话框中,修改 Servlet/JSP Name 为:“LoginServlets”, 点击【Finish】。注意:创建 Servlet 之后会自动修改配置文件 web.xml。如下: