精品文檔實 驗 報 告實驗課程： WEB編程 學生姓名： 學 號： 專業班級： 2010年 12 月 20 日 目錄l 實驗一 .l 實驗二 .l 實驗三 .l 實驗四 .l 實驗五 .l 實驗六 .l 實驗七 . 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期：2010年9月15 日 實驗成績： 實驗一 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. 創建、發布、運行一個WEB工程。三、 實驗儀器及耗材計算機，JDK，TOMCAT, MySQL, MyEclipse等軟件。四、 實驗步驟1、 安裝并配置JDK和JRE2、 設置好classpath和path路徑3、 安裝Tomcat5.54、 設置Tomcat的配置屬性5、 安裝并配置MySQL數據庫6、 安裝MySqL Administrator工具7、 安裝MyEclipse8、 新建并配置一個工程，運行發布一個新的工程。五、 實驗結果1、 JDK、JRE安裝結果：2、 Classpath和path設置3、 安裝并配置Tomcat4、 安裝并配置MySqL和MySqL Administrator 工具5、 安裝MyEclipse6、 發布一個Web工程。六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期：2010年9月22 日 實驗成績： 實驗二 HTML和CSS編程技術 一、 實驗目的1. 熟悉HTML靜態網頁編程技術，熟悉HTML各種標記，特別是表單標記2. 熟悉CSS編程技術，掌握CSS來格式化網頁、掌握CSS盒式模型3. 掌握DIV+CSS布局和設計網頁，掌握CSS設計網頁的一般流程4. 熟悉Dreamweaver的CSS設計器二、 實驗內容1. 構思一個新聞發布網站，主題自選，設計好新聞類別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圖2、使用DIV+CSS布局3、細化每一塊4、美化表單部分六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期：2010年9月15 日 實驗成績： 實驗三 JavaScript編程技術一、 實驗目的1. 熟悉JavaScript語法2. 掌握JavaScript函數的創建和調用3. 熟悉JavaScript對象，特別是瀏覽器對象，了解DOM模型，知道文檔對象的訪問方法。4. 會用JavaScript來對表單進行驗證。二、 實驗內容1. 用JavaScript完成對登錄表單的驗證2. 設計一個新聞發布的頁面，并用JavaScript對新聞發布表單進行驗證。三、 實驗儀器及耗材計算機，Dreamweaver 8，Photoshop，MyEclipse等軟件。四、 實驗步驟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(請輸入密碼);return false;elsereturn 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;if(a=)alert(請輸入的作者);return false;if(t=)alert(請輸入的標題);return false;else if(c=)alert(請輸入的內容);return false;else return true;五、 實驗結果1、 表單驗證結果2、 文章發布頁面驗證六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期：2010年9月29 日 實驗成績： 實驗四 Servlet編程技術一、 實驗目的1. 熟悉Servlet技術的創建和運行流程。2. 會在web.xml配置Servlet的URL3. 熟悉請求request和響應response接口4. 熟悉請求轉發接口requestDispatcher接口5. 熟悉會話Session接口，掌握基于Session登錄權限控制。二、 實驗內容完成一個基于Session的登錄權限控制模塊。要求：a) 主頁登錄表單提交后轉到Servlet進行處理，根據用戶類型轉到不同的頁面。如果在用戶名或密碼不正確把登錄表單包含進來b) 對于某些頁面必須登錄才能訪問，如新聞發布頁面。如果沒有登錄則禁止訪問，并重定向到登錄頁面。三、 實驗儀器及耗材計算機， MyEclipse等軟件。四、 實驗步驟1、 設計和實現一個登錄表單2、 設計和實現實現驗證的Servlet，然后進行驗證五、 實驗結果1、 表單驗證效果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. * * 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(, using the GET method);out.println( );out.println();out.flush();out.close();/* * 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)HttpSession session=request.getSession(true);Member m=mp.getMemberByName(username);session.setAttribute(userinfo, m);session.setAttribute(login, true);session.setAttribute(memberId, username);session.setAttribute(loginusername, username);if(request.getParameter(backpage)=null)request.getRequestDispatcher(index.jsp).forward(request, response);elserequest.getRequestDispatcher(request.getParameter(backpage).forward(request, response);elserequest.setAttribute(loginresult,密碼錯誤);request.getRequestDispatcher(member.jsp).forward(request, response);elserequest.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六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期2010年10月13日 實驗成績： 實驗五 JSP編程技術一、 實驗目的6. 熟悉JSP編譯指令，動作標記。7. 熟悉JSP的隱含對象8. 正確理解request、session、application三個對象的作用域9. 能正確處理漢字亂碼問題10. 能熟練使用JSP技術來編寫網頁二、 實驗內容1. 編寫一個文章類，用Myeclipse的工作自動產生getter和settet函數2. 修改前面編寫過的管理員的新聞發布頁面，改成JSP頁面要求如下：1）撰寫界面至少包括文件標題，所屬欄目、作者、內容幾項2）界面用CSS進行美化3）每個輸入框均應有name屬性。4）權限控制，必須是管理員用戶才能訪問，跟前面實驗的登錄權限控制關聯起來。 3. 編寫一個Servlet來處理新聞發布頁面提交的表單要求：1）讀取表單各項內容，并把存入一個文章對象中。2）把文章對象綁定在request對象中，并轉發到新聞顯示頁面。3. 編寫一個新聞顯示頁面。 要求： 1) 編寫靜態頁面模板，頁面用div+css設計2）設定文章對象已存在request對象中，取出文章對象3）把靜態頁面的內容改成動態內容，如標題，作者，內容等。三、 實驗儀器及耗材計算機，Dreamweaver 8，Photoshop，MyEclipse等軟件。四、 實驗步驟1、 設計和實現新聞發布系統的頁面2、 、設計和實現后臺的Servlet五、 實驗結果1、 頁面的實現2、 Servlet的實現public class ArticleServlet extends HttpServlet private static final long serialVersionUID = 1L;public ArticleServlet() super();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)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, a);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);catch(NumberFormatException e)id=1; Vector cmts=ab.getComments(id);request.setAttribute(comments, cmts);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);/* * 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);catch(NumberFormatException e)id=1; request.getRequestDispatcher(article.jsp?articleId=+id).forward(request, response);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);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六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期2010年10月20 日 實驗成績： 實驗六 JavaBean編程技術 一、 實驗目的1. 熟悉JavaBean的規范2. 會編寫JavaBean; 會在JSP和Servlet中創建和使用JavaBean對象3. 掌握JSP的、的使用4. 掌握JSP中表單和表單Bean的映射5. 掌握Servlet中表單和表單Bean的映射6. 會編寫封裝業績邏輯的JavaBean7. 會使用上傳下載組件jspSmartUpload外部組件二、 實驗內容1. 修改前面的封裝新聞（文章）的JavaBean，使其符合JavaBean規范2. 修改前面的新聞發表Serlvet，用來完成新聞發布表單的處理，要求利用映射機制把新聞表單映射到新聞的JavaBean中，以便后繼把這個JavaBean寫入數據庫。3. 編寫一個封閉新聞管理的業務Bean. 這里只需定義接口即可。4. 參考教材，編寫一個上傳下載模塊（可選）5. 參考教材，實現登錄動態驗證（可選）三、 實驗儀器及耗材計算機，Dreamweaver 8，Photoshop，MyEclipse等軟件。四、 實驗步驟1、 編寫文章Bean2、 編寫業務Bean五、 實驗結果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) 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;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;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);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); 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中發生了錯誤);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(); 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();六、 實驗心得 南昌大學實驗報告學生姓名： 學 號： 專業班級： 實驗類型： 驗證 綜合 設計 創新 實驗日期： 2010-12-12 實驗成績： 實驗七 JDBC數據庫編程技術 （4課時）一、 實驗目的1. 掌握JDBC來訪問數據庫的一般步聚2. 掌握JDBC來連接各類數據庫3. 掌握Connection、Statement、PrepareStatement和ResultSet幾個類。4. 掌握JDBC事務處理機制。5. 會編寫使用JDBC訪問數據庫的JavaBean6. 掌握分頁顯示技術7. 掌握連接池技術二、 實驗內容1. 創建一個數據庫，創建用戶信息表、新聞表（與前面的JavaBean對應，注意類型的選擇）2. 創建一個訪問數據庫的JavaBean, 或把創建連接createConn(), 關閉連接closeConn()方法寫到新聞管理業務Bean中。3. 實現新聞管理業務Bean中的各個模塊，如登錄驗證、新聞發布、新聞列表、新聞閱讀等數據庫訪問。4. 配置Tomcat自帶的連接池，并修改訪問數據庫的Bean或新聞管理業務Bean中的創建連接方法createConn()，使之能調用連接池。5. 編寫新聞閱讀、新聞列表JSP頁面。三、 實驗儀器及耗材計算機，Dreamweaver 8，MyEclipse等軟件。四、 實驗步驟1、 創建數據庫2、 創建數據庫連接的類3、 設計和實現各個模塊的Javabean五、 實驗結果1、 數據庫2、 數據庫連接類3、 設計和實現各個模塊的Javabeanpublic class ArticleBll public Vector getPageOfArticles(int pageSize,int pageIndex,int increase)Vector as=new Vector();String sql=select * from article limit +(pageIndex-1)*pageSize+,+increase;ResultSet rs=DBAccess.executeQueary(sql);if(rs!=null)try doArticle 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;finallyDBAccess.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);if(rs!=null)try doa.setId(rs.getInt(1);a.setTitle(rs.getString(2);a.setAuthor(r