Παραδείγματα προγράμματος JSP: Φόρμα εγγραφής και σύνδεσης

Σε αυτό το σεμινάριο, θα σας καθοδηγήσω στην ανάπτυξη δειγμάτων προγραμμάτων με το JSP και στην εφαρμογή της αρχιτεκτονικής MVC σε αυτό το σεμινάριο.

Θα αναπτυχθούν τα ακόλουθα παραδείγματα προγραμμάτων:

Φόρμα Εγγραφής
Φόρμα σύνδεσης και αποσύνδεσης
Έντυπο JSP

Χρήση φόρμας εγγραφής μέσω JSP

Στη φόρμα εγγραφής, θα έχουμε μια φόρμα για να συμπληρώσουμε όλα τα στοιχεία που θα περιέχει όνομα, όνομα χρήστη, κωδικό πρόσβασης, διεύθυνση, αριθμό επικοινωνίας κ.λπ.

Αυτή η φόρμα θα μας βοηθήσει να εγγραφούμε στην εφαρμογή. Παίρνουν όλα τα στοιχεία μας και τα αποθηκεύουν σε α βάσεις δεδομένων ή κρυφή μνήμη.

Σε αυτό το παράδειγμα, θα λάβουμε "Φόρμα Εγγραφής Γκουρού" που έχει τα ακόλουθα πεδία:

ΟΝΟΜΑ/ΕΠΩΝΥΜΟ
ΤΗΛΕΦΩΝΟ
Επωνυμία Φαρμακείου
Κωδικός Πρόσβασης
Διεύθυνση
Τηλέφωνο επικοινωνίας

Αφού συμπληρώσουμε όλα αυτά τα στοιχεία έχουμε το κουμπί υποβολής, με το πάτημα αυτού του κουμπιού όλα τα στοιχεία θα αποθηκευτούν.

Παράδειγμα 1: Register_1.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>Guru Registration Form</title>
</head>
<body>
<h1>Guru Register Form</h1>
<form action="guru_register" method="post">
			<table style="with: 50%">
				<tr>
					<td>First Name</td>
					<td><input type="text" name="first_name" /></td>
				</tr>
				<tr>
					<td>Last Name</td>
					<td><input type="text" name="last_name" /></td>
				</tr>
				<tr>
					<td>UserName</td>
					<td><input type="text" name="username" /></td>
				</tr>
					<tr>
					<td>Password</td>
					<td><input type="password" name="password" /></td>
				</tr>
				<tr>
					<td>Address</td>
					<td><input type="text" name="address" /></td>
				</tr>
				<tr>
					<td>Contact No</td>
					<td><input type="text" name="contact" /></td>
				</tr></table>
			<input type="submit" value="Submit" /></form>
</body>
</html>

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 11: Εδώ παίρνουμε ένα όνομα φόρμας που έχει δράση, π.χ. τον servlet στον οποίο θα γίνει η επεξεργασία του αιτήματος και το όνομα του servlet είναι guru_register.java. Το αίτημα θα διεκπεραιωθεί μέσω της μεθόδου POST.

Κωδικός Γραμμή 14-16: Εδώ παίρνουμε τον τύπο εισαγωγής ως κείμενο και το όνομα είναι το μικρό όνομα

Κωδικός Γραμμή 18-20: Εδώ λαμβάνουμε τον τύπο εισαγωγής ως κείμενο και το όνομα είναι το επίθετο

Κωδικός Γραμμή 22-24: Εδώ λαμβάνουμε τον τύπο εισαγωγής ως κείμενο και το όνομα είναι όνομα χρήστη

Κωδικός Γραμμή 26-28: Εδώ λαμβάνουμε τον τύπο εισαγωγής ως κωδικό πρόσβασης (αυτό θα αποκρύψει τον κωδικό πρόσβασης όταν πληκτρολογηθεί) και το όνομα ως κωδικό πρόσβασης

Κωδικός Γραμμή 30-32: Εδώ λαμβάνουμε τον τύπο εισαγωγής ως κείμενο και το όνομα ως διεύθυνση

Κωδικός Γραμμή 34-36: Εδώ λαμβάνουμε τον τύπο εισαγωγής ως κείμενο και το όνομα ως επαφή

Κωδικός Γραμμή 37: Εδώ παίρνουμε ένα κουμπί τύπου υποβολής και η τιμή είναι επίσης υποβολή. Με το πάτημα αυτού του κουμπιού η ενέργεια θα μεταβεί στον αντίστοιχο servlet guru_register όπου θα περάσουν όλες οι τιμές των παραμέτρων στο αίτημα.

Παράδειγμα 2: Guru_register.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 guru_register
 */
public class guru_register extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    
     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		String first_name = request.getParameter("first_name");
		String last_name = request.getParameter("last_name");
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		String address = request.getParameter("address");
		String contact = request.getParameter("contact");
		
		if(first_name.isEmpty() || last_name.isEmpty() || username.isEmpty() || 
				password.isEmpty() || address.isEmpty() || contact.isEmpty())
		{
			RequestDispatcher req = request.getRequestDispatcher("register_1.jsp");
			req.include(request, response);
		}
		else
		{
			RequestDispatcher req = request.getRequestDispatcher("register_2.jsp");
			req.forward(request, response);
		}
	}

}

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 14: Εδώ ορίζουμε το guru_servlet που επεκτείνει το HttpServlet.

Κωδικός Γραμμή 18: Αυτή η ενέργεια doPost() μέθοδος που θα καλείται όταν αναφέρουμε το χαρακτηριστικό POST σε δράση στην παραπάνω φόρμα JSP.

Κωδικός Γραμμή 20-25: Εδώ λαμβάνουμε τις τιμές από το αίτημα i.efirst_name, last_name , όνομα χρήστη, κωδικός πρόσβασης, διεύθυνση και επαφή χρησιμοποιώντας request.getParameter.

Κωδικός Γραμμή 27-32: Εδώ παίρνουμε τη συνθήκη if όπου ελέγχουμε οποιαδήποτε από τις παραμέτρους που λαμβάνονται από το αίτημα ως προς το εάν είναι κενές ή όχι. Εάν κάποια από τις παραμέτρους είναι κενή, τότε θα εισάγει αυτήν τη συνθήκη ( first_name.isEmpty() || last_name.isEmpty || username.isEmpty || password.isEmpty || address.isEmpty || contact.isEmpty()) και έχουμε για ανάκτηση αντικειμένου RequestDispatcher χρησιμοποιώντας αντικείμενο αίτημα το οποίο θα προωθήσει το αίτημα στο register_1.jsp. Εδώ συμπεριλαμβάνουμε επίσης αντικείμενα αιτήματος και απόκρισης.

Κωδικός Γραμμή 33-37: Αυτή η περίπτωση θα εκτελεστεί όταν κάποια από τις παραμέτρους δεν είναι κενή . Θα πρέπει να ανακτήσουμε το αντικείμενο requestDispatcher χρησιμοποιώντας το αντικείμενο request το οποίο θα προωθήσει το αίτημα στο register_2.jsp. Εδώ προωθούμε αντικείμενα αιτήματος και απόκρισης.

Παράδειγμα 3: Register_2.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>Guru Success Page</title>
</head>
<body>
           <a><b>Welcome User!!!!</b></a>
</body>
</html>

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 10: Εδώ λέμε καλώς ο χρήστης. Αυτό το JSP θα κληθεί όταν συμπληρωθούν όλες οι παράμετροι.

Όταν εκτελείτε τον παραπάνω κώδικα, λαμβάνετε την ακόλουθη έξοδο:

Παραγωγή:

Όταν κάνουμε κλικ στο register_1.jsp, θα λάβουμε μια φόρμα που θα έχει στοιχεία όπως όνομα, επώνυμο, όνομα χρήστη, κωδικός πρόσβασης, διεύθυνση, επαφή. Όλα τα στοιχεία έχουν συμπληρωθεί. Όταν κάνουμε κλικ στο κουμπί υποβολής, λαμβάνουμε το μήνυμα ως "Καλώς ορίσατε χρήστη"

Φόρμα σύνδεσης και αποσύνδεσης

Όπως και η φόρμα εγγραφής, θα έχουμε μια φόρμα σύνδεσης και αποσύνδεσης.

Σε αυτό το παράδειγμα, έχουμε λάβει τη φόρμα σύνδεσης όπου έχουμε δύο πεδία «όνομα χρήστη» και «κωδικός πρόσβασης» με ένα κουμπί υποβολής.

Όταν κάνουμε κλικ στο κουμπί υποβολής, λαμβάνουμε μήνυμα καλωσορίσματος με ένα κουμπί αποσύνδεσης.

Όταν κάνουμε κλικ στο κουμπί αποσύνδεσης τότε επιστρέφουμε στη φόρμα σύνδεσης.

Παράδειγμα 1: Register_3.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>Guru Login Form</title>
</head>
<body>
<form action="guru_login" method="post">
		<table style="with: 50%">

			<tr>
				<td>UserName</td>
				<td><input type="text" name="username" /></td>
			</tr>
				<tr>
				<td>Password</td>
				<td><input type="password" name="password" /></td>
			</tr>
		</table>
		<input type="submit" value="Login" /></form>
</body>
</html>

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 10: Εδώ παίρνουμε ένα όνομα φόρμας που έχει δράση, π.χ. servlet στον οποίο έχει περάσει είναι guru_login.java. Η μέθοδος μέσω της οποίας θα περάσει το POST του.

Κωδικός Γραμμή 13-16: Εδώ παίρνουμε ένα πεδίο εισαγωγής «όνομα χρήστη» που είναι του τύπου κειμένου.

Κωδικός Γραμμή 17-20: Εδώ παίρνουμε ένα πεδίο εισαγωγής "password" που είναι του τύπου password.

Κωδικός Γραμμή 22: Εδώ παίρνουμε ένα κουμπί «υποβολή» με την τιμή «Είσοδος» στο οποίο κάνουμε κλικ και στη συνέχεια πηγαίνει στο servlet guru_login όπου και τα δύο πεδία λαμβάνονται χρησιμοποιώντας το αντικείμενο αιτήματος.

Guru_login.java(servlet)

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 guru_login
 */
public class guru_login extends HttpServlet {

    public guru_login() {
        super();
        // TODO Auto-generated constructor stub
    }

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		if(username.isEmpty() || password.isEmpty() )
		{
			RequestDispatcher req = request.getRequestDispatcher("register_3.jsp");
			req.include(request, response);
		}
		else
		{
			RequestDispatcher req = request.getRequestDispatcher("register_4.jsp");
			req.forward(request, response);
		}
	}

}

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 5-9: Εδώ εισάγουμε τις απαραίτητες εισαγωγές στον κωδικό.

Κωδικός Γραμμή 14: Εδώ παίρνουμε τον servlet guru_login που επεκτείνει το HttpServlet.

Κωδικός Γραμμή 21: Εδώ χρησιμοποιούμε doPost() μέθοδο όπως στη φόρμα που χρησιμοποιούμε τη μέθοδο POST.

Κωδικός Γραμμή 23-24: Εδώ λαμβάνουμε παραμέτρους χρησιμοποιώντας το αντικείμενο αιτήματος π.χ. όνομα χρήστη και κωδικό πρόσβασης.

Κωδικός Γραμμή 25-29: Με αυτόν τον τρόπο, παίρνουμε τη συνθήκη "if" όπου ελέγχουμε το όνομα χρήστη και τον κωδικό πρόσβασης εάν είναι κενά ή όχι. Σε αυτήν την περίπτωση, εάν είναι κενό, τότε λαμβάνουμε αντικείμενο requestdispatcher το οποίο προωθείται στο register_3.jsp με αντικείμενα αιτήματος και απόκρισης.

Κωδικός Γραμμή 30-34: Αυτό θα εκτελεστεί εάν και τα δύο δεν είναι κενά, τότε προωθεί το αίτημα στο register_4.jsp με αντικείμενα αιτήματος και απόκρισης.

Παράδειγμα 2: Register_4.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>Guru Logged In</title>
</head>
<body>
	<table style="with: 50%">
	<tr><td>
	<% String username = request.getParameter("username"); %>
<a>Welcome   <% out.println(username); %> User!!!! You have logged in.</a></td></tr>
<tr></tr><tr><td></td><td></td><td><a href="register_3.jsp"><b>Logout</b></a></td></tr>
</table>
</body>
</html>

Επεξήγηση του κώδικα:

Κωδικός Γραμμή 12: Εδώ λαμβάνουμε την παράμετρο "username" από το αντικείμενο αίτησης στο όνομα χρήστη του αντικειμένου συμβολοσειράς.

Κωδικός Γραμμή 13: Εδώ έχουμε ένα μήνυμα καλωσορίσματος με το όνομα χρήστη.

Κωδικός Γραμμή 14: Εδώ κάνουμε σύνδεσμο για να αποσυνδεθείτε από τη φόρμα που ανακατευθύνει στο register_3.jsp.

Όταν εκτελείτε τον παραπάνω κώδικα, λαμβάνετε την ακόλουθη έξοδο:

Παραγωγή:

Εδώ όταν κάνουμε κλικ στο register_3.jsp παίρνουμε δύο πεδία «όνομα χρήστη» και «κωδικός πρόσβασης» με ένα κουμπί σύνδεσης.

Αφού κάνετε κλικ στο κουμπί Είσοδος, λαμβάνετε το παρακάτω μήνυμα με ένα κουμπί Αποσύνδεσης.

Όταν κάνετε κλικ στο κουμπί αποσύνδεσης επιστρέφετε στη σελίδα σύνδεσης

Επεξεργασία φόρμας JSP με χρήση getParameter()

Επεξεργασία εντύπων JSP:

Οι φόρμες είναι η κοινή μέθοδος στην επεξεργασία ιστού. Πρέπει να στείλουμε πληροφορίες στον διακομιστή ιστού και αυτές τις πληροφορίες.

Υπάρχουν δύο κοινά χρησιμοποιούμενες μέθοδοι για την αποστολή και ανάκτηση πληροφοριών στον διακομιστή web.

Μέθοδος GET:

Αυτή είναι η προεπιλεγμένη μέθοδος για τη μετάδοση πληροφοριών από το πρόγραμμα περιήγησης στον διακομιστή ιστού.
Στέλνει τις κωδικοποιημένες πληροφορίες διαχωρισμένες με ?χαρακτήρα που προσαρτάται στη σελίδα URL.
Έχει επίσης περιορισμό μεγέθους και μπορούμε να στείλουμε μόνο 1024 χαρακτήρες στο αίτημα.
Θα πρέπει να αποφεύγουμε την αποστολή κωδικού πρόσβασης και ευαίσθητων πληροφοριών μέσω της μεθόδου GET.

Μέθοδος POST:

Η μέθοδος ανάρτησης είναι η πιο αξιόπιστη μέθοδος αποστολής πληροφοριών στον διακομιστή.
Στέλνει πληροφορίες ως ξεχωριστό μήνυμα.
Στέλνει ως συμβολοσειρά κειμένου μετά το ?στο URL.
Χρησιμοποιείται συνήθως για την αποστολή πληροφοριών που είναι ευαίσθητες.

Το JSP χειρίζεται την επεξεργασία δεδομένων φόρμας χρησιμοποιώντας τις ακόλουθες μεθόδους:

getParameter(): Χρησιμοποιείται για να λάβουμε την τιμή της παραμέτρου φόρμας.
getParameterValues(): Χρησιμοποιείται για την επιστροφή των πολλαπλών τιμών των παραμέτρων.
getParameterNames(): Χρησιμοποιείται για τη λήψη των ονομάτων των παραμέτρων.
getInputStream(): Χρησιμοποιείται για την ανάγνωση των δυαδικών δεδομένων που αποστέλλονται από τον πελάτη.

Παράδειγμα:

Σε αυτό το παράδειγμα, έχουμε πάρει μια φόρμα με δύο πεδία "username" και "password" με ένα κουμπί υποβολής

Action_form.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>Guru Form</title>
</head>
<body>
<form action="action_form_process.jsp" method="GET">
UserName: <input type="text" name="username">
<br />
Password: <input type="text" name="password" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Action_form_process.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>Insert title here</title>
</head>
<body>

<h1>Form Processing</h1>

<p><b>Welcome User:</b>
   <%= request.getParameter("username")%>
</p>

</body>
</html>

Επεξήγηση του κώδικα: Action_form.jsp

Κωδικός Γραμμή 10: Εδώ έχουμε ορίσει μια φόρμα και μέσω της οποίας έχουμε επεξεργαστεί τη δράση σε κάποια άλλη JSP. Στην παράμετρο δράσης, προσθέτουμε το JSP στο οποίο πρέπει να υποβληθεί σε επεξεργασία μέσω της μεθόδου GET.

Εδώ χρησιμοποιούμε τη μέθοδο GET για να μεταβιβάσουμε τις πληροφορίες π.χ. όνομα χρήστη και κωδικό πρόσβασης.

Κωδικός Γραμμή 11-14: Εδώ παίρνουμε πεδία όπως το όνομα χρήστη και τον κωδικό πρόσβασης που είναι πεδία κειμένου και λαμβάνουμε τα δεδομένα από τον χρήστη.

Αυτή η είσοδος μπορεί να ληφθεί χρησιμοποιώντας τη μέθοδο getParameter. Επίσης, έχουμε κουμπί υποβολής με τύπο υποβολής που μας βοηθά να μεταφέρουμε τις τιμές των πεδίων στο action_form_process.jsp

Action_form_process.jsp

Κωδικός Γραμμή 14: Εδώ παίρνουμε τις τιμές των πεδίων εισαγωγής από το action_form.jsp χρησιμοποιώντας τη μέθοδο getParameter του αντικειμένου αιτήματος.

Όταν εκτελούμε τον παραπάνω κώδικα, έχουμε την ακόλουθη έξοδο:

Παραγωγή:

Όταν εκτελούμε το action_form.jsp, λαμβάνουμε μια φόρμα με δύο πεδία όνομα χρήστη και κωδικό πρόσβασης και ένα κουμπί υποβολής. Στη συνέχεια, αφού πληκτρολογήσουμε το όνομα χρήστη και τον κωδικό πρόσβασης, μπορούμε να κάνουμε κλικ στην υποβολή και μεταβαίνει στην επόμενη σελίδα που δίνει έξοδο ως σελίδα επεξεργασίας φόρμας με ένα μήνυμα καλωσορίσματος.

Χρήση φόρμας εγγραφής μέσω JSP

ΣΧΕΤΙΚΑ ΑΡΘΡΑ

Φόρμα σύνδεσης και αποσύνδεσης

Επεξεργασία φόρμας JSP με χρήση getParameter()

Επεξεργασία εντύπων JSP:

Μέθοδος GET:

Μέθοδος POST:

Εγγραφείτε στο ενημερωτικό δελτίο