우리는 엔터티를 만듭니다.
엔터티 패키지에 User 클래스를 생성해 보겠습니다. 여기서는 두 개의 개인 문자열 변수 name과 비밀번호를 생성합니다. 생성자(기본값과 두 값을 모두 허용하는 생성자), getter/setter를 만들고, 만일의 경우에 대비해 toString() 메서드와 equals() 및 hashCode() 메서드를 재정의해 보겠습니다.public class User { private String name; private String password; public User() { } public User(String name, String password) { this.name = name; this.password = password; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } @Override public String toString() { return "User{" + "name='" + name + '\'' + ", password='" + password + '\'' + '}'; } @Override public boolean equals(Object o) { if (this == o) return true; if (o == null || getClass() != o.getClass()) return false; User user = (User) o; if (name != null ? !name.equals(user.name) : user.name != null) return false; return password != null ? password.equals(user.password) : user.password == null; } @Override public int hashCode() { int result = name != null ? name.hashCode() : 0; result = 31 * result + (password != null ? password.hashCode() : 0); return result; } } 이제 사용자를 추가하고 표시할 사용자 목록을 생성할 수 있습니다. 그러나 문제가 있습니다. 우리가 서블릿 객체를 생성하는 것이 아니라 Tomcat이 우리를 위해 생성합니다. 우리가 재정의하는 메서드도 이미 정의되어 있으므로 매개변수를 추가할 수 없습니다. 그렇다면 두 서블릿 모두에서 볼 수 있는 공통 목록을 어떻게 만들 수 있습니까? 단순히 각 서블릿에 자체 목록 개체를 생성하면 사용자를 하나의 목록에 추가하게 되지만 ListServlet 서블릿을 사용하여 사용자 목록을 표시하는 것은 완전히 달라집니다. 두 서블릿 모두에 공통적인 객체가 필요하다는 것이 밝혀졌습니다. 일반적으로 말하면, 프로그램의 모든 클래스에 공통되는 객체가 필요합니다. 전체 프로그램에 대한 유일한 개체입니다. 디자인 패턴에 대해 들어보셨기를 바랍니다. 그리고 아마도 어떤 사람들에게는 이것이 그들의 프로그램에서
싱글톤 템플릿을 사용해야 하는 첫 번째 실제 요구일 것입니다 . 이중 확인과 동기화를 통해 창의력을 발휘하고 멋진 싱글톤을 만들 수 있습니다(예, Tomcat은 다른 스레드에서 서블릿을 실행하므로 다중 스레드 애플리케이션이 있습니다). 그러나 이 경우에는 조기 초기화 옵션을 사용하겠습니다. 꽤 적합합니다.
모델을 만드는 중입니다.
그런 다음 모델 패키지에 클래스를 만들고(그리고 그 안에 싱글톤 템플릿을 구현합니다), 이를 꽤 다채롭게 Model이라고 부르겠습니다. 그 안에 개인 사용자 목록 개체를 만들고 두 가지 메서드를 만들어 보겠습니다. 하나는 사용자를 추가할 수 있고, 두 번째는 단순히 문자열(사용자 이름) 목록을 반환하도록 합니다. 사용자 개체는 이름과 비밀번호로 구성되어 있으므로 사용자 비밀번호를 "공개"하고 싶지 않으므로 이름 목록만 반환합니다.public class Model { private static Model instance = new Model(); private List
model; public static Model getInstance() { return instance; } private Model() { model = new ArrayList<>(); } public void add(User user) { model.add(user); } public List
list() { return model.stream() .map(User::getName) .collect(Collectors.toList()); } }
mvc에 대해 조금.
싱글톤에 대해 들어봤다면 이는 아마도 다른 디자인 패턴, 즉 MVC(모델-뷰-컨트롤러, 러시아어 모델-뷰-컨트롤러 또는 영어 모델-뷰-컨트롤러와 유사)에 대해 들어봤음을 의미합니다. 그 본질은 비즈니스 로직을 프리젠테이션과 분리하는 것입니다. 즉, 무엇을 할지 결정하는 코드와 표시 방법을 결정하는 코드 를 분리하세요 . 보기(보기 또는 보기만)는 일부 데이터가 표시되는 형식을 담당합니다. 우리의 경우 뷰는 JSP 페이지입니다. 그래서 views라는 폴더에 넣어두었습니다. 모델은 프로그램이 작동하는 실제 데이터입니다. 우리의 경우 이들은 사용자(사용자 목록)입니다. 글쎄, 컨트롤러는 그들 사이의 연결 링크입니다. 모델에서 데이터를 가져와 뷰로 전송하거나 Tomcat에서 일부 데이터를 받아 처리한 후 모델로 전송합니다. 비즈니스 로직(즉, 수행할 작업 )은 모델이나 뷰가 아닌 여기에 설명되어야 합니다. 따라서 모든 사람은 자신의 일을 합니다.- 모델은 데이터를 저장합니다
- 뷰는 데이터를 아름답게 표현합니다.
- 컨트롤러는 데이터를 처리합니다.
사용자를 추가하기 위한 양식을 만듭니다.
add.jsp 파일에 두 개의 텍스트 입력(하나는 일반 입력, 다른 하나는 비밀번호 유형)과 데이터를 서버로 보내기 위한 버튼으로 구성된 양식을 추가해 보겠습니다. 여기서 양식에는 값이 post인 메소드 속성이 있습니다. 이는 이 양식의 데이터가 POST 요청 형식으로 서버에 전송된다는 의미입니다. action 속성이 지정되지 않았습니다. 이는 이 요청이 이 페이지로 이동했던 것과 동일한 주소(/add)로 이동함을 의미합니다. 따라서 이 주소에 바인딩된 서블릿은 GET 요청을 받으면 사용자 추가를 위한 양식과 함께 이 jsp를 반환하고, POST 요청을 받으면 이 양식은 해당 데이터를 그곳으로 보냈습니다. doPost() 메소드에서 요청 객체를 처리하고 저장을 위해 모델로 전송합니다. 여기에는 입력에 name 매개변수가 있다는 점에 주목할 가치가 있습니다(이름이 있는 필드의 경우 name 값이 있고, 비밀번호가 있는 필드의 경우 pass 값이 있음). 이것은 꽤 중요한 포인트입니다. 요청(이미 서블릿 내에 있음)에서 이 데이터(입력할 이름과 비밀번호)를 가져오기 위해 정확하게 이 이름과 패스를 사용합니다. 그러나 이에 대해서는 나중에 더 자세히 설명합니다. 데이터 전송 버튼 자체는 일반적으로 사용되는 입력이 아닌 버튼 형태로 다시 만들어집니다. 이 옵션이 얼마나 보편적인지는 모르겠지만 Chrome에서는 작동합니다. :)
서블릿을 사용하여 POST 요청을 처리합니다.
AddServlet 서블릿으로 돌아가 보겠습니다. 우리는 서블릿이 GET 요청을 "잡을" 수 있도록 HttpServlet 클래스에서 doGet() 메서드를 재정의한다는 것을 이미 알고 있습니다. 서블릿이 POST 요청도 포착하도록 가르치기 위해 doPost() 메서드도 재정의합니다. 이는 우리가 작업할 Tomcat으로부터 유사한 요청 및 응답 개체를 받습니다. 먼저, 요청에서 양식이 보낸 이름과 전달 매개변수를 추출해 보겠습니다(양식에서 다른 이름을 지정한 경우 해당 이름이 작성됩니다). 그런 다음 수신된 데이터를 사용하여 사용자 개체를 생성합니다. 그런 다음 모델 개체를 가져오고 생성된 사용자를 모델에 추가합니다.@Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { String name = req.getParameter("name"); String password = req.getParameter("pass"); User user = new User(name, password); Model model = Model.getInstance(); model.add(user); }
데이터를 뷰로 전송합니다.
이제 ListServlet 서블릿으로 넘어가겠습니다. 우리는 이미 list.jsp 뷰로 제어권을 넘기는 doGet() 메소드를 구현했습니다. 아직 이것이 없다면 AddServlet 서블릿의 동일한 메소드를 사용하여 비유적으로 수행하십시오. 이제 모델에서 사용자 이름 목록을 가져와서 뷰에 전달하면 뷰에서 해당 사용자 이름을 받아 멋지게 표시할 수 있습니다. 이를 위해 Tomcat에서 받은 요청 개체를 다시 사용합니다. 이 개체에 속성을 추가하여 이름을 지정할 수 있으며 실제로는 뷰로 전송하려는 개체 자체도 지정할 수 있습니다. 실행 프로세스를 서블릿에서 뷰로 전송할 때 서블릿 자체가 수신한 것과 동일한 요청 및 응답 객체를 거기에 전달한 다음 요청 객체에 이름 목록을 추가하여 이 요청에서 다음을 수행할 수 있기 때문입니다. 뷰의 개체에서 사용자 이름 목록을 만들고 가져옵니다. ListServlet 클래스 작업이 완료되었으므로 여기에 전체 클래스에 대한 코드가 있습니다.package app.servlets; import app.model.Model; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.util.List; public class ListServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { Model model = Model.getInstance(); List
names = model.list(); req.setAttribute("userNames", names); RequestDispatcher requestDispatcher = req.getRequestDispatcher("views/list.jsp"); requestDispatcher.forward(req, resp); } }
jsp 파일에서 Java 코드를 실행합니다.
이제 list.jsp 파일로 넘어가겠습니다. 이 파일은 ListServlet이 여기에서 실행 프로세스를 전달할 때만 실행됩니다. 또한 해당 서블릿에서는 이미 모델의 사용자 이름 목록을 준비하여 여기 요청 개체에 전달했습니다. 이름 목록이 주어지면 이를 통해 for 루프를 실행하고 각 이름을 인쇄할 수 있습니다. 이미 말했듯이 jsp 파일은 Java 코드를 실행할 수 있습니다(원칙적으로 이것이 정적 HTML 페이지와 다른 점입니다). 일부 코드를 실행하려면 필요한 위치에 구성을 배치하는 것으로 충분합니다. <% // java code %> 이러한 구성 내에서 우리는 여러 변수에 액세스할 수 있습니다: request - 서블릿에서 전달한 요청 개체(단순히 호출됨) req 응답 - 응답 객체, 서블릿은 resp out이라고 불렸습니다. JspWriter 유형의 객체(일반적인 Writer에서 상속됨)를 사용하여 html 페이지 자체에 직접 무언가를 "쓸" 수 있습니다. Out.println("Hello world!")는 System.out.println("Hello world!")와 매우 유사하지만 혼동하지 마세요! out.println()은 html 페이지에 "쓰기"하고 System.out.println은 시스템 출력에 "씁니다". jsp 코드가 포함된 섹션 내에서 System.out.println() 메서드를 호출하면 원하는 대로 페이지가 아닌 Tomcat 콘솔에 결과가 표시됩니다. :) jsp 내에서 사용 가능한 다른 개체를 찾을 수 있습니다.
여기 . 요청 객체를 사용하면 서블릿에서 전달된 이름 목록을 얻을 수 있고(해당 속성을 이 객체에 첨부함) out 객체를 사용하면 이러한 이름을 표시할 수 있습니다. 지금은 간단히 html 목록 형식으로 이 작업을 수행해 보겠습니다. 사용자가 있을 때만 목록을 표시하고 그렇지 않으면 아직 사용자가 없다는 경고를 표시하려면 이 섹션을 조금 다시 작성할 수 있습니다 . 서블릿에서 뷰로 데이터를 전송하는 방법을 알고 있습니다. 사용자 추가 성공에 대한 알림이 표시되도록 AddServlet을 약간 개선할 수 있습니다. 이를 수행하기 위해 doPost() 메소드에서 모델에 새 사용자를 추가한 후 req 객체의 속성에 이 사용자의 이름을 추가하고 add.jsp 보기에 제어를 다시 전달할 수 있습니다. 그리고 이미 Java 코드가 포함된 섹션을 만들어 해당 속성이 요청에 있는지 확인할 수 있고, 그렇다면 사용자가 성공적으로 추가되었다는 메시지를 표시합니다. 이러한 변경 후 AddServlet 서블릿의 전체 코드는 다음과 같습니다. 여기서 doPost() 메서드 끝에서 모델에 추가된 사용자 이름으로 속성을 설정한 다음 doGet( ) 메서드를 사용하여 현재 요청과 응답을 전달합니다. 그리고 doGet() 메소드는 이미 제어권을 뷰로 전송하고, 추가된 사용자의 이름이 속성으로 첨부된 요청 객체를 보냅니다. 그러한 속성이 존재하는 경우 해당 알림을 표시하도록 add.jsp 자체를 수정하는 작업이 남아 있습니다. 최종 add.jsp
<% List
names = (List
) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { for (String s : names) { out.println("
- " + s + "
"); } } %>
<% List
names = (List
) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println("
"); for (String s : names) { out.println("
" + s + " "); } out.println("
"); } else out.println("
There are no users yet!
"); %>
package app.servlets; import app.entities.User; import app.model.Model; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; public class AddServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { RequestDispatcher requestDispatcher = req.getRequestDispatcher("views/add.jsp"); requestDispatcher.forward(req, resp); } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { String name = req.getParameter("name"); String password = req.getParameter("pass"); User user = new User(name, password); Model model = Model.getInstance(); model.add(user); req.setAttribute("userName", name); doGet(req, resp); } }
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
Add new user
Super app!
<% if (request.getAttribute("userName") != null) { out.println("
User '" + request.getAttribute("userName") + "' added!
"); } %>
Add user
페이지 본문은 헤더가 있는 div, 사용자 이름이 있는 속성이 있는지 확인하는 콘텐츠용 div 컨테이너, 사용자를 추가하기 위한 양식이 있는 div, 마지막에는 다음과 같은 바닥글로 구성됩니다. 메인 페이지로 돌아가는 버튼입니다. div가 너무 많아 보일 수도 있지만 나중에 스타일을 추가할 때 사용하겠습니다 :) 음, 최종 버전은 list.jsp이므로 사용자를 저장하고 추가할 수 있는 완벽하게 작동하는 웹 애플리케이션이 있습니다. 이름 목록을 표시합니다. 남은 건 장식하는 일뿐이에요... :)
<%@ page import="java.util.List" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %>
Users
Super app!
Users
<% List
names = (List
) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println("
"); for (String s : names) { out.println("
" + s + " "); } out.println("
"); } else out.println("
There are no users yet!
"); %>
스타일을 추가합니다. 우리는 W3.CSS 프레임워크를 사용합니다.
현재 우리 애플리케이션은 작동하고 있지만 정말 미친 짓입니다. :) 배경, 텍스트 및 버튼 색상 추가, 목록 스타일 지정, 정렬, 들여쓰기 추가 등 일반적으로 많은 작업이 필요합니다. 스타일을 수동으로 작성하는 경우 많은 시간과 노력이 필요할 수 있습니다. 따라서 CSS 프레임워크 W3.CSS를 사용하는 것이 좋습니다 . 이미 스타일이 포함된 클래스가 있으므로 남은 것은 해당 위치에 적용하려는 CSS 클래스를 올바른 위치에 배치하는 것뿐입니다. 페이지에 추가하려면 먼저 스타일이 있는 파일을 포함해야 합니다. 1. 페이지를 살펴보고 헤드 섹션에 스타일이 포함된 파일에 대한 직접 링크를 삽입합니다.
이 옵션은 지속적인 인터넷 연결이 있는 경우에 적합합니다. 그런 다음 로컬 서버에서 페이지를 열면 인터넷에서 스타일을 가져옵니다. 2. 모든 스타일을 로컬에 두고 인터넷 연결에 의존하지 않으려면 스타일이 포함된 파일을
다운로드하여 웹 폴더(예: web/styles/w3.css) 내부 어딘가에 배치한 다음 모든 페이지(index.html, add.jsp, list.jsp)를 살펴보고 헤드 섹션에 스타일이 포함된 이 파일에 대한 링크를 입력한
다음, 태그를 살펴보고 원하는 스타일로 태그를 지정하세요. . 나는 이것에 대해 자세히 설명하지 않을 것이지만 준비된 스타일 클래스와 함께 세 가지 파일의 기성 버전을 즉시 제공할 것입니다. index.html add.jsp list.jsp 그게 다입니다 :) 여전히 질문이 있거나 의견이 있는 경우 또는 반대로 문제가 해결되지 않는 경우 의견을 남겨주세요. 글쎄요, 그 결과에 대한 몇 가지 스크린샷을 첨부하겠습니다. 그리고 마지막으로. 이 프로젝트를 연습하고 싶다면 다음을 시도해 보세요.
Super app!
Super app!
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
Add new user
Super app!
<% if (request.getAttribute("userName") != null) { out.println("
\n" + " \n" + "
User '" + request.getAttribute("userName") + "' added!
\n" + "
"); } %>
Add user
<%@ page import="java.util.List" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %>
Users list
Super app!
Users
<% List
names = (List
) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println("
"); for (String s : names) { out.println("
- " + s + "
"); } out.println("
"); } else out.println("
\n" + " \n" + "
There are no users yet!
\n" + "
"); %>
- 사용자를 삭제하기 위한 서블릿과 jsp를 만들고 기존 사용자를 변경/편집하기 위해 몇 가지를 더 만듭니다. 실제 CrUD 웹 애플리케이션을 얻을 수 있습니다 :) 서블릿에서))
- 목록 교체(목록
) 서버를 다시 시작한 후에도 추가된 사용자가 사라지지 않도록 데이터베이스 작업을 수행합니다 :)
GO TO FULL VERSION