长江职业学院
JSP语言程序设计实验指导书 专 业： 学 号： 姓 名： 班 级： 指导 老师：
软件教研室 编
目录
实验一 .............................................. 实验二 ............................................. 实验三 ............................................. 实验四 ............................................. 实验五 ............................................. 实验六 ............................................. 实验七 ..............................................
实验一 Web编程环境
一、 实验目的
1. 搭建Web编程环境，能正确安装配置java运行环境、WEB服务器和数据库服务器
2. 熟悉WEB编程集成环境MYEclipse.
3. 熟练掌握WEB工程的创建、发布、运行流程。
1
二、 实验内容
1. 安装并配置java运行环境JDK和JRE
2. 安装Web服务器tomcat, 配置Tomcat服务器
3. 安装并配置数据库MySQL.
4. 安装MyEclispe，熟悉各项菜单项
5. 为MyEclispe集成配置JDK和Tomcat
6. 创建、发布、运行一个WEB工程。
三、 实验仪器及耗材
计算机，JDK，TOMCAT, MySQL, MyEclipse等软件。 四、 实验步骤
1、 安装并配置JDK和JRE 2、 设置好classpath和path路径 3、 安装Tomcat5.5 4、 设置Tomcat的配置属性 5、 安装并配置MySQL数据库 6、 安装MySqL Administrator工具 7、 安装MyEclipse
8、 新建并配置一个工程，运行发布一个新的工程。
2
五、 实验结果
1、 JDK、JRE安装结果：
2、 Classpath和path设置
3、 安装并配置Tomcat
3
4、 安装并配置MySqL和MySqL Administrator 工具
5、 安装MyEclipse
4
6、 发布一个Web工程。
5
六、 实验心得
实验二 HTML和CSS编程技术
一、 实验目的
1. 熟悉HTML静态网页编程技术，熟悉HTML各种标记，特别是表单标记2. 熟悉CSS编程技术，掌握CSS来格式化网页、掌握CSS盒式模型
3. 掌握DIV+CSS布局和设计网页，掌握CSS设计网页的一般流程
4. 熟悉Dreamweaver的CSS设计器
二、 实验内容
1. 构思一个新闻发布网站，主题自选，设计好新闻类别
6
2. 制作主页PSD图
3. 用DIV+CSS布局主页框架。（如可分成top, mid, foot, 其中mid再分两大块left和main）
4. 分别细化设计每一大块。
5. 要中间部分的左边或右边要设计一个小登录表单，并用CSS美化。
三、 实验仪器及耗材
计算机，Dreamweaver 8，Photoshop，MyEclipse等软件。 四、 实验步骤 1、 制作PSD图 2、 使用DIV+CSS布局 3、 细化每一块 4、 美化表单部分 五、 实验结果 1、制作PSD图
7
2、使用DIV+CSS布局
3、细化每一块
8
4、美化表单部分 六、 实验心得
实验三 JavaScript编程技术
一、 实验目的 1. 熟悉JavaScript语法
2. 掌握JavaScript函数的创建和调用
3. 熟悉JavaScript对象，特别是浏览器对象，了解DOM模型，知道文档对象的访问方法。
4. 会用JavaScript来对表单进行验证。 二、 实验内容
1. 用JavaScript完成对登录表单的验证
2. 设计一个新闻发布的页面，并用JavaScript对新闻发布表单进行验证。 三、 实验仪器及耗材
计算机，Dreamweaver 8，Photoshop，MyEclipse等软件。
9
四、 实验步骤
1、 设计和实现对表单验证的过程 代码如下：
function checklogin()
{
var user=document.getElementsByName(\"username\")[0].value;
var pass=document.getElementsByName(\"password\")[0].value;
if(user==\"\")
{
alert('请输入用户名');
return false;
}
else if(pass==\"\")
{
alert(\"请输入密码\");
10
return false;
}
else
{
return true;
}
}
2、 设计和实现对新闻发布的验证过程 代码如下：
function checkarticle()
{
var a=document.getElementsByName(\"author\")[0].value;
var t=document.getElementsByName(\"title\")[0].value;
var c=document.getElementsByName(\"content\")[0].value;
11
if(a==\"\")
{
alert('请输入的作者');
return false;
}
if(t==\"\")
{
alert('请输入的标题');
return false;
}
else if(c==\"\")
{
alert('请输入的内容');
12
return false;
}
else
{
return true;
}
}
五、 实验结果 1、 表单验证结果
13
2、 文章发布页面验证
14
六、 实验心得
实验四 Servlet编程技术
一、 实验目的
1. 熟悉Servlet技术的创建和运行流程。
2. 会在web.xml配置Servlet的URL
3. 熟悉请求request和响应response接口
4. 熟悉请求转发接口requestDispatcher接口
5. 熟悉会话Session接口，掌握基于Session登录权限控制。
15
二、 实验内容
完成一个基于Session的登录权限控制模块。
要求：
a) 主页登录表单提交后转到Servlet进行处理，根据用户类型转到不同的页面。如果在用户名或密码不正确把登录表单包含进来
b) 对于某些页面必须登录才能访问，如新闻发布页面。如果没有登录则禁止访问，并重定向到登录页面。
三、 实验仪器及耗材 计算机， MyEclipse等软件。 四、 实验步骤
1、 设计和实现一个登录表单
2、 设计和实现实现验证的Servlet，然后进行验证 五、 实验结果 1、 表单验证效果
16
2、 验证Servlet源代码
public class LoginServlet extends HttpServlet { /**
* Constructor of the object. */
public LoginServlet() { super(); } /**
* Destruction of the servlet.
*/
public void destroy() {
super.destroy(); // Just puts \"destroy\" string in log // Put your code here } /**
* The doGet method of the servlet.
*
* This method is called when a form has its tag value method equals to get.
17
*
* @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */
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.print(\" This is \"); out.print(this.getClass());
out.println(\out.println(\" \"); out.println(\"\"); out.flush(); out.close(); }
18
HTML PUBLIC \\\"-//W3C//DTD HTML 4.01
/**
* The doPost method of the servlet.
*
* This method is called when a form has its tag value method equals to post. *
* @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding(\"GBK\");
response.setContentType(\"text/html;charset=GBK\"); response.setCharacterEncoding(\"GBK\");
String username=request.getParameter(\"username\"); System.out.println(\"用户名：\"+username); MemberProcess mp=new MemberProcess(); if((mp.isExisted(username))) {
String password=request.getParameter(\"password\"); System.out.println(\"输入的密码：\"+password); if(mp.validate(username,password)) {
19
HttpSession session=request.getSession(true); Member m=mp.getMemberByName(username); session.setAttribute(\"userinfo\session.setAttribute(\"login\
session.setAttribute(\"memberId\session.setAttribute(\"loginusername\if(request.getParameter(\"backpage\")==null) {
request.getRequestDispatcher(\"index.jsp\").forward(request, response); } else {
request.getRequestDispatcher(request.getParameter(\"backpage\")).forward(request, response);
} } else {
request.setAttribute(\"loginresult\密码错误\");
request.getRequestDispatcher(\"member.jsp\").forward(request, response); } } else {
20
request.setAttribute(\"loginresult\用户名不存在\");
request.getRequestDispatcher(\"login.jsp\").forward(request, response); } } /**
* Initialization of the servlet.
*
* @throws ServletException if an error occurs */
public void init() throws ServletException { // Put your code here } }
六、 实验心得
实验五 JSP编程技术
一、 实验目的
6. 熟悉JSP编译指令，动作标记。
7. 熟悉JSP的隐含对象
8. 正确理解request、session、application三个对象的作用域
9. 能正确处理汉字乱码问题
21
10. 能熟练使用JSP技术来编写网页
二、 实验内容
1. 编写一个文章类，用Myeclipse的工作自动产生getter和settet函数
2. 修改前面编写过的管理员的新闻发布页面，改成JSP页面
要求如下：
1）撰写界面至少包括文件标题，所属栏目、作者、内容几项
2）界面用CSS进行美化
3）每个输入框均应有name属性。
4）权限控制，必须是管理员用户才能访问，跟前面实验的登录权限控制关联起来。3. 编写一个Servlet来处理新闻发布页面提交的表单
4. 要求：
5. 1）读取表单各项内容，并把存入一个文章对象中。
6. 2）把文章对象绑定在request对象中，并转发到新闻显示页面。
3. 编写一个新闻显示页面。
22
要求：
1) 编写静态页面模板，页面用div+css设计
2）设定文章对象已存在request对象中，取出文章对象
3）把静态页面的内容改成动态内容，如标题，作者，内容等。三、 实验仪器及耗材
计算机，Dreamweaver 8，Photoshop，MyEclipse等软件。四、 实验步骤
1、 设计和实现新闻发布系统的页面 2、 、设计和实现后台的Servlet 五、 实验结果 1、 页面的实现
23
2、 Servlet的实现
public class ArticleServlet extends HttpServlet { private static final long serialVersionUID = 1L; public ArticleServlet() { super();
24
}
public void destroy() {
super.destroy(); // Just puts \"destroy\" string in log // Put your code here } /**
* The doGet method of the servlet.
*
* This method is called when a form has its tag value method equals to get. *
* @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding(\"GBK\"); response.setCharacterEncoding(\"GBK\");
response.setContentType(\"text/html;charset=GBK\"); ArticleBll ab=new ArticleBll();
String opType=request.getParameter(\"opType\"); if(opType==null) {
25
request.getRequestDispatcher(\"articlelist.jsp\").forward(request, response); }
else if(opType.equals(\"see\")) {
String aid=request.getParameter(\"articleId\"); int id=0; try {
id=Integer.parseInt(aid); }catch(NumberFormatException e) { id=1; }
Article a=ab.getArticle(id); request.setAttribute(\"article\
request.getRequestDispatcher(\"article.jsp\").forward(request, response); }
else if(opType.equals(\"seecmts\")) {
String aid=request.getParameter(\"articleId\"); int id=0; try {
id=Integer.parseInt(aid);
26
}catch(NumberFormatException e) { id=1; }
Vector cmts=ab.getComments(id); request.setAttribute(\"comments\request.getRequestDispatcher(\"allcomments.jsp?articleId=\"+id).forward(request, response);
}
else if(opType.equals(\"remove\")) {
String aid=request.getParameter(\"articleId\"); int id=0; try {
id=Integer.parseInt(aid); }catch(NumberFormatException e) { id=1; }
new ArticleBll().remove(id);
request.getRequestDispatcher(\"article.jsp?articleId=\"+id).forward(request, response);
}
27
} /**
* The doPost method of the servlet.
*
* This method is called when a form has its tag value method equals to post. *
* @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { request.setCharacterEncoding(\"GBK\"); response.setCharacterEncoding(\"GBK\");
response.setContentType(\"text/html;charset=GBK\"); String opType=request.getParameter(\"opType\"); if(opType==null) {
String aid=request.getParameter(\"articleId\"); int id=0; try {
id=Integer.parseInt(aid);
28
}catch(NumberFormatException e) { id=1; }
request.getRequestDispatcher(\"article.jsp?articleId=\"+id).forward(request, }
else if(opType.equals(\"givecmt\")) {
//发表评论
String aid=request.getParameter(\"articleId\"); int id=0; try {
id=Integer.parseInt(aid); }catch(NumberFormatException e) { id=1; }
Comment c=new Comment(); c.setArticle_id(id);
c.setTitle(request.getParameter(\"title\")); c.setContent(request.getParameter(\"content\")); new CommentBll().insert(c);
29
response);
request.getRequestDispatcher(\"article.jsp?articleId=\"+id).forward(request, response);
} } /**
* Initialization of the servlet.
*
* @throws ServletException if an error occurs */
public void init() throws ServletException { // Put your code here } }
六、 实验心得
实验六 JavaBean编程技术
一、 实验目的
1. 熟悉JavaBean的规范
2. 会编写JavaBean; 会在JSP和Servlet中创建和使用JavaBean对象
3. 掌握JSP的、、的使用4. 掌握JSP中表单和表单Bean的映射30
5. 掌握Servlet中表单和表单Bean的映射
6. 会编写封装业绩逻辑的JavaBean
7. 会使用上传下载组件jspSmartUpload外部组件
二、 实验内容
1. 修改前面的封装新闻（文章）的JavaBean，使其符合JavaBean规范
2. 修改前面的新闻发表Serlvet，用来完成新闻发布表单的处理，要求利用映射机制把新闻表单映射到新闻的JavaBean中，以便后继把这个JavaBean写入数据库。
3. 编写一个封闭新闻管理的业务Bean. 这里只需定义接口即可。
4. 参考教材，编写一个上传下载模块（可选）
5. 参考教材，实现登录动态验证（可选）
三、 实验仪器及耗材
计算机，Dreamweaver 8，Photoshop，MyEclipse等软件。 四、 实验步骤 1、 编写文章Bean 2、 编写业务Bean 五、 实验结果
31
1、 文章Bean源代码 package article.entity;
import java.sql.Date;
public class Article {
private int id;
private String title;
private String author;
private String content;
private Date created_time;
private Date updated_time;
public int getId() {
return id;
}
public void setId(int id) {
32
this.id = id;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getAuthor() {
return author;
}
public void setAuthor(String author) {
this.author = author;
33
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
public Date getCreated_time() {
return created_time;
}
public void setCreated_time(Date created_time) {
this.created_time = created_time;
}
34
public Date getUpdated_time() {
return updated_time;
}
public void setUpdated_time(Date updated_time) {
this.updated_time = updated_time;
}
}
2、 业务Bean源代码 public class AdminProcess {
public Administrator getAdminByName(String username) { Administrator a=null;
String sql=\"select * from admin where username=\\\"\"+username+\"\\\"\"; ResultSet rs=DBAccess.executeQueary(sql); if(rs!=null) { try {
a=new Administrator(); a.setId(rs.getInt(1));
35
a.setUsername(rs.getString(2)); a.setPassword(rs.getString(3)); return a;
} catch (SQLException e) { return null; } } return a; } }
3、 数据库连接Bean的实现 public class DBAccess {
private static String driver=\"com.mysql.jdbc.Driver\";
private static String dbUrl=\"jdbc:mysql://localhost:3306/article_db\"; private static String user=\"root\"; private static String password=\"root\"; private static Connection conn=null; private static Statement stat=null; private static ResultSet rs=null;
public static Connection getConnection() { try {
Class.forName(driver);
conn=DriverManager.getConnection(dbUrl, user, password);
36
} catch (ClassNotFoundException e1) { e1.printStackTrace(); return null;
}catch (SQLException e) { e.printStackTrace(); return null; }
return conn; }
public static ResultSet executeQueary(String sql) {
System.out.println(sql); conn=getConnection(); try {
stat=conn.createStatement(); rs=stat.executeQuery(sql); } catch (SQLException e) { e.printStackTrace(); return null; } try {
return rs.next()?rs:null; } catch (SQLException e) {
System.out.println(\"DBAccess中发生了错误\");
37
e.printStackTrace(); return null; } }
public static int executeUpdate(String sql) {
System.out.println(\"DB update:\"+sql); conn=getConnection(); int rows=0; try {
stat=conn.createStatement(); rows=stat.executeUpdate(sql); } catch (SQLException e) { e.printStackTrace(); return 0; }
return rows; }
public static void close() {
if(rs!=null) { try { rs.close();
38
} catch (SQLException e) { e.printStackTrace(); } }
if(stat!=null) { try { stat.close();
} catch (SQLException e) { e.printStackTrace(); } }
if(conn!=null) { try { conn.close();
} catch (SQLException e) { e.printStackTrace(); } } } }
六、 实验心得
39
实验七 JDBC数据库编程技术 （4课时）
一、 实验目的
1. 掌握JDBC来访问数据库的一般步聚
2. 掌握JDBC来连接各类数据库
3. 掌握Connection、Statement、PrepareStatement和ResultSet几个类。
4. 掌握JDBC事务处理机制。
5. 会编写使用JDBC访问数据库的JavaBean
6. 掌握分页显示技术
7. 掌握连接池技术
二、 实验内容
1. 创建一个数据库，创建用户信息表、新闻表（与前面的JavaBean对应，注意类型的选择）
2. 创建一个访问数据库的JavaBean, 或把创建连接createConn(), 关闭连接closeConn()方法写到新闻管理业务Bean中。
3. 实现新闻管理业务Bean中的各个模块，如登录验证、新闻发布、新闻列表、新闻阅
40
读等数据库访问。
4. 配置Tomcat自带的连接池，并修改访问数据库的Bean或新闻管理业务Bean中的创建连接方法createConn()，使之能调用连接池。
5. 编写新闻阅读、新闻列表JSP页面。
三、 实验仪器及耗材
计算机，Dreamweaver 8，MyEclipse等软件。 四、 实验步骤 1、 创建数据库 2、 创建数据库连接的类
3、 设计和实现各个模块的Javabean 五、 实验结果 1、 数据库
41
2、 数据库连接类
3、 设计和实现各个模块的Javabean public class ArticleBll {
public Vector getPageOfArticles(int pageSize,int pageIndex,int increase){
Vector as=new Vector();String sql=\"select * from article limit \"+(pageIndex-1)*pageSize+\ResultSet rs=DBAccess.executeQueary(sql); if(rs!=null) { try { do {
42
Article a=new Article(); a.setId(rs.getInt(1)); a.setTitle(rs.getString(2)); a.setAuthor(rs.getString(3)); a.setContent(rs.getString(4)); a.setCreated_time(rs.getDate(5)); a.setUpdated_time(rs.getDate(6)); as.add(a); }while(rs.next());
} catch (SQLException e) { return as; } finally {
DBAccess.close(); } }
return as; }
public Article getArticle(int id) {
Article a=new Article();
String sql=\"select * from article where id=\"+id; ResultSet rs=DBAccess.executeQueary(sql);
43
if(rs!=null) { try { do {
a.setId(rs.getInt(1)); a.setTitle(rs.getString(2)); a.setAuthor(rs.getString(3)); a.setContent(rs.getString(4)); a.setCreated_time(rs.getDate(5)); a.setUpdated_time(rs.getDate(6)); }while(rs.next());
} catch (SQLException e) { return a; } finally {
DBAccess.close(); } } return a; }
public Vector getComments(int id) {44
Vector as=new Vector(); String sql=\"select * from comment where article_id=\"+id; ResultSet rs=DBAccess.executeQueary(sql); if(rs!=null) { try { do {Comment a=new Comment(); a.setId(rs.getInt(1)); a.setArticle_id(rs.getInt(2)); a.setContent(rs.getString(3)); a.setCreated_time(rs.getDate(4)); a.setTitle(rs.getString(5)); as.add(a); }while(rs.next());
} catch (SQLException e) { return as; } finally {
DBAccess.close(); } }
45
return as; }
public void insert(Article a) {
String sql=\"insert into article(title,author,con\" + \"tent,created_time) values(\" + \"\\\"\"+a.getTitle()+\"\\\\"\\\"\"+a.getAuthor()+\"\\\\"\\\"\"+a.getContent()+\"\\\DBAccess.executeUpdate(sql); DBAccess.close(); }
public void remove(int id) {
String sql=\"delete from article where id=\"+id; DBAccess.executeUpdate(sql); DBAccess.close(); }
// public void update(Article a) // { // String sql=\"delete from article where id=\"+id; // DBAccess.executeUpdate(sql); // DBAccess.close();
// }
46
public void removeAllComments(int id) {
String sql=\"delete from article where article_id=\"+id; DBAccess.executeUpdate(sql); DBAccess.close(); }
public int getArticlePageCount(int pageSize) {
String sql=\"select count(id) from article\"; int count=0;
ResultSet rs=DBAccess.executeQueary(sql); if(rs!=null) { try {
count=rs.getInt(1); int i=count%pageSize;
count=i==0?count/pageSize:(count/pageSize+1); } catch (SQLException e) { return count; } finally {
DBAccess.close(); }
47
}
return count; } }
六、 实验心得
48