JavaRush /จาวาบล็อก /Random-TH /การสร้างเว็บแอปพลิเคชันอย่างง่ายโดยใช้ servlets และ jsp (...
fatfaggy
ระดับ
Киев

การสร้างเว็บแอปพลิเคชันอย่างง่ายโดยใช้ servlets และ jsp (ตอนที่ 2)

เผยแพร่ในกลุ่ม
ฉันยังคงอธิบายกระบวนการสร้างเว็บแอปพลิเคชันโดยใช้ servlets, jsp, Maven และ Tomcat ต่อไป จุดเริ่มต้นของบทความหากจำเป็น
เราสร้างเอนทิตี
มาสร้างคลาส User ในแพ็คเกจเอนทิตีซึ่งเราจะสร้างชื่อและรหัสผ่านตัวแปรสตริงส่วนตัวสองตัว มาสร้างคอนสตรัคเตอร์ (ค่าเริ่มต้นและอันที่จะยอมรับทั้งสองค่า) getters/setters แทนที่เมธอด toString() ในกรณี เช่นเดียวกับเมธอดเท่ากับ () และ 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 จะแตกต่างไปจากเดิมอย่างสิ้นเชิง ปรากฎว่าเราต้องการวัตถุที่จะเหมือนกันกับเซิร์ฟเล็ตทั้งสอง โดยทั่วไปแล้ว เราต้องการอ็อบเจ็กต์ที่จะเหมือนกันกับทุกคลาสในโปรแกรมของเรา วัตถุเดียวสำหรับทั้งโปรแกรม ฉันหวังว่าคุณจะเคยได้ยินบางอย่างเกี่ยวกับรูปแบบการออกแบบ และบางทีสำหรับบางคน นี่อาจเป็นความต้องการที่แท้จริงประการแรกในการใช้ เทมเพลต Singletonในโปรแกรมของพวกเขา คุณสามารถสร้างสรรค์และสร้างซิงเกิลตันเจ๋งๆ ได้ด้วยการตรวจสอบซ้ำและการซิงโครไนซ์ (ใช่ เรามีแอปพลิเคชันแบบมัลติเธรด เนื่องจาก 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 (model-view-controller หรือในภาษารัสเซีย model-view-controller หรือเหมือนกับในภาษาอังกฤษ model-view-controller) สิ่งสำคัญคือต้องแยกตรรกะทางธุรกิจออกจากการนำเสนอ นั่นคือ แยกโค้ดที่กำหนดว่า ต้องทำอย่างไรออกจากโค้ดที่กำหนด วิธีแสดง มุมมอง (มุมมองหรือเพียงมุมมอง) มีหน้าที่รับผิดชอบในรูปแบบที่นำเสนอข้อมูลบางส่วน ในกรณีของเรา การดูคือหน้า JSP ของเรา นั่นเป็นเหตุผลที่ฉันใส่มันไว้ในโฟลเดอร์ชื่อมุมมอง แบบจำลองคือข้อมูลจริงที่โปรแกรมทำงาน ในกรณีของเรา นี่คือผู้ใช้ (รายชื่อผู้ใช้) คอนโทรลเลอร์คือตัวเชื่อมระหว่างพวกมัน พวกเขานำข้อมูลจากโมเดลและถ่ายโอนไปยังมุมมอง หรือรับข้อมูลบางส่วนจาก Tomcat ประมวลผลและถ่ายโอนไปยังโมเดล ตรรกะทางธุรกิจ (นั่นคือ สิ่งที่ต้องทำ ) ควรอธิบายไว้ในนั้น ไม่ใช่ในแบบจำลองหรือในมุมมอง ดังนั้นทุกคนจึงทำหน้าที่ของตัวเอง:
  • โมเดลเก็บข้อมูล
  • มุมมองดึงการนำเสนอข้อมูลที่สวยงาม
  • ผู้ควบคุมประมวลผลข้อมูล
สิ่งนี้ทำให้พวกมันทั้งหมดค่อนข้างเรียบง่ายและบำรุงรักษาได้ และไม่ใช่การดัมพ์โค้ดทั้งหมดอันมหึมาในคลาสเดียว MVC ไม่เพียงแต่เหมาะสำหรับการเขียนโปรแกรมเว็บเท่านั้น แต่ยังพบได้บ่อยมาก (หากไม่เสมอไป) ในพื้นที่นี้ ในกรณีของเรา เซิร์ฟเล็ตจะทำหน้าที่เป็นตัวควบคุม ใช่ นี่เป็นคำอธิบายแบบผิวเผินและคร่าวๆ ของรูปแบบนี้ แต่บทความนี้ไม่เกี่ยวกับรูปแบบการออกแบบ แต่เกี่ยวกับวิธีสร้างเว็บแอปพลิเคชันแบบง่าย :) ใครต้องการทราบข้อมูลเพิ่มเติม - Google รู้ทุกอย่าง ! :) กลับมาที่มุมมองของเรากันดีกว่า
สร้างแบบฟอร์มสำหรับเพิ่มผู้ใช้
มาเพิ่มแบบฟอร์มลงในไฟล์ add.jsp ซึ่งประกอบด้วยอินพุตข้อความสองช่อง (ช่องหนึ่งปกติ และอีกช่องหนึ่งเป็นประเภทรหัสผ่าน) และปุ่มสำหรับส่งข้อมูลไปยังเซิร์ฟเวอร์ ที่นี่แบบฟอร์มมีแอตทริบิวต์วิธีการที่มีการโพสต์ค่า ซึ่งหมายความว่าข้อมูลจากแบบฟอร์มนี้จะถูกส่งไปยังเซิร์ฟเวอร์ในรูปแบบของคำขอ POST ไม่ได้ระบุแอตทริบิวต์การดำเนินการ ซึ่งหมายความว่าคำขอนี้จะไปยังที่อยู่เดียวกับที่เราไปที่หน้านี้ (/เพิ่ม) ดังนั้น เซิร์ฟเล็ตของเราซึ่งผูกไว้กับที่อยู่นี้ เมื่อได้รับคำขอ GET จะส่งคืน jsp นี้พร้อมกับแบบฟอร์มสำหรับการเพิ่มผู้ใช้ และหากได้รับการร้องขอ POST แบบฟอร์มนี้จะส่งข้อมูลไปที่นั่น (ซึ่งเราจะดึงมาจาก วัตถุคำขอในเมธอด doPost() ประมวลผลและถ่ายโอนไปยังโมเดลเพื่อบันทึก) เป็นที่น่าสังเกตว่าอินพุตมีพารามิเตอร์ชื่ออยู่ที่นี่ (สำหรับฟิลด์ที่มีชื่อจะมีชื่อค่า และสำหรับฟิลด์ที่มีรหัสผ่านจะมีการส่งผ่านค่า) นี่เป็นจุดสำคัญทีเดียว เนื่องจากเพื่อรับข้อมูลนี้ (ชื่อและรหัสผ่านที่จะป้อน) จากคำขอ (อยู่ในเซิร์ฟเล็ตแล้ว) เราจะใช้ชื่อและรหัสผ่านเหล่านี้ทุกประการ แต่จะเพิ่มเติมในภายหลัง ปุ่มสำหรับการส่งข้อมูลนั้นถูกสร้างขึ้นอีกครั้งในรูปแบบของปุ่มและไม่ใช่อินพุตตามปกติ ฉันไม่รู้ว่าตัวเลือกนี้เป็นสากลแค่ไหน แต่ใช้ได้กับฉันใน Chrome :)
กำลังประมวลผลคำขอ POST ด้วยเซิร์ฟเล็ต
กลับไปที่เซิร์ฟเล็ต AddServlet กัน เรารู้อยู่แล้วว่าเพื่อให้เซิร์ฟเล็ตของเราสามารถ "จับ" คำขอ GET ได้ เราได้แทนที่เมธอด doGet() จากคลาส HttpServlet เพื่อสอนเซิร์ฟเล็ตของเราให้จับคำขอ 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 กันดีกว่า เราได้นำเมธอด doGet() มาใช้แล้ว ซึ่งเพียงแค่ถ่ายโอนการควบคุมไปยังมุมมอง list.jsp หากคุณยังไม่มี ให้ทำโดยการเปรียบเทียบกับวิธีการเดียวกันจากเซิร์ฟเล็ต 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); } }
การรันโค้ด Java ในไฟล์ JSP
ตอนนี้เรามาดูไฟล์ list.jsp กันดีกว่า ไฟล์นี้จะถูกดำเนินการเมื่อ ListServlet ผ่านกระบวนการดำเนินการที่นี่เท่านั้น นอกจากนี้ ในเซิร์ฟเล็ตนั้น เราได้เตรียมรายชื่อผู้ใช้จากโมเดลแล้วส่งต่อไปที่นี่ในออบเจ็กต์คำขอ เมื่อพิจารณารายชื่อแล้ว เราสามารถเรียกใช้ for loop ผ่านมันและพิมพ์ชื่อแต่ละชื่อได้ ดังที่ฉันได้กล่าวไปแล้ว ไฟล์ jsp สามารถรันโค้ด Java ได้ (โดยหลักการแล้ว นี่คือสิ่งที่ทำให้พวกเขาแตกต่างจากหน้า html แบบคงที่) เพื่อรันโค้ดบางส่วน ก็เพียงพอแล้วที่จะวางโครงสร้างในตำแหน่งที่เราต้องการ <% // java code %> ภายในโครงสร้างดังกล่าว เราสามารถเข้าถึงตัวแปรต่างๆ ได้: request - ออบเจ็กต์คำขอของเรา ซึ่งเราส่งผ่านจากเซิร์ฟเล็ต ซึ่งมันถูกเรียกง่ายๆ req response - ออบเจ็กต์การตอบกลับใน servlet ถูกเรียกว่า resp out - ออบเจ็กต์ประเภท JspWriter (สืบทอดมาจาก Writer ปกติ) ด้วยความช่วยเหลือซึ่งเราสามารถ "เขียน" บางสิ่งลงในหน้า html ได้โดยตรง Out.println("Hello world!") คล้ายกับ System.out.println("Hello world!") มาก แต่อย่าสับสน! out.println() "เขียน" ไปยังหน้า html และ System.out.println - ไปยังเอาต์พุตของระบบ หากคุณเรียกใช้เมธอด System.out.println() ภายในส่วนด้วยโค้ด jsp คุณจะเห็นผลลัพธ์ในคอนโซล Tomcat ไม่ใช่บนเพจ ตามที่คุณต้องการ :) คุณสามารถค้นหาอ็อบเจ็กต์อื่นๆ ที่มีอยู่ภายใน jsp ที่นี่ . การใช้วัตถุคำขอเราจะได้รับรายชื่อที่ส่งผ่านจากเซิร์ฟเล็ต (เราแนบแอตทริบิวต์ที่เกี่ยวข้องกับวัตถุนี้) และการใช้วัตถุออกเราสามารถแสดงชื่อเหล่านี้ได้ เรามาทำสิ่งนี้กันก่อนในรูปแบบของรายการ 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 จริง :) บนเซิร์ฟเล็ต))
    • แทนที่รายการ (List ) เพื่อทำงานกับฐานข้อมูลเพื่อให้ผู้ใช้ที่เพิ่มเข้ามาไม่หายไปหลังจากรีสตาร์ทเซิร์ฟเวอร์ :)
    ขอให้โชคดี!
    ความคิดเห็น
    TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
    GO TO FULL VERSION