當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

[JSP暑假实训] 二.JSP网站创建及Servlet实现注册表单提交、计算器运算

發布時間：2024/6/1 javascript 43 豆豆

生活随笔收集整理的這篇文章主要介紹了 [JSP暑假实训] 二.JSP网站创建及Servlet实现注册表单提交、计算器运算小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

本系列文章是作者暑假給學生進行實訓分享的筆記，主要介紹MyEclipse環境下JSP網站開發，包括JAVA基礎、網頁布局、數據庫基礎、Servlet、前端后臺數據庫交互、DAO等知識。
本篇文章開始講解MyEclipse環境下創建JSP網站，并實現注冊表頁面的創建及Servlet獲取提交的數據。非常基礎的文章，希望對讀者有所幫助，尤其是我的學生。

參考前文：
Java+MyEclipse+Tomcat (一)配置過程及jsp網站開發入門
Java+MyEclipse+Tomcat (二)配置Servlet及簡單實現表單提交
Java+MyEclipse+Tomcat (三)配置MySQL及查詢數據顯示在JSP網頁中
Java+MyEclipse+Tomcat (四)Servlet提交表單和數據庫操作
Java+MyEclipse+Tomcat (五)DAO和Java Bean實現數據庫和界面分開操作
Java+MyEclipse+Tomcat (六)詳解Servlet和DAO數據庫增刪改查操作

前文：
[JSP暑假實訓] 一.MyEclipse安裝及JAVA基礎知識

文章目錄

一.JSP網站創建
二.JSP注冊頁面實現
三.Servlet實現表單提交
- 1.什么是Servlet？
- 2.創建Servlet
四.Servlet實現計算器運算
五.總結

一.JSP網站創建

創建Web Project，工程命名為“test0630_web”。
注意，默認同學們學過HTML，推薦我的專欄：HTML網站前端設計

創建的工程目錄如下圖所示：

在WebRoot路徑下新建一個文件夾，命名為“imgs”，用于存儲圖片，然后編輯“index.jsp”主頁。

右鍵項目，點擊“Run As”->“MyEclipse Server Application”運行網站在本地服務器上。

其運行結果如下圖所示：

Web文檔都有一個唯一的地址，通過URL格式來進行定位，其格式為：
協議://IP地址:端口/站點名/目錄/文件名
其中協議主要有HTTP、HTTPS和FTP。根據不同的協議，默認端口可以省略，HTTP/HTTPS為80端口，FTP為21端口。例：http://210.30.108.30:8080/test/admin/login.jsp

二.JSP注冊頁面實現

修改“index.jsp”代碼，制作如下圖所示的注冊頁面：

完整代碼如下所示：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><base href="<%=basePath%>"><title>第一個JSP網站</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"></head><body><div align="center"><img src="imgs/timg.jpg" width="80%" height="200" /><marquee scrollamount="10">歡迎2016級軟件工程同學來到JSP課程!</marquee><hr width="80%" color="red" size="3" /><h2>注冊頁面</h2><form method="post" action="/test0630_web/servlet/ZCServlet">用戶名：<input type="text" name="t1" id="t1" /><br /><br />密碼：<input type="password" name="t2" id="t2" /><br /><br />確認密碼：<input type="password" name="t3" id="t3" /><br /><br />性別：男 <input type="radio" value="男" name="sex" id="t4" />女 <input type="radio" value="女" name="sex" id="t5" />未知 <input type="radio" value="未知" name="sex" id="t6" /><br /><br />興趣愛好：打籃球<input type="checkbox" value="打籃球" name="interest" id="t7" />看小說<input type="checkbox" value="看小說" name="interest" id="t8" />打LOL<input type="checkbox" value="打LOL" name="interest" id="t9" /><br /><br /><select name="age"><option>------請選擇年齡----------</option><option value="00后">00后</option><option value="90后">90后</option><option value="80后">80后</option><option value="70后">70后</option></select><br /><br /><input type="date" name="t10" id="t10" /><br /><br /><input type="color" name="t11" id="t11" /><br /><br /><input type="submit" name="t12" id="t12" /><input type="reset" name="t13" id="t12" /></form><hr width="80%" color="red" size="3" />網站所有權歸：楊秀璋及16級軟件工程學生所有</div> </body> </html>

三.Servlet實現表單提交

1.什么是Servlet？

在Sun公司制定Java EE規范初期，為實現動態Web而引入了Servlet，用于替代笨重的CGI(通用網關接口)，實現了Java語言編程的動態Web技術，奠定了Java EE的基礎。后來為進一步簡化動態Web網頁的生成，并且在微軟公司推出了ASP(Active X服務系統頁面)技術的競爭下，Sun推出了JSP規范，進一步簡化了Web網頁的編程。但JSP在進行HTTP請求處理方面不如Servlet方便和規范，Servlet在當今的MVC模式Web開發中牢牢占據一地，并且現在流行的Web框架基本基于Servlet技術，如Struts、WebWork和Spring MVC等。只有掌握了Servlet才能真正掌握Java Web編程的核心和精髓。

那么，究竟Servlet是什么呢？
Servlet是運行在Web容器的類，能處理Web客戶的HTTP請求，并產生HTTP響應。
Servlet是Java EE規范定義的Web組件，運行在Web容器中。由Web容器負責管理Servlet的聲明周期，包括創建和銷毀Servlet對象。客戶不能直接創建Servlet對象和調用Servlet的方法，只能通過向Web服務器發出HTTP請求，間接調用Servlet的方法。這是Servlet與普通Java類的重要區別。

Sun在如下兩個包中提供了Servlet的全部接口和類：

javax.servlet包含支持所有協議的通用Web組件接口和類
javax.servlet.http包含支持HTTP協議的接口和類

Servlet可以完成Web組件具有的所有功能，如下：

接收HTTP請求
取得請求信息，包括請求頭和請求參數數據
調用其他Java類方法完成具體的業務功能
生成HTTP響應，包括HTML和非HTML響應
實現到其他Web組件的跳轉，包括重定向和轉發

編寫Servlet需要引入的兩個包和Java I/O包：

import java.io.*; import javax.servlet.*; import javax.servlet.http.*;

編寫接收HTTP請求并進行HTTP響應的Servlet要繼承javax.servlet.http.HttpServlet。Servlet類的定義如下：

public class LoginAction extends HttpServlet {}

每個Servlet一般都需要重寫doGet方法和doPost方法。當用戶使用GET方式請求Servlet時，Web容器調用doGet方法處理請求；當用戶使用POST方法請求Servlet時，Web容器嗲用doPost方法。
Servlet是生命周期時序圖如上圖所示，包括加載類和實例化階段、初始化階段、處理請求階段和銷毀階段。

2.創建Servlet

第一步：選中“src”文件夾，然后右鍵新建一個Servlet文件，部分MyEclipse的Servlet創建位于Other中。

新建Servlet文件名為“ZCServlet”，同時創建在“servlet”文件夾中，如下圖所示：

由于Servlet是一個Java類文件，不像JSP那樣直接存放在Web目錄下就能獲得URL請求訪問地址。Servlet必須在Web的配置文件/WEB-INF/web.xml中進行配置和映射才能響應HTTP請求。

第二步：新建Servlet之后，會自動生成配置文件，此時的web.xml代碼如下：

<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"><display-name></display-name><servlet><description>This is the description of my J2EE component</description><display-name>This is the display name of my J2EE component</display-name><servlet-name>ZCServlet</servlet-name><servlet-class>servlet.ZCServlet</servlet-class></servlet><servlet-mapping><servlet-name>ZCServlet</servlet-name><url-pattern>/servlet/ZCServlet</url-pattern></servlet-mapping> <welcome-file-list><welcome-file>index.jsp</welcome-file></welcome-file-list> </web-app>

其中聲明Servlet的名字，一般與Servlet的類名相同即可，要求在一個web.xml文件內名字唯一。指定Servlet的全名，即包名.類型。Web容器會根據此定義載入類文件到內容中，進而調用默認構造方法創建Servlet對象。

Servlet映射：任何Web文檔在Internet上都要有一個URL地址才能被請求訪問，Servlet不能像JSP一樣直接放在Web的發布目錄下，因此Servlet需要單獨映射URL地址。在WEB-INF/web.xml中進行Servlet的URL映射。即：

<servlet-mapping><servlet-name>ZCServlet</servlet-name><url-pattern>/servlet/ZCServlet</url-pattern></servlet-mapping>

上面代碼是絕對地址方式映射，只能映射到一個地址。其中Servlet-name名稱和Servlet聲明中要一致，URL的格式如下：/目錄/目錄/文件名.擴展名。

第三步：編輯ZCServlet類中的代碼，涉及GET方法或POST方法。代碼如下所示，主要修改doPost方法。

package servlet;import java.io.IOException; import java.io.PrintWriter;import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;public class ZCServlet extends HttpServlet {/*** Constructor of the object.*/public ZCServlet() {super();}/*** Destruction of the servlet. <br>*/public void destroy() {super.destroy(); // Just puts "destroy" string in log// Put your code here}/*** The doGet method of the servlet. <br>** 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("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");out.println("<HTML>");out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");out.println(" <BODY>");out.print(" This is ");out.print(this.getClass());out.println(", using the GET method");out.println(" </BODY>");out.println("</HTML>");out.flush();out.close();}/*** The doPost method of the servlet. <br>** 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("UTF-8");response.setCharacterEncoding("UTF-8");//獲取用戶名String name = request.getParameter("t1");//密碼String pwd = request.getParameter("t2");//性別String sex = request.getParameter("sex");//興趣String [] interest = request.getParameterValues("interest");//年齡String age = request.getParameter("age");//時間String time = request.getParameter("t10");//顏色String color = request.getParameter("t11");response.setContentType("text/html");PrintWriter out = response.getWriter();out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");out.println("<HTML>");out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");out.println(" <BODY>");out.print(" This is ");out.print(this.getClass());out.println(", using the POST method");//輸出獲取的信息out.println("<h2>我注冊的用戶名為：" + name + "</h2>");out.println("<h2>我注冊的用戶密碼為：" + pwd + "</h2>");out.println("<h2>我注冊的用戶性別為：" + sex + "</h2>");out.println("<H2>興趣");for(String str:interest) {out.println(str+" ");}out.println("<h2>我注冊的年齡為：" + age + "</h2>");out.println("<h2>我注冊的時間為：" + time + "</h2>");out.println("<h2>我喜歡的顏色為：" + color + "</h2>");out.println(" </BODY>");out.println("</HTML>");out.flush();out.close();}/*** Initialization of the servlet. <br>** @throws ServletException if an error occurs*/public void init() throws ServletException {// Put your code here} }

第四步：修改JSP中表單提交的內容，當用戶注冊點擊提交時自動跳轉至結果頁面。

第五步：運行程序及反饋結果。
當用戶輸出信息并點擊提交按鈕之后，如下所示：

“楊秀璋”同學的注冊信息如下所示，其網址為：
http://desktop-2ptb11k:8080/test0630_web/servlet/ZCServlet

注意：學生“王志能”補充了如何修改訪問路徑的問題，感謝！同時，編碼方式統一設置為UTF-8。

四.Servlet實現計算器運算

下面補充一個案例，完整的介紹Servlet實現計算機的運算。

第一步：新建一個Web項目，項目名稱為“jisuanqi”。

第二步：書寫表單，在表單中可以輸入需要計算的兩個數，選擇計算符號，如下圖所示。

對應代碼如下：

第三步：前端表單書寫完畢之后便可以書寫后臺代碼了，后臺主要負責前端數據的獲取和計算。
后臺主要分為兩個類Cal.java、servletCal.java。其中Cal.java主要負責計算：

package servlet;public class Cal {private int num1; //數字private int num2; //數字private String pro; //運算public void setNum1(int num1) {this.num1 = num1;}public void setNum2(int num2) {this.num2 = num2;}double sum=0;//加法public double add(){sum=num1+num2;return sum;}//減法public double sub(){sum=num1-num2;return sum;}//乘法public double mult(){sum=num1*num2;return sum;}//除法public double div(){sum=num1/num2;return sum;} }

第四步：servletCal.java負責從前臺接收數據，數據接收完成后將其傳遞到算法中計算，將計算結果返回顯示在頁面上。

package servlet;import java.io.IOException; import java.io.PrintWriter;import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;public class servletCal extends HttpServlet {/*** Constructor of the object.*/public servletCal() {super();}/*** Destruction of the servlet. <br>*/public void destroy() {super.destroy(); // Just puts "destroy" string in log// Put your code here}/*** The doGet method of the servlet. <br>** 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("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");out.println("<HTML>");out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");out.println(" <BODY>");out.print(" This is ");out.print(this.getClass());out.println(", using the GET method");out.println(" </BODY>");out.println("</HTML>");out.flush();out.close();}/*** The doPost method of the servlet. <br>** 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 {//獲取數據并計算String num1=request.getParameter("num1");String num2=request.getParameter("num2");String pro=request.getParameter("pro");Cal cal=new Cal();cal.setNum1(Integer.parseInt(num1));cal.setNum2(Integer.parseInt(num2));double result=0;if(pro.equals("+")){result=cal.add();}else if(pro.equals("-")){result=cal.sub();}else if(pro.equals("*")){result=cal.mult();}else if(pro.equals("/")){result=cal.div();}response.setContentType("text/html");PrintWriter out = response.getWriter();out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");out.println("<HTML>");out.println(" <HEAD><TITLE>A Servlet</TITLE></HEAD>");out.println(" <BODY>");out.println("<h1>The Result is " + result + "</h1>");out.println(" </BODY>");out.println("</HTML>");out.flush();out.close();}/*** Initialization of the servlet. <br>** @throws ServletException if an error occurs*/public void init() throws ServletException {// Put your code here}}

第五步：修改index.jsp文件中的表單form提交代碼，即action參數。

此時程序的目錄如下所示：

第六步：運行程序并顯示相關結果。

五.總結

最近連續十多天給學生們分享暑假實訓，JSP網站開發，周末不間斷。大周末深夜凌晨辦公室備課，為了什么？回想三年來，挺感謝學生們的厚愛的，無以回報，只希望自己能好好分享知識，認真教好每一位學生，將心比心，也望自己博士學成歸來，能繼續教書育人，感恩家鄉和女神。

（By:Eastmount 2019-07-01 中午1點 http://blog.csdn.net/eastmount/）

總結

以上是生活随笔為你收集整理的[JSP暑假实训] 二.JSP网站创建及Servlet实现注册表单提交、计算器运算的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： [JSP暑假实训] 一.MyEclips
下一篇： [JSP暑假实训] 三.MySQL数据库