Web程序设计

实 验 指 导 书

东北林业大学信息与计算机工程学院

计算机科学与技术专业

1 实验目的与要求 ………… ……………………………………………………… 1

2实验环境……………………………………………………………………………2

3上机环境……………………………………………………………………………2

4实验一般步骤………………………………………………………………………3

5 实验学时……………………………………………………………………………3

6 实验内容和要求……………………………………………………………………3

6.1JSP运行环境安装及常用HTML标记使用………………………………………3

6.2 表格、框架网页布局的使用……………………………………………………8

6.3 JavaScript客户端脚本编程……………………………………………9

6.4 SP标签及指令应用…………………………………………………………… 12

6.5 JSP内部对象使用………………………………………………………………19

6.6 JSP与JavaBean及Servlet使用………………………………………………27

6.7数据库使用及JDBC与数据库的连接…………………………………34

6.8 JSP应用实例…………………………………………………………………44

东北林业大学计算机科学与技术学科

《Web程序设计》实验指导书

1 实验目的与要求

    上机操作是本课程必不可少的实践环节，主要目的是锻炼和培养学生实际操作技能和解决实际问题的能力。要求学生掌握用JSP技术进行网络程序的设计、调试和发布的方法，熟悉用HTML标示及Dreamwear 进行页面设计的方法，通过JSP提供的各种对象和组件以及DTML提供的各种对象进行B/S架构系统设计的全过程，获得JSP技术及HTML进行实际应用的体会，加深对JSP技术和HTML本身的理解，掌握JSP服务器端程序设计的方式和方法，掌握JSP与JavaBean和Servlet的关系，掌握基本的JDBC连接数据库的方法，得到网络程序系统设计方法和技巧的实际训练，从而使学生能真正利用ASP技术进行动态网页的设计，进而可以开发实用的网站系统。

    (1)加深对讲授内容的理解，尤其是一些语法规定，光靠课堂讲授，既枯燥无味又难以记住，但它们都很重要。通过多次上机，就能自然地、熟练地掌握。通过上机来掌握语法规则是行之有效的方法。

    (2)熟悉所用的计算机系统的操作方法，也就是了解和熟悉HTML和JSP技术进行网络程序开发的过程和环境。一个程序必须在一定的外部环境下才能运行，所谓“环境”，就是指所用的计算机系统过程的硬件和软件条件。使用者应该了解为了运行一个网络程序，需要哪些必要的外部条件(例如硬件配置、软件配置)，可以利用哪些系统的功能来帮助自已开发程序。每一种计算机系统的功能和操作方法不完全相同，但只要熟练掌握一、二种计算机系统的使用，再遇到其它的系统时便会触类旁通，很快地学会。

    (3)学会上机调试程序。也就是善于发现程序中的错误，并且能很快地排除这些错误，使程序能正确运行。经验丰富的人，当编译时出现"出错信息"时，能很快地判断出错误所在，并改正之。而缺乏经验的人即便在明确的出错提示下也往往找不出错误而求救于别人。计算机技术是实践性很强的技术，要求从事这一领域的人不仅能了解和熟悉有关理论和方法，还要求自己动手实现。对程序设计来说，要求会编程序并上机调试通过。因此调试程序本身是程序设计课程的一个重要的内容和基本要求，应给予充分的重湘。调试程序的经验固然可以借鉴他人的现成经验，但更重要的是通过自己的直接实践来累积，而且有些经验是只能"会意"难以"言传"。因此，在实验时干万不要在程序通过后就认为万事大吉、完成任务了，而应当在已通过的程序基础上作一些改动，再进行执行发布，甚至于"自设障碍。，即把正确的程序改为有错的，观察和分析所出现的情况。这样的学习才会有真正的收获，是灵活主动地学习而不是呆板被动的学习。

2 实验环境

（1）计算机的硬件配置

PC系列微机，最好是奔腾及以上系列机，要求内存为512以上，一个硬盘驱动器和一个软盘驱动器。80列字符监视器。配备鼠标器。

（2）计算机的软件配置

Windows X系列操作系统，J2SDK 1.4以上开发环境，Tomcat 4.0以上Web服务。

一个如记事本的文档编辑器及Dreamwear MX4.0及以上的网络页面编辑工具，NetBean 、Eclipse ,MyEclipse等Java、JSP的编辑、编译环境。

3 JSP网络程序开发步骤

（1）服务器环境安装及设置

如果要编写JSP网络程序并对其进行发布，首先应该安装及配置好服务器。步骤及过程如下：

1）应该在Windows 系列相应平台上安装J2SDK 1.4以上开发包，进行安装；

2）设置环境变量，例如在系统设置环境变量CLASSPATH、JAVA_HOME、PATH如下：：

CLASSPATH:  .;C:\Java\jdk1.5.0_06\lib\tools.jar;C:\Java\jdk1.5.0_06\lib\dt.jar;

PATH:           C:\Java\jdk1.5.0_06\bin

JAVA_HOME:     C:\Java\jdk1.5.0_06

3）测试安装状态；

4）安装Tomcat 4.0以上版本，配置相应的环境；

5）测试安装状态；

6）在相应编辑环境下编写程序；

7）在浏览器中分布程序；

    注：编辑源程序。①根据需要在记事本或是Dreamwear等工具下输入或修改源程序代码；②根据程序的内容和应用选择将编好的程序以扩展名为.htm或.jsp存入至发布目录中。 

    （3）执行发布网络程序。打开浏览器在地址栏中输入下面这三种方式进行程序的运行：①http://localhost/目录名/待发布文件名称；②http://127.0.0.1/目录名/待发布文件名称；③http://本机实际IP/目录名/待发布文件名称后执行。

        如果发现运行结果不对，要重新修改源程序，应该再次打开出现错误的程序根据需要修改源程序，并重复上述2、3步，直到得到正确结果为止。

4 实验一般步骤

    (1)准备好上机所需的程序。手编程序应书写整齐，并经人工检查无误后才能上机，以提高上机效率。对程序中自己有疑问的地方，应作出记号，以便在上机时给予注意。初学者切忌不编程序或抄别人程序去上机，应从一开始就养成严谨的科学作风。

    (2)上机输入和调试自己所编的程序。应该一人一组，独立上机。上机过程中出现的问题，除了是系统的问题以外，一般应自已独立处理，不要轻易举手问教师。尤其对“出错信息”，应善于自己分析判断。这是学习调试程序的良好机会。

    在使用键盘时，最好采用正确的指法击键，为今后正确使用键盘打下基础。

    在程序调试通过后，打印输出程序清单和运行结果，在运行时要注意在输入不同数据时所得到的不同结果。此时应运行几次，分别检查在不同情况下程序是否正确。

    (3)上机结束后，应整理出实验报告，实验报告应包括以下内容:

    ①题目;

    ②程序清单(计算机打印出的程序清单);

    ③运行结果(必须是上面程序清单所对应打印输出的结果);

    ④对运行情况所作的分析以及本次调试程序所取得的经验。如果程序未能通过，应分析其原因。

5 实验时数

    总实验时数不得少于16学时。

6 实验内容和要求

实验一    JSP运行环境安装及常用HTML标记使用

一、    目的要求:

熟悉JSP的开发环境，学会基于java的tomcat服务器的安装配置和使用。掌握JSP的运行原理。使用dreamweaver进行编写简单的jsp页面，运行调试。

   二、实验内容:

    必做第一题，选作其它题目。

1. JSP开发环境配置：（具体步骤如下，请遵照实验）

   ①下载JDK。为了建立基于SDK 的Java 运行环境，需要先下载Oracle-Sun 的免费JDK 软件包。SDK 包含了一整套开发工具，其中包含对编程最有用的是Java 编译器、Applet 查看器和Java 解释器等在浏览器中输入http://java.sun.com/，可看到Oracle 公司网站页面从中download进行下载。

②安装jdk：执行安装SDK

运行下载的“jdk-1_5_0_07-windows-i586-p.exe”软件包，可安装JDK，在安装过程中可以设置安装路径及选择组件，系统默认的安装路径为C:\program\ jdk1.5.0_06（比如可以选择D 盘等），默认的组件选择是全部安装。安装完成后会形成“bin”、“demo”、“jre”、“lib”、“include”、“sample”这几个文件目录

③设置环境变量：

JDK 中的工具都是命令行工具，需要从命令行即MS－DOS 提示符下运行它们。很多人可能会不习惯，但这是Sun 特意采取的策略，为的是把精力更多地投入到Java 语言本身而不是花在开发工具上。为了能正确方便的使用JDK，可手工配置一些Windows 的环境变量。

设置Windows XP/NT/2000系统中的环境变量参看下面说明：

以Windows XP 为例说明设置过程：

在桌面“我的电脑”图标上单击右键，选择“属性”菜单，将出现系统特性设置界面，在“高级”选项卡中单击“环境变量”按钮。将出现“环境变量”设置界面在“系统变量”框中选择“Path”，然后单击“编辑”按钮，在出现的“编辑系统变量”对话框中，在“变量值”栏的命令前添加“C:\Java\jdk1.5.0_06 \bin;”命令，见下图：

用同样方法设置环境变量“classpath”(注：JDK1.5以上版本可以不用配置classpath环境变量)，其值为:“.;C:\Java\jdk1.5.0_06\lib\tools.jar;C:\Java\jdk1.5.0_06\lib\dt.jar;”

④在记事本中敲入如下代码：

public class hello{

public static void main(String arg[])

{System.out.print("Hi! JAVA!");

}

}

 此Java文件的文件名叫hello.java，注意！一定要叫hello.java，而且区分大小写，不要问为什么。接下来去到MS-DOS方式下的D盘根目录，输入下面指令： javac hello.java 回车

如果正常的话，是没有任何内容显示的，但会在同一目录下编译成一个hello.class的文件，接下来再运行下面指令：

java hello 回车

如果正常的话，则会显示"Hi! JAVA!"的字符在屏幕上，这就代表你的java环境没有问题了，可以进行下一步的工作。

⑤下载并安装Tomcat

请到http://www.apache.org/index.html，下载jakarta-tomcat-5.0.16.exe进行安装，或下载相应的压缩包进行解压缩运行。安装或解压缩完成后会在安装路径看到如下目录：

tomcat

|---bin Tomcat：存放启动和关闭tomcat脚本；

|---conf Tomcat：存放不同的配置文件（server.xml和web.xml）；

|---doc：存放Tomcat文档；

|---lib/japser/common：存放Tomcat运行需要的库文件（JARS）；

|---logs：存放Tomcat执行时的LOG文件；

|---src：存放Tomcat的源代码；

|---webapps：Tomcat的主要Web发布目录（包括应用程序示例）；

|---work：存放jsp编译后产生的class文件

⑥配置环境

在tomcat中创建自己的虚拟目录：mywork

Server.xml修改示例：

<context path=“/edu” docbase=“mywork” reloadable=“true”>

</context>

</host>

Mywork是说明其相对webapps的位置，它应该在webapps目录下，是物理存在的目录； /edu说明其相对web URL的路径，是一个虚拟的路径，如：http://localhost：8080/edu

⑦测试Tomcat，在开始菜单程序中找到Apache Tomcat5.0后启动tomcat服务后，在浏览器地址栏中输入：http://localhost:8080/如果显示下面的测试页即说明安装成功了

⑧请编写如下example.jsp程序并将其存入到“mywork”目录中

<%@ page contentType="text/html;charset=GB2312" %>

<HTML>

<BODY BGCOLOR=cyan>

<FONT Size=5>

<P>这是一个简单的JSP页面

     <% int i, sum=0;

         for(i=1;i<=100;i++)

          { sum=sum+i;

          }

      %>

<P>  1到100的连续和是：

<BR>

   <%=sum %>

</FONT>

</BODY>

<HTML>

在浏览器地址栏中输入http://localhost:8080/edu/example.jsp,看显示结果是否正确，如果没有问题，至此JSP开发的基本环境安装完毕。

2.建立一份HTML文件，然后将HTML文件设定为乳白色底、桔黄色底、文件标题为“我的网页”，并设置超链接文字颜色link为红色、alink颜色为绿色、vlink为蓝色。

3.随意输入一篇文章，并利用下列标记（标记可以自由组合）给这篇文章建立多样化的文字编排效果。

<Hn>、<FONT>、<B>、<I>、<U>、<BIG>、<SMALL>、<STRIKE>、<BR>、<P>、<DIV>、<HR>

4.在第3题的文章中插入两幅图片，插入位置为文章的右上角和左下角。

5.建立一个书籍目录的超链接架构，页面上的超链接文字为书的章节，连接的内容为各章节的简介，简介结尾处单击“返回”可回到书的章节处

实验二 表格、框架及页面总体的设计及使用

一、目的要求:

 1．掌握框架的概念、作用及设计方法；

  2．了解层和层叠样式（CSS）的作用，掌握他们使用方法；

3．掌握HTML中表格的定义及使用方法，了解表格的应用。

4.结合前述内容，能够根据特定的页面布局进行网页格局的设计；

二、实验内容:

1. 利用表格建立如下网页（歌曲自选，至少选择3首歌曲）。

2、利用框架制作如下图的页面。要求布局合理，各个框架页编写正确。

3、制作如下所示页面，并选择实现相应的行为。

4. 自己创意构建一个网站主页。要求应包括：网站的标志、导航条、主题栏目、友情链接、跑马灯技术等。

5、将第4题制作的网站另存为模版，使用此模版制作第二个页面，要求只修改文字内容不修改布局和图片。

6.使用表格标记建立一个班级课程表，要求表格的边框颜色为紫红色，宽度为3，表格的背景颜色为粉红色，不同的课程名用不同的颜色标示。

7利用框架标记建立一个页面，要求先上下分割成两个窗口，其中下面的窗口再分割成左右两个窗口，各个窗口都显示一个HTML文件，左下窗口的HTML文件是五个超链接，点击每一个超链接，其链接的文件应该在右下的窗口中显示出来。

8、从网上下载一篇文章在此文章中实现三种CSS选择器类型：类、标签、超级链接CSS样式。可选择导出样式表或者只针对该文档。

实验三   JavaScript客户端脚本编程

一、目的要求:

 1．要求掌握常用DTML网页中的常用客户端对象的使用方法；

  2．理解对象驱动机制的方式和方法，学会用常用控件编写相应的脚本程序；

3．掌握JavaScript程序设计的基本内容；

二、实验内容:

选作以下题目，编程序，然后上机调试运行。

1．编写程序验证表单中两次密码一致。

2．用JavaScript编写一个网页时钟程序，要求在页面上用一个文本框显示系统时间（格式：hh：mm：ss），用另一个文本框显示系统日期（格式：mm-dd-yy）。

3．编写程序实现一个简易网络计算器。

4．编写程序计算某人停在某页面的时间。

   5．试编写程序段，判断当天的日期，如果是25日，则显示“请注意，明天可能有病毒发作”。

6．求1！+2！+3！+…+10。

7．编写一个程序，输出如下图案。

             *

            ***

           *****

          *******

9．有编号为1，2，3，4的四个球，试编程：分别给4个球随机地涂上红、黄、蓝、绿4种颜色。

10．试设计一个包含下拉框（收入）和复选框（职业）的页面，在按钮的单击事件中同时显示这两个控件的选择信息。

11.编写程序：在载入一个页面的同时，打开一个没有工具栏、没有菜单栏、没有状态栏的窗口。

             

实验四 JSP标签及指令应用

一.     目的要求

1.掌握JSP指令标签及动作标签的使用；

2.掌握page、include指令标签的使用；

3.掌握动作标签include、forward、plugin等的应用。

二.     实验内容

1. 编写三个jsp页面：first.jsp、second.jsp和third.jsp。另外，要求用“记事本”编写一个TXT文件hello.txt。hello.txt的每行有若干个英文单词，这些单词之间用空格分隔，每行之间用“<BR>”分隔，如下所示：

Hello.txt

Packag apple void back public <br>

Private throw lass hello welcom

(1)first.jsp使用page指令设置contentType属性的值是text/plain，使用include指令静态插入hello.txt文件。 

(2)second.jsp的具体要求 ：

second.jsp使用page指令设置contentType属性的值是application/vnd.ms-powerpoint，使用include指令静态插入hello.txt文件。 

(3)third.jsp的具体要求： 

third.jsp使用page指令设置contentType属性的值是application/msword，使用include指令静态插入hello.txt文件。

2.编写一个在线书店或是课程学习网站等网站的网页头文件，并实验将其嵌入在网站中不同页面的方法。

3.编写一个程序根据登录的不同身份自动跳转到不同页面页面的程序。

4.编写Java的applet小程序，将其嵌入到JSP页面中的程序。

5. 编写两个JSP页面，分别为login.jsp和visitors.jsp。 具体要求如下：

（1）login.jsp的具体要求： 

该页面有一个表单，用户通过该表单输入自己的姓名并提交给people.jsp页面。 

（2）visitors.jsp的具体要求： ? 

该页面有名字为person、类型是StringBuffer以及名字是count、类型为int的成员变量。 ? 

该页面有public void judge ()方法。该方法负责创建person对象，当count的值是0时，judge ()方法创建person对象。 ?

该页面有public void addPerson(String p)方法，该方法将参数p指定的字符串添加到成员变量person末尾，同时将count作自增运算。

该页面在程序片中获取inputName.jsp页面提交的姓名，然后调用judge()创建person对象、调用addPerson方法将用户的姓名添加到成员变量person末尾。

如果inputName.jsp页面没有提交姓名，或姓名含有的字符个数大于10，就使用<jsp:forward page="要转向的页面"/>标记将用户转到inputName.jsp页面。

通过Java表达式输出person和count的值。 

实验五   JSP内部对象使用

一、目的要求

   1.掌握JSP的几个内置对象的用法，基本掌握JSP的开发技巧。

2.应用Request对象方法进行编程

3.应用Response对象方法进行编程

4.应用Session对象方法进行编程

5.应用Application对象的方法进行编程

6.应用Out对象的方法进行编程

二、实验内容

选作以下题目，编程序，然后上机调试运行。

1. 编写程序register.htm和register.jsp，做一个用户注册的界面，要求对用户填写的部分进行合法性检验，然后提交到register.jsp进行注册检验，若用户名为user开头的，就提示“该用户名已被注册”，若用户名为admin，就提示“欢迎您，管理员”，否则，就显示“注册成功”。

2. 运行request.htm，记录运行结果，并说明程序的功能和使用的JSP对象。修改request.jsp程序，使其能接受表单中输入汉字信息。

3.建立一个登录界面，要求使用Session对象传递登录信息

4.使用Application 对象和Session对象，显示网站的在线名单。

5.编写程序实现一个简单的聊天室，要能显示发言人的姓名、发言内容、发言时间。

6.编写一个猜数游戏程序。

7.设计可以创建、删除文件夹的网页程序。

8.设计可以显示文件属性的网页程序。

实验六   JSP与JavaBean及Servlet使用

一、目的要求

在这次实验中，培养基于WEB开发的能力。了解JavaBean编程方法；了解JavaServlet编程方法，从而达到熟练进行JSP程序中JavaBeans的程序编写和使用JavaServlet编写程序及调试程序的能力

二、实验内容                           ·

    选作以下题目，编程序，然后上机调试运行。

1．      请用JavaBean编写一个Page范围的、Request范围的、Session范围的或Application范围的计数器程序。

2．      如果已经定义了一个Circle类（见下面代码），请用JavaBean调用此类编写能求圆的半径、圆的面积、圆的周长的程序。

3．如果已经定义了一个Count类（见下面代码），请用JavaBean使用此类编写网页计数器程序。

实验七   Mysql数据库使用及JDBC与数据库的连接1

一、目的要求

掌握Mysql数据库安装配置的方法，了解创建数据库及数据表的过程和方法；了解动态查询、更新数据库的方法。掌握JDBC驱动程序及其原理；掌握用数据源方法连接数据库；掌握JSP数据库的创建、删除等操作；熟练运用数据查询、添加、更新、删除等操作。

二、实验内容

   必作第1、2、3题，选作以下题目，编程序，然后上机调试运行。

1．下载并安装Mysql，请参考如下步骤来完成；

  1）请到http://www.mysql.com下载Mysql，文件名一般为mysql-4.0.15-win.zip；

2）请将mysql-4.0.15-win.zip解压缩后直接执行安装；

3）安装成功后打开指令控制台，然后依序输入①cd 安装路径\mysql\bin ②安装路径\mysql\bin>mysqld-nt –install之后当计算机重启之后，Mysql将自动启动。

4）执行“安装路径\mysql\bin”中的winmysqladmin，将让用户控制Mysql的服务器。刚执行时，会要求用户设定用户名和密码，设定之后即可以进入winmysqladmin了

5）测试Mysql是否启动，进入“安装路径\mysql\bin”下，在提示符后输入mysqlshow,如果能显示出两个默认数据库的名字：mysql和test，则说明安装成功。

2．在控制台上创建一个学籍管理数据库，其中包括成绩及学生信息等数据表。

3．试用JDBC连接创建的数据库。

4．根据创建的数据库，输出某门功课成绩在80以上的全部学生姓名及成绩。

5．查询一个数据库中已录入的学生信息。如果没有给出提示信息。

6．参考下面程序进行调试运行:

实验8  JSP应用实例

一、目的要求

本次实验是设计性设计，在学生掌握数据库技术和页面格式设计等技术后，能够利用所学的各部分知识进行组织和设计，从而根据设计内容完成页面布局的设计，根据系统功能和数据关系设计数据库结构，从而后后续开发做好准备，具体地：

1.      掌握常用基本页面格式设计方法

2.      掌握Mysql数据库的安装、使用方法

3.了解网络应用程序开发的流程

二、实验内容

   1．根据网上书店的功能设计前台客户端用户操作界面；要求布局合理美观，内容比较充实。

   2．根据书店的功能设计相应的数据库，要求数据表中数据能按照一定的类别进行创建，便于操作。