MVC ใน JSP (Archiเทคเจอร์)
MVC คืออะไร?
MVC เป็นสถาปัตยกรรมที่แยกตรรกะทางธุรกิจ การนำเสนอ และข้อมูลออกจากกัน ใน MVC
- M ย่อมาจาก Model
- วี ย่อมาจาก วิว
- C ย่อมาจากตัวควบคุม
MVC เป็นวิธีที่เป็นระบบในการใช้แอปพลิเคชันโดยที่โฟลว์เริ่มต้นจากเลเยอร์มุมมอง โดยที่คำขอจะถูกยกขึ้นและประมวลผลในเลเยอร์คอนโทรลเลอร์ และส่งไปยังเลเยอร์โมเดลเพื่อแทรกข้อมูลและรับข้อความแสดงความสำเร็จหรือความล้มเหลวกลับคืนมา เอ็มวีซี Archiแผนภาพเทคเจอร์แสดงไว้ด้านล่าง:

เลเยอร์โมเดล
- นี่คือชั้นข้อมูลที่ประกอบด้วยตรรกะทางธุรกิจของระบบ
- ประกอบด้วยข้อมูลทั้งหมดของแอปพลิเคชัน
- นอกจากนี้ยังแสดงถึงสถานะของแอปพลิเคชันด้วย
- ประกอบด้วยชั้นเรียนที่มีความเชื่อมโยงกับ ฐานข้อมูล.
- คอนโทรลเลอร์เชื่อมต่อกับโมเดลและดึงข้อมูลและส่งไปยังเลเยอร์มุมมอง
- โมเดลเชื่อมต่อกับฐานข้อมูลด้วยและจัดเก็บข้อมูลลงในฐานข้อมูลที่เชื่อมต่อกับฐานข้อมูล
ดูเลเยอร์
- นี่คือเลเยอร์การนำเสนอ
- ประกอบด้วย HTML, JSP ฯลฯ ลงไป
- โดยปกติจะแสดง UI ของแอปพลิเคชัน
- มันถูกใช้เพื่อแสดงข้อมูลที่ดึงมาจากคอนโทรลเลอร์ซึ่งจะดึงข้อมูลจากคลาสเลเยอร์โมเดล
- เลเยอร์มุมมองนี้แสดงข้อมูลบน UI ของแอปพลิเคชัน
เลเยอร์คอนโทรลเลอร์
- มันทำหน้าที่เป็นส่วนต่อประสานระหว่าง View และ Model
- มันสกัดกั้นคำขอทั้งหมดที่มาจากเลเยอร์มุมมอง
- ได้รับการร้องขอจากเลเยอร์มุมมองและประมวลผลคำขอและทำการตรวจสอบที่จำเป็นสำหรับคำขอ
- คำขอดังกล่าวจะถูกส่งไปยังเลเยอร์โมเดลเพื่อประมวลผลข้อมูล และเมื่อประมวลผลคำขอแล้ว คำขอดังกล่าวจะถูกส่งกลับไปยังตัวควบคุมพร้อมข้อมูลที่ต้องการ และแสดงตามนั้นในมุมมอง
ข้อดีของ MVC Archiเทคเจอร์
ข้อดีของ MVC คือ:
- ง่ายต่อการรักษา
- ง่ายต่อการขยาย
- ทดสอบง่าย
- การควบคุมการนำทางเป็นแบบรวมศูนย์
ตัวอย่างการออกแบบแอปพลิเคชัน JSP ด้วย MVC Archiเทคเจอร์
ในตัวอย่างนี้ เราจะแสดงวิธีการใช้สถาปัตยกรรม MVC ใน JSP
- เรากำลังใช้ตัวอย่างแบบฟอร์มที่มีตัวแปรสองตัวคือ “อีเมล” และ “รหัสผ่าน” ซึ่งเป็นเลเยอร์มุมมองของเรา
- เมื่อผู้ใช้ป้อนอีเมลและรหัสผ่านแล้วคลิกส่ง การดำเนินการจะถูกส่งต่อใน mvc_servlet ซึ่งอีเมลและรหัสผ่านจะถูกส่งต่อไป
- mvc_servlet นี้เป็นเลเยอร์คอนโทรลเลอร์ ที่นี่ใน mvc_servlet คำขอจะถูกส่งไปยังวัตถุ bean ซึ่งทำหน้าที่เป็นเลเยอร์โมเดล
- ค่าอีเมลและรหัสผ่านจะถูกตั้งค่าไว้ในบีนและจัดเก็บไว้สำหรับวัตถุประสงค์ต่อไป
- จาก bean ค่าจะถูกดึงออกมาและแสดงในเลเยอร์มุมมอง
Mvc_example.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>MVC Guru Example</title> </head> <body> <form action="Mvc_servlet" method="POST"> Email: <input type="text" name="email"> <br /> Password: <input type="text" name="password" /> <input type="submit" value="Submit" /> </form> </body> </html>
คำอธิบายของรหัส:
ดูเลเยอร์:
รหัสบรรทัด 10-15: เรากำลังใช้แบบฟอร์มที่มีฟิลด์สองฟิลด์เป็นพารามิเตอร์ “อีเมล” และ “รหัสผ่าน” และคำขอนี้ต้องส่งต่อไปยังตัวควบคุม Mvc_servlet.java ซึ่งจะถูกส่งต่อไปในแอ็คชัน วิธีที่จะส่งผ่านคือวิธี POST
Mvc_servlet.java
package demotest; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * Servlet implementation class Mvc_servlet */ public class Mvc_servlet extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#HttpServlet() */ public Mvc_servlet() { super(); // TODO Auto-generated constructor stub } protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub String email=request.getParameter("email"); String password=request.getParameter("password"); TestBean testobj = new TestBean(); testobj.setEmail(email); testobj.setPassword(password); request.setAttribute("gurubean",testobj); RequestDispatcher rd=request.getRequestDispatcher("mvc_success.jsp"); rd.forward(request, response); } }
คำอธิบายของรหัส:
ชั้นตัวควบคุม
รหัสบรรทัด 14:mvc_servlet กำลังขยาย HttpServlet
รหัสบรรทัด 26: เนื่องจากวิธีการที่ใช้คือ POST ดังนั้นคำขอจึงเข้าสู่วิธี doPost ของเซิร์ฟเล็ตซึ่งประมวลผลคำขอและบันทึกลงในวัตถุ bean เป็น testobj
รหัสบรรทัด 34: การใช้วัตถุคำขอเรากำลังตั้งค่าแอตทริบิวต์เป็น gurubean ซึ่งกำหนดค่าของ testobj
รหัสบรรทัด 35: ที่นี่เราใช้ออบเจ็กต์การร้องขอโปรแกรมเลือกจ่ายงานเพื่อส่งข้อความแสดงความสำเร็จไปยัง mvc_success.jsp
TestBean.java
package demotest; import java.io.Serializable; public class TestBean implements Serializable{ public String getEmail() { return email; } public void setEmail(String email) { this.email = email; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } private String email="null"; private String password="null"; }
คำอธิบายของรหัส:
เลเยอร์โมเดล:
รหัสบรรทัด 7-17: ประกอบด้วยตัวรับและตัวตั้งค่าอีเมลและรหัสผ่านซึ่งเป็นสมาชิกของคลาส Test Bean
รหัสบรรทัด 19-20: กำหนดอีเมลและรหัสผ่านของสมาชิกประเภทสตริงในคลาสบีน
Mvc_success.jsp
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> <%@page import="demotest.TestBean"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Guru Success</title> </head> <body> <% TestBean testguru=(TestBean)request.getAttribute("gurubean"); out.print("Welcome, "+testguru.getEmail()); %> </body> </html>
คำอธิบายของรหัส:
รหัสบรรทัด 12: เราได้รับแอตทริบิวต์โดยใช้วัตถุคำขอซึ่งได้รับการตั้งค่าในวิธี doPost ของเซิร์ฟเล็ต
รหัสบรรทัด 13: เรากำลังพิมพ์ข้อความต้อนรับและรหัสอีเมลที่ได้รับการบันทึกไว้ในวัตถุบีน
Output:
เมื่อคุณรันโค้ดข้างต้น คุณจะได้ผลลัพธ์ต่อไปนี้:
เมื่อคุณคลิกที่ mvc_example.jsp คุณจะได้รับแบบฟอร์มพร้อมอีเมลและรหัสผ่านพร้อมปุ่มส่ง
เมื่อคุณป้อนอีเมลและรหัสผ่านลงในแบบฟอร์มแล้วคลิกส่ง
หลังจากคลิกส่งผลลัพธ์จะแสดงดังภาพด้านล่าง
Output:
เมื่อคุณป้อนอีเมลและรหัสผ่านในหน้าจอและคลิกส่ง รายละเอียดต่างๆ จะถูกบันทึกลงใน TestBean และจาก TestBean จะถูกดึงออกมาในหน้าจอถัดไปเพื่อรับข้อความแจ้งความสำเร็จ
สรุป
ในบทความนี้ เราได้เรียนรู้เกี่ยวกับสถาปัตยกรรม MVC เช่น Model View Controller
JSP มีบทบาทในการนำเสนอข้อมูลและผู้ควบคุม มันเป็นอินเทอร์เฟซระหว่างโมเดลและมุมมองในขณะที่โมเดลเชื่อมต่อทั้งกับคอนโทรลเลอร์และฐานข้อมูล ตรรกะทางธุรกิจหลักมีอยู่ในเลเยอร์โมเดล