WEB开发技术实践教程课程设计实验报告

1、 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩： 一、 实验项目 web编程环境二、 实验目的第1章 搭建web编程环境，能正确安装配置java运行环境、web服务器和数据库服务器第2章 熟悉web编程集成环境myeclipse.第3章 熟练掌握web工程的创建、发布、运行流程。三、 实验内容1. 安装并配置java运行环境jdk和jre2. 安装web服务器tomcat, 配置tomcat服务器3. 安装并配置数据库mysql.4. 安装myeclispe，熟悉各项菜单项5. 为myeclispe集成配置jdk和tomcat6.

2、创建、发布、运行一个web工程。四、 实验仪器及耗材计算机，jdk，tomcat, mysql, myeclipse等软件。五、 实验步骤1. 先安装jdk1.6，选择自定义安装，安装到c：jdk2. 配置环境变量，class：.;c:jdkbin , classpath:.;c:jdklib ，java_home：c:jdk安装tomcat，安装在c: tomcat 下，配置tomcat_home环境变量，catalina_home: c: tomcat，catalina_base: c: tomcat，tomcat_home: c:tomcat然后修改环境变量中的classpath，把to

3、mat安装目录下的commonlib下的servlet.jar追加到classpath中去，修改后的classpath如下：classpath=.;%java_home%libdt.jar;%java_home%libtools.jar;%catalina_home%commonlibservlet.jar;3. 运行toncat的bin文件夹下的tomcat6.exe。在浏览器内输入http:/localhost:8080，会出现tomcat的管理窗口。4. 暗转sql2000企业版，选择安装数据库服务器，接下来都选择缺省值，知道服务器配置界面选择使用本地系统账户，进入身份验证模式，选择混合

4、模式。5. 下载安装sdk。6. 安装myeclispe到c：eclipse。7. 配置eclipse，在preference中展开java元素，选择install jre.8. 在tomcat的webapps目录下建立一个firstapp文件子目录，然后使用文本编辑器编辑一下代码：the first web program!;welcome to you9、保存到firstapp目录下面。六、 实验结果一、 浏览器输入：htte:/localhost:8080,出现tomcat管理窗口。二、 在tomcat的manager目录下面选择firstapp，运行html文档，会显示welcome。

5、七、 实验心得对jsp程序的编写流程和工作环境有了大致了解，并学会了如何配置环境，发布基本的web服务的流程。 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩： 1）实验项目 html和css编程技术 2）实验目的熟悉html静态网页编程技术，熟悉html各种标记，特别是表单标记熟悉css编程技术，掌握css来格式化网页、掌握css盒式模型掌握div+css布局和设计网页，掌握css设计网页的一般流程熟悉dreamweaver的css设计器3）实验内容1. 构思一个新闻发布网站，主题自选，设计好新闻类别2. 制作主页psd图3. 用d

6、iv+css布局主页框架。（如可分成top, mid, foot, 其中mid再分两大块left和main）4. 分别细化设计每一大块。5. 要中间部分的左边或右边要设计一个小登录表单，并用css美化。4）实验仪器及耗材计算机，dreamweaver 8，photoshop，myeclipse等软件。5）实验步骤1、打开dreamweaver 8，使用其div层的功能将主页分为top、left、right、三块，top主要来放置网站的logo、标题、登录信息，left来存放新闻网站的分类，right来存放内容。这样设计简单直观，浏览者很方便可以查询到所需新闻。2、用ps编辑一些图片作为网站的素

7、材3、用dreamweaver的css样式表编辑各个层的样式4、在top的左上角设置一个登录表单，登录后用户可以发布新闻信息。6）实验结果7）1通过此次试验了解了网站的基本设计，熟悉了html静态网页编程技术，熟悉html各种标记，特别是表单标记2 熟悉css编程技术，掌握css来格式化网页3 掌握了一些基本的div+css布局和设计网页4 熟悉了dreamweaver的css设计器5在这次的实验中我懂得了dreamweaver表单和div的基本应用，并且掌握了如何用css美化网页。 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩：

8、1) 实验项目 javascript编程技术2) 实验目的l 熟悉javascript语法l 掌握javascript函数的创建和调用l 熟悉javascript对象，特别是浏览器对象，了解dom模型，知道文档对象的访问方法。l 会用javascript来对表单进行验证。3) 实验内容1) 用javascript完成对登录表单的验证2) 设计一个新闻发布的页面，并用javascript对新闻发布表单进行验证。4) 实验仪器及耗材计算机，dreamweaver 8，photoshop，myeclipse等软件。5) 实验步骤1、function check(form_add) if(docume

9、nt.form_add.username.value=) alert(请输入用户名); document.form_add.username.focus(); return false;if(document.form_add.username.value.length12) alert(输入的用户名太长); document.form_add.username.focus(); return false;if(document.form_add.pws.value.length5) alert(请您输入密码，有效长度范围为：520！); document.form_add.pws.focus

10、(); return false;if(document.form_add.confirmpassword.value.length1) alert(请您再输入验证密码！); document.form_add.confirmpassword.focus(); return false;if(document.form_add.confirmpassword.value!=document.form_add.pws.value) alert(确认密码与密码不一致！); document.form_add.confirmpassword.focus(); return false;usernam

11、e:用户名不得小于二个字节password:rpassword:(只需要在上面的if语句中修改条件，就可以更改登录的条件，可以增加用户名和密码的数据库)2、将此页面保存到tomcatwebapps下的firstapp文件夹中，在tomcat控制窗口运行即可。六、实验结果这是一个注册验证系统，必须输入符合条件的用户名和密码才能登录。6) 实验心得熟悉了javascript语法，掌握了javascript函数的创建和调用，javascript的基本语法和代码，可以用其编写一些基本的jsp页面 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩

12、： 1. 实验项目 servlet编程技术2. 实验目的1. 熟悉servlet技术的创建和运行流程。2. 会在web.xml配置servlet的url3. 熟悉请求request和响应response接口4. 熟悉请求转发接口requestdispatcher接口5. 熟悉会话session接口，掌握基于session登录权限控制。3. 实验内容完成一个基于session的登录权限控制模块。要求：a) 主页登录表单提交后转到servlet进行处理，根据用户类型转到不同的页面。如果在用户名或密码不正确把登录表单包含进来b) 对于某些页面必须登录才能访问，如新闻发布页面。如果没有登录则禁止访问，

13、并重定向到登录页面。4. 实验仪器及耗材计算机， myeclipse等软件。5. 实验步骤（页面内容自己加）一、 编写index.jsp页面:基于实验一的页面设置，以下是登录表单部分的代码用户名:密码: 保存为index.jsp二、 servelet a编写：packageapp.user.action; importjava.io.ioexception; importjava.io.printwriter; importjavax.servlet.servletexception; importjavax.servlet.http.httpservlet; importjavax

14、.servlet.http.httpservletrequest; importjavax.servlet.http.httpservletresponse; importapp.user.service.userservice; import javax.servlet.http.httpsession;publicclassaextendshttpservlet privateuserserviceuserservice=newuserservice(); privatestringusername; privatestringpassword; publicvoiddopost(http

15、servletrequestrequest,httpservletresponseresponse)throwsservletexception,ioexception username=request.getparameter(username); password=request.getparameter(password); printwriterout=response.getwriter(); if(password.equals(“1234”)&username.equals(“xufangzheng”) session.setattribute(“index”,”ok”);res

16、ponse.sendrrdirect(“b.jsp”);/跳转到目标页面b.jspelseresponse.sendredirect(“index.jsp”);/返回主页return;若用户名为xufangzheng,密码为1234，则会跳转到b.jsp页面进行处理。b.jsp是一个新闻发布页面三、b.jsp编写所属栏目:作者：内容:四、xml的配置hello userregisteraction6. 实验结果在登入表单输入用户名和密码，如果用户名是xufangzheng，密码是1234则跳转到b.jsp页面，否则重新定位到主页。7. 实验心得本次实验我了解了servlet的基本原理和如何运用

17、servlet完成用户的认证，对掌握web技术有了更深一步的认识。 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩： 1) 实验项目 jsp编程技术2) 实验目的6. 熟悉jsp编译指令，动作标记。7. 熟悉jsp的隐含对象8. 正确理解request、session、application三个对象的作用域9. 能正确处理汉字乱码问题10. 能熟练使用jsp技术来编写网页3) 实验内容1. 编写一个文章类，用myeclipse的工作自动产生getter和settet函数2. 修改前面编写过的管理员的新闻发布页面，改成jsp页面要求如下

18、：1）撰写界面至少包括文件标题，所属栏目、作者、内容几项2）界面用css进行美化3）每个输入框均应有name属性。4）权限控制，必须是管理员用户才能访问，跟前面实验的登录权限控制关联起来。 3. 编写一个servlet来处理新闻发布页面提交的表单要求：1）读取表单各项内容，并把存入一个文章对象中。2）把文章对象绑定在request对象中，并转发到新闻显示页面。3. 编写一个新闻显示页面。 要求： 1) 编写静态页面模板，页面用div+css设计2）设定文章对象已存在request对象中，取出文章对象3）把静态页面的内容改成动态内容，如标题，作者，内容等。4) 实验仪器及耗材计算机，dreamw

19、eaver 8，photoshop，myeclipse等软件。5) 实验步骤1、 题意不明确2、 管理员权限控制servlet代码：packageapp.user.action; importjava.io.ioexception; importjava.io.printwriter; importjavax.servlet.servletexception; importjavax.servlet.http.httpservlet; importjavax.servlet.http.httpservletrequest; importjavax.servlet.http.httpservle

20、tresponse; importapp.user.service.userservice; import javax.servlet.http.httpsession;publicclassaextendshttpservlet privateuserserviceuserservice=newuserservice(); privatestringusername; privatestringpassword; publicvoiddopost(httpservletrequestrequest,httpservletresponseresponse)throwsservletexcept

21、ion,ioexception username=request.getparameter(username); password=request.getparameter(password); printwriterout=response.getwriter(); if(password.equals(“1234”)&username.equals(“xufangzheng”) session.setattribute(“index”,”ok”);response.sendrrdirect(“news.jsp”);/跳转到目标页面news.jspelseresponse.sendredir

22、ect(“index.jsp”);/返回主页return;若用户名为xufangzheng,密码为1234，则会跳转到news.jsp页面进行处理。news.jsp是一个新闻发布页面3、 修改新闻发布页面，news.jsp代码如下 news 所属栏目:题目：input type=”text” name=”timu”作者：内容:4、 编写新闻处理servlet ，命名为chuli，目的是在新闻div中将提交的新闻和作者内容写到div中import java.io.ioexception;import java.io.printwriter;import javax.servlet.servlet

23、exception;import javax.servlet.http.httpservlet;import javax.servlet.http.httpservletrequest;import javax.servlet.http.httpservletresponse;import admin.managebean.newsaddbean;public class chuli extends httpservlet public chulit() super(); public void destroy() super.destroy(); / just puts destroy st

24、ring in log / put your code here public void doget(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception response.setcontenttype(text/html); printwriter out = response.getwriter(); out .println(); out.println(); out.println( a servlet); out.println( ); out.pr

25、int( this is ); out.print(this.getclass(); out.println(, using the get method); out.println( ); out.println(); out.flush(); out.close(); public void dopost(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception string timu = request.getparameter(timu); string

26、neirong = request.getparameter(neirong); string zuozhe= request.getparameter(zuozhe); newsaddbean nb = new newsaddbean(); nb.settimu(timu); nb.setneirong(neirong); nb.setzuozhe(azuozhe); if(nb.newsadd()=1) request.getrequestdispatcher(newsput.jsp).forward(request, response); /将内容提交至新闻显示页面else reques

27、t.getrequestdispatcher(adderror.jsp).forward(request, response); /将内容提交至错误页面 public void init() throws servletexception 5、 编写新闻显示newsput.jsp页面：新闻显示页面%out.println(“新闻显示”);request.secharacterencoding(“gbk”);rnumeration enumparams=request.getparameternames();while(inumparams.hasmoreelements()string par

28、aname=enumparams.nextelement().tostring();string paravalue=request.getparameter(paraname);%:/通过循环一次输出request中的各个对象6) 实验结果首先输入用户名：luyang 密码：1234可以登入新闻发布页面，否则返回主页。在进入新闻发布页面中选择提交，若有部分信息不全，则显示错误页若各类信息都有了，则在新闻显示页面上会显示所提交的信息。7) 实验心得本次实验让我掌握了如何运用jsp的各种内建对象处理表当，同时巩固了servlet的具体应用，已经可以编写简单的新闻发布系统，并且熟悉了管理员控制权限

29、的基本原理。 南昌大学实验报告学生姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩： 一、实验项目 javabean编程技术 二、实验目的1. 熟悉javabean的规范2. 会编写javabean; 会在jsp和servlet中创建和使用javabean对象3. 掌握jsp的、的使用4. 掌握jsp中表单和表单bean的映射5. 掌握servlet中表单和表单bean的映射6. 会编写封装业绩逻辑的javabean7. 会使用上传下载组件jspsmartupload外部组件三、实验内容一、 修改前面的封装新闻（文章）的javabean，使其符合javab

30、ean规范二、 修改前面的新闻发表serlvet，用来完成新闻发布表单的处理，要求利用映射机制把新闻表单映射到新闻的javabean中，以便后继把这个javabean写入数据库。三、 编写一个封闭新闻管理的业务bean. 这里只需定义接口即可。四、 参考教材，编写一个上传下载模块（可选）五、 参考教材，实现登录动态验证（可选）四、实验仪器及耗材计算机，dreamweaver 8，photoshop，myeclipse等软件。五、实验步骤1、 javabean newsbean 的编写,通过该bean可以显示提交的新闻信息：package demo.bean;import java.io;pub

31、lic class newsbeanpublic newsbean()private string timu;private string neirong;private string zuozhe;public void settimu(string timu)this.timu=timu;public void setneirong(string neirog)this.neirong=neirong;public void setzuozhe(string zuozhe)this.zuozhe=zuozhe;public string gettimu()return timu;publi

32、c string getneirong()return neirong;public string getzuozhe()return zuozhe;2、 修改新闻处理的servlet,将其处理的结果映射到newsbean中import java.io.ioexception;import java.io.printwriter;import javax.servlet.servletexception;import javax.servlet.http.httpservlet;import javax.servlet.http.httpservletrequest;import javax.

33、servlet.http.httpservletresponse;import public class chuli extends httpservlet public chulit() super(); public void destroy() super.destroy(); / just puts destroy string in log / put your code here public void doget(httpservletrequest request, httpservletresponse response) throws servletexception, i

34、oexception response.setcontenttype(text/html); printwriter out = response.getwriter(); out .println(); out.println(); out.println( a servlet); out.println( ); out.print( this is ); out.print(this.getclass(); out.println(, using the get method); out.println( ); out.println(); out.flush(); out.close()

35、; public void dopost(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception string timu = request.getparameter(timu); string neirong = request.getparameter(neirong); string zuozhe= request.getparameter(zuozhe); newsaddbean nb = new newsaddbean(); nb.settimu(ti

36、mu); nb.setneirong(neirong); nb.setzuozhe(azuozhe); if(nb.newsadd()=1) session.setattribute(“timu”,timu); session.setattribute(“neirong”,neirong);session.setattribute(“zuozhe”,zuozhe);response.sendredirect(“xiansih.jsp”);)/将对象保持到session中，通过session映射到javabeanelse request.getrequestdispatcher(adderror

37、.jsp).forward(request, response); /将内容提交至错误页面 public void init() throws servletexception 3、 编写新闻管理管理业务bean mbean:package demo.bean;import java.io;public class mbeanpublic mbean()private string timu;private string neirong;private string zuozhe;private string usename;private string password;public voi

38、d yangzheng()public void fabu()public void yuedu()public void liebiao()定义了身份验证、新闻发布、新闻阅读、新闻列表4个借口。六、实验结果将原来的封装业务以javabean的形式封装，简化了在编写web过程中繁琐的各种java语言，直接通过java就可以处理各种信息。将servlet的结果映射到javabean中，通过调用javabean来完成新闻的发布。七、实验心得本次试验我懂得了javabean在web编程技术中的妙用，通过servlet、javabean的结合，使web网页的编写更加地灵活和简单。 南昌大学实验报告学生

39、姓名： 学 号： 专业班级： 实验类型： 验证 综合 设计 创新 实验日期： 实验成绩： 一、 实验项目 jdbc数据库编程技术 二、 实验目的1. 掌握jdbc来访问数据库的一般步聚2. 掌握jdbc来连接各类数据库3. 掌握connection、statement、preparestatement和resultset几个类。4. 掌握jdbc事务处理机制。5. 会编写使用jdbc访问数据库的javabean6. 掌握分页显示技术7. 掌握连接池技术三、 实验内容1. 创建一个数据库，创建用户信息表、新闻表（与前面的javabean对应，注意类型的选择）2. 创建一个访问数据库的javabe

40、an, 或把创建连接createconn(), 关闭连接closeconn()方法写到新闻管理业务bean中。3. 实现新闻管理业务bean中的各个模块，如登录验证、新闻发布、新闻列表、新闻阅读等数据库访问。4. 配置tomcat自带的连接池，并修改访问数据库的bean或新闻管理业务bean中的创建连接方法createconn()，使之能调用连接池。5. 编写新闻阅读、新闻列表jsp页面。四、 实验仪器及耗材计算机，dreamweaver 8，myeclipse等软件。五、 实验步骤1、 打开sql企业管理器，创建一个news命名的数据库，创建两张表，一张为用户信息表，一张为新闻表。用户信息表

41、如下：create table use usename char(10) primary key not null password int(20) not null ; create table news timu char(10) primary key not null neirong char(100) zuozhe char(10) ；2、 编写访问数据库的javabean，cbean,作用是与数据库进行连接：package demo.bean;import java.sql.*;public final class cbeanpublic static final string driver=”sun.jdbc.odbc.jdbcodbcdriver”;pubiuc static final string dburl=”jdbc:odbc:news”;static public connection getconnection()connection conn=null;tryclass.forname(driver).newinstance();conn=drivermanager.getconnectiong(dburl,use,news);return con