Day04 Servlet - Hello Servlet - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

2024 iThome 鐵人賽

DAY 5

Software Development

從Servlet到Spring MVC系列第 5 篇

Day04 Servlet - Hello Servlet

16th鐵人賽

James

2024-09-19 21:46:25

134 瀏覽

分享至

前言

前一天我們介紹了tomcat與IDEA的整合，從無到有架構了web的項目從開發->構建->佈署走了一回，今天我們正式踏入Servlet的領域。

靜態資源與動態資源

介紹Servlet前我們先來看一下在Server上的兩種資源

靜態資源
就是不會變動的資源，例如html、css、js、image等這些我們放在static資料夾的東西
動態資源
Server運行時需透過程式碼動態生成的資源，例如Servlet、Thymeleaf等

maven專案建置

File -> New -> module

輸入專案名稱，選擇Archetype為webapp的選項

建立後maven跑完就會有以下路徑了，是不是很快呢

接著src資料夾右鍵

創建java資料夾作為撰寫servlet的路徑，其他標準Maven資料夾可按需創建

Edit configuration

加入day04:war exploded，修改Application Context

啟動tomcat，訪問localhost:8080

HelloServlet

加入servlet-api

調整pom檔，移除用不到的junit，加入前一天提到servlet需要的servlet-api

<dependencies>
  <!-- copy from maven repository https://mvnrepository.com/artifact/jakarta.servlet/jakarta.servlet-api/6.0.0 -->
  <dependency>
    <groupId>jakarta.servlet</groupId>
    <artifactId>jakarta.servlet-api</artifactId>
    <version>6.0.0</version>
    <scope>provided</scope>
  </dependency>
</dependencies>

創建index.html

首先我們這次的30天挑戰並不會說到jsp，我們先把由maven自動產生的index.jsp刪除，
創建index.html

<body>
    <form action="get" action="HelloServlet">
        請輸入大名 <input type="username"><br>
        <input type="submit" value="Submit">
    </form>
</body>

開發HandleHelloServlet

implements Servlet會產生很多override方法，我們重寫service方法

@Override
public void service(ServletRequest request, ServletResponse response) throws IOException {
    //get parameter from request
    String username = request.getParameter("username");
    //handle parameter
    String helloMessage = "Hello " + username + "!";
    //add message to request
    response.getWriter().write(helloMessage);
}

創建xsd 6.0的部署描述檔

調整web.xml(部署描述檔Deployment Descriptors，簡稱DD檔)，由於maven產生的版本比較舊，我們先刪除舊的再透過IDEA重新產生6.0的DD檔

建立6.0的DD檔

web.xml設定Servlet Mapping

url-pattern就是瀏覽器訪問的網址路徑，web container透過這個設定mapping找到對應的Servlet來處理請求

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="https://jakarta.ee/xml/ns/jakartaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="https://jakarta.ee/xml/ns/jakartaee https://jakarta.ee/xml/ns/jakartaee/web-app_6_0.xsd"
         version="6.0">
    <servlet>
        <servlet-name>HandleHelloServlet</servlet-name>
        <servlet-class>com.swj.HandleHelloServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>HandleHelloServlet</servlet-name>
        <url-pattern>/HelloServlet</url-pattern>
    </servlet-mapping>
</web-app>

啟動服務訪問HelloServlet Get請求

我們會發現GET請求會將請求參數連同請求網址由?分隔帶到Server端請求

啟動服務訪問HelloServlet Get請求

我們修改前面index.html中form表單method為post

<body>
    <form action="post" action="HelloServlet">
        請輸入大名 <input type="username"><br>
        <input type="submit" value="Submit">
    </form>
</body>

post請求不會把請求數據放在url中

請求數據放在body中