Příklady programu JSP: Registrační a přihlašovací formulář

V tomto tutoriálu vás provedu vývojemping ukázkové programy s JSP a implementace architektury MVC v tomto tutoriálu.
Budou vyvinuty následující příklady programů:
- Registrační formulář
- Přihlašovací a odhlašovací formulář
- Formulář JSP
Pomocí registračního formuláře přes JSP
V Registračním formuláři budeme mít formulář pro vyplnění všech údajů, které budou obsahovat jméno, uživatelské jméno, heslo, adresu, kontaktní číslo atd.
Tento formulář nám pomůže zaregistrovat se do aplikace. Vezmou všechny naše detaily a uloží je do a databáze nebo cache.
V tomto příkladu vezmeme „Guru Registrační formulář“, který má následující pole:
- Jméno
- Příjmení
- Uživatelské jméno
- Heslo
- Adresa
- Kontaktujte číslo
Po vyplnění všech těchto údajů máme tlačítko odeslat, kliknutím na toto tlačítko se všechny údaje uloží.
Příklad 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>
Vysvětlení kódu:
Code Řádek 11: Zde bereme název formuláře, který má akci, tj. servlet, na který bude požadavek zpracován, a název servletu je guru_register.java. Požadavek bude zpracován metodou POST.
Code Řádek 14–16: Zde bereme typ vstupu jako text a jméno je křestní jméno
Code Řádek 18–20: Zde bereme typ vstupu jako text a jméno je příjmení
Code Řádek 22–24: Zde bereme typ vstupu jako text a jméno je uživatelské jméno
Code Řádek 26–28: Zde bereme typ vstupu jako heslo (toto heslo skryje při psaní) a jméno jako heslo
Code Řádek 30–32: Zde bereme typ vstupu jako text a jméno jako adresu
Code Řádek 34–36: Zde bereme typ vstupu jako text a jméno jako kontakt
Code Řádek 37: Zde bereme tlačítko typu odeslat a hodnota je také odeslat. Po kliknutí na toto tlačítko akce přejde na odpovídající servlet guru_register, kde budou v požadavku předány všechny hodnoty parametrů.
Příklad 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);
}
}
}
Vysvětlení kódu:
Code Řádek 14: Zde definujeme guru_servlet, který rozšiřuje HttpServlet.
Code Řádek 18: Tato akce doPost() metoda, která bude volána, když ve výše uvedeném formuláři JSP zmíníme atribut POST in action.
Code Řádek 20–25: Zde načítáme hodnoty z požadavku i.efirst_name, last_name , username, password, address a contact pomocí request.getParameter.
Code Řádek 27–32: Zde bereme podmínku if, kdy kontrolujeme některý z parametrů, které jsou načteny z požadavku, zda jsou prázdné nebo ne. Pokud je některý z parametrů prázdný, zadá tuto podmínku ( first_name.isEmpty() || last_name.isEmpty || username.isEmpty || password.isEmpty || address.isEmpty || contact.isEmpty()) a máme k načtení objektu RequestDispatcher pomocí objektu požadavku, který předá požadavek na register_1.jsp. Zde také zahrnujeme objekty požadavků a odpovědí.
Code Řádek 33–37: Tento případ se spustí, když některý z parametrů není prázdný. Budeme muset načíst objekt requestDispatcher pomocí objektu požadavku, který předá požadavek na register_2.jsp. Zde předáváme objekty požadavku a odpovědi.
Příklad 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>
Vysvětlení kódu:
Code Řádek 10: Zde říkáme vítaný uživatel. Tento JSP bude volán, když jsou vyplněny všechny parametry.
Když spustíte výše uvedený kód, získáte následující výstup:
Výstup:
Když klikneme na register_1.jsp, dostaneme formulář, který bude obsahovat podrobnosti jako jméno, příjmení, uživatelské jméno, heslo, adresa, kontakt. Všechny podrobnosti byly vyplněny. Když klikneme na tlačítko Odeslat, zobrazí se zpráva „Vítaný uživatel“
Přihlašovací a odhlašovací formulář
Stejně jako registrační formulář budeme mít přihlašovací a odhlašovací formulář.
V tomto příkladu jsme použili přihlašovací formulář, kde máme dvě pole „uživatelské jméno“ a „heslo“ s tlačítkem Odeslat.
Když klikneme na tlačítko Odeslat, zobrazí se uvítací zpráva s tlačítkem pro odhlášení.
Když klikneme na tlačítko odhlásit, vrátíme se zpět do přihlašovacího formuláře.
Příklad 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>
Vysvětlení kódu:
Code Řádek 10: Zde bereme název formuláře, který má akci, tj. servlet, kterému byl předán, je guru_login.java. Metoda, kterou projde svůj POST.
Code Řádek 13–16: Zde bereme vstupní pole „username“, které je typu text.
Code Řádek 17–20: Zde bereme vstupní pole „heslo“, které je typu heslo.
Code Řádek 22: Zde vezmeme tlačítko „odeslat“ s hodnotou „Přihlášení“, na které klikneme a poté přejde na servlet guru_login, kde jsou obě pole převzata pomocí objektu požadavku.
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);
}
}
}
Vysvětlení kódu:
Code Řádek 5–9: Zde importujeme potřebné importy v kódu.
Code Řádek 14: Zde bereme servlet guru_login, který rozšiřuje HttpServlet.
Code Řádek 21: Zde používáme doPost() jako ve formuláři, který používáme metodu POST.
Code Řádek 23–24: Zde bereme parametry pomocí objektu požadavku, tj. uživatelské jméno a heslo.
Code Řádek 25–29: Tímto způsobem přebíráme podmínku „if“, kdy kontrolujeme uživatelské jméno a heslo, zda jsou prázdné nebo ne. V tomto případě, pokud je prázdné, dostáváme objekt requestdispatcher, který přesměruje na register_3.jsp s objekty request a response.
Code Řádek 30–34: To se provede, pokud oba nejsou prázdné, pak předá požadavek na register_4.jsp s objekty request a response.
Příklad 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>
Vysvětlení kódu:
Code Řádek 12: Zde získáváme parametr „username“ z objektu požadavku v řetězci objektu username.
Code Řádek 13: Zde máme uvítací zprávu s uživatelským jménem.
Code Řádek 14: Zde uvádíme odkaz na odhlášení z formuláře, který přesměrovává na register_3.jsp.
Když spustíte výše uvedený kód, získáte následující výstup:
Výstup:
Zde, když klikneme na register_3.jsp, dostaneme dvě pole „uživatelské jméno“ a „heslo“ s tlačítkem přihlášení.
Po kliknutí na tlačítko Přihlásit se zobrazí níže uvedená zpráva s tlačítkem Odhlásit.
Po kliknutí na tlačítko odhlásit se vrátíte zpět na přihlašovací stránku
Zpracování formuláře JSP pomocí getParameter()
Zpracování formuláře JSP:
Formuláře jsou běžnou metodou při zpracování webu. Potřebujeme odeslat informace na webový server a tyto informace.
Existují dva běžně používané způsoby odesílání a získávání informací na webový server.
GET metoda:
- Toto je výchozí způsob předávání informací z prohlížeče na webový server.
- Odešle zakódované informace oddělené znakem ? připojeným k URL stránce.
- Má také omezení velikosti a v požadavku můžeme odeslat pouze 1024 znaků.
- Měli bychom se vyhnout odesílání hesel a citlivých informací metodou GET.
Metoda POST:
- Post metoda je nejspolehlivější metodou odesílání informací na server.
- Odesílá informace jako samostatnou zprávu.
- Odesílá se jako textový řetězec za ?v URL.
- Běžně se používá k odesílání citlivých informací.
JSP zpracovává zpracování dat formuláře pomocí následujících metod:
getParameter(): Používá se k získání hodnoty parametru formuláře.getParameterValues(): Používá se k vrácení více hodnot parametrů.getParameterNames(): Používá se k získání názvů parametrů.getInputStream(): Používá se ke čtení binárních dat odeslaných klientem.
Příklad:
V tomto příkladu jsme vzali formulář se dvěma poli „uživatelské jméno“ a „heslo“ s tlačítkem Odeslat
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>
Vysvětlení kódu: Action_form.jsp
Code Řádek 10: Zde jsme definovali formulář a přes který jsme akci zpracovali na nějakou jinou JSP. V parametru akce přidáme to JSP, do kterého se má zpracovat metodou GET.
Zde používáme metodu GET k předání informací, tj. uživatelského jména a hesla.
Code Řádek 11–14: Zde bereme pole jako uživatelské jméno a heslo, což jsou textová pole, a dostáváme vstup od uživatele.
Tento vstup lze načíst pomocí metody getParameter. Také máme tlačítko Odeslat s typem Odeslat, které nám pomáhá předávat hodnoty pole do action_form_process.jsp
Action_form_process.jsp
Code Řádek 14: Zde získáme hodnoty vstupních polí z action_form.jsp pomocí metody getParameter objektu požadavku.
Když spustíme výše uvedený kód, dostaneme následující výstup:
Výstup:
Když spustíme action_form.jsp, dostaneme formulář se dvěma poli uživatelské jméno a heslo a tlačítko Odeslat. Poté po zadání uživatelského jména a hesla můžeme kliknout na odeslat a proces se zpracuje na další stránku, která poskytne výstup jako stránku zpracování formuláře s uvítací zpráva.







