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

⚡ Chytré shrnutí

Zde uvedené příklady programů JSP vytvářejí tři moduly – registrační formulář, formulář pro přihlášení a odhlášení a stránku pro zpracování formulářů – z nichž každý propojuje pohled JSP s kontrolerem servletu, takže rozdělení MVC zůstává viditelné i pro začátečníky.

  • 🔘 Postup registrace: Soubor Register_1.jsp shromažďuje šest polí a odesílá je do servletu guru_register, který přeposílá na stránku s hlášením o úspěchu pouze v případě, že jsou všechna pole vyplněna.
  • ☑️ Přihlášení a odhlášení: Register_3.jsp odešle přihlašovací údaje na guru_login; Register_4.jsp uživatele pozdraví a odkáže zpět na přihlašovací stránku pro odhlášení.
  • (Tj. Role MVC: JSP stránky fungují jako zobrazení, servlet jako kontroler a RequestDispatcher přesouvá požadavky mezi nimi.
  • 🧪 Zpracování formulářů: Funkce getParameter(), getParameterValues(), getParameterNames() a getInputStream() čtou odeslaná data uvnitř JSP nebo servletu.
  • 🛠️ GET versus POST: GET připojuje kódované hodnoty k URL a má omezenou délku; POST přenáší hodnoty v těle požadavku, což je vhodné pro hesla.
  • ⚠️ Poznámka k verzi: Tyto výpisy importují javax.servlet, takže běží na Tomcatu 9 nebo starším; Tomcat 10 a novější vyžadují balíčky jakarta.servlet.

Příklady programů pro registraci a přihlašovací formuláře JSP

Tyto příklady ukazují, jak vyvíjet vzorové programy s JSP a jak kolem nich implementovat architekturu MVC. Jsou postupně sestaveny tři moduly:

  • Registrační formulář
  • Přihlašovací a odhlašovací formulář
  • Formulář JSP

Jak vytvořit registrační formulář v JSP

V registračním formuláři máme formulář pro vyplnění všech údajů, které obsahují jméno, uživatelské jméno, heslo, adresu, kontaktní číslo atd.

Tento formulář nám ​​pomáhá s registrací v aplikaci. Zaznamenává všechny naše údaje a ukládá je do databáze nebo cache.

V tomto příkladu vezmeme „Guru Registrační formulář“, který má následující pole:

  1. Jméno
  2. Příjmení
  3. Uživatelské jméno
  4. Heslo
  5. Adresa
  6. Kontaktujte číslo

Po vyplnění všech těchto údajů máme tlačítko pro odeslání; po kliknutí na toto tlačítko se všechny údaje odešlou do servletu.

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 formulář, který má akci, tj. servlet, kterému bude požadavek odeslán, a název servletu je guru_register.java. Požadavek bude zpracován metodou POST.

Code Řádek 14–16: Zde bereme vstupní typ jako text a jméno je křestní_jméno.

Code Řádek 18–20: Zde bereme vstupní typ jako text a jméno je last_name.

Code Řádek 22–24: Zde bereme vstupní typ jako text a jméno je uživatelské jméno.

Code Řádek 26–28: Zde bereme jako typ vstupu heslo (to skryje heslo během psaní) a jako heslo jméno.

Code Řádek 30–32: Zde bereme vstupní typ jako text a jméno jako adresu.

Code Řádek 34–36: Zde bereme vstupní typ jako text a jméno jako kontakt.

Code Řádek 37: Zde bereme tlačítko typu submit, jehož hodnota je také Submit. Po kliknutí na toto tlačítko se akce přesune do odpovídajícího servletu guru_register, kde se v požadavku předávají všechny hodnoty parametrů.

Poznámka: atribut tabulky v Code Řádek 12 zní style="with: 50%"Správná vlastnost CSS je width, takže seznam je reprodukován přesně tak, jak byl publikován, ale velikost tabulky nebude upravena, dokud nebude tato překlep opraven ve vaší vlastní kopii.

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 servlet guru_register, který rozšiřuje HttpServlet.

Code Řádek 18: Toto je metoda doPost(), která se volá, když ve výše uvedeném JSP formuláři zadáme jako atribut metody POST.

Code Řádek 20–25: Zde načítáme hodnoty z požadavku, tj. křestní_jméno, příjmení, uživatelské_jméno, heslo, adresu a kontakt, pomocí request.getParameter.

Code Řádek 27–32: Zde používáme podmínku if, kde kontrolujeme, zda jsou některé z parametrů načtených z požadavku prázdné. Pokud je některý parametr prázdný, řízení zadá tuto podmínku ( first_name.isEmpty() || last_name.isEmpty() || username.isEmpty() || password.isEmpty() || address.isEmpty() || contact.isEmpty()) a z objektu požadavku načteme objekt RequestDispatcher, který odešle požadavek zpět do register_1.jsp. Zde také zahrnujeme objekty request a response.

Code Řádek 33–37: Tato větev se provede, když žádný z parametrů není prázdný. Z objektu požadavku načteme objekt RequestDispatcher, který požadavek přepošle do register_2.jsp. Zde přeposíláme objekty požadavku a odpovědi.

Rozdíl mezi těmito dvěma větvemi je důležitý: include() spustí register_1.jsp a vrátí řízení servletu, zatímco forward() předá požadavek souboru register_2.jsp a nevrátí se.

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 zobrazíme uvítací zprávu. Tato JSP se volá, 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:

Registrační stránka zobrazuje šest označených polí s jediným tlačítkem Odeslat, jak je znázorněno níže.

Guru Registrační formulář v JSP s křestním jménem, ​​příjmením, uživatelským jménem, ​​heslem, adresou a kontaktními poli

Jakmile jsou všechna pole vyplněna a je kliknuto na tlačítko Odeslat, guru_register přesměruje soubor register_2.jsp a zobrazí se stránka s potvrzením úspěšného dokončení.

Stránka úspěchu Register_2.jsp zobrazující uvítací zprávu uživatele po registraci

Po kliknutí na register_1.jsp se zobrazí formulář s křestním jménem, ​​příjmením, uživatelským jménem, ​​heslem, adresou a kontaktem. Po vyplnění všech údajů a kliknutí na tlačítko Odeslat se zobrazí zpráva „Vítejte, uživateli“.

Jak vytvořit přihlašovací a odhlašovací formulář v JSP

Stejně jako registrační formulář nyní vytvoříme přihlašovací a odhlašovací formulář.

V tomto příkladu máme přihlašovací formulář se dvěma poli, „uživatelské jméno“ a „heslo“, a tlačítko pro odeslání.

Po kliknutí na tlačítko Odeslat se nám zobrazí uvítací zpráva s tlačítkem pro odhlášení.

Po kliknutí na tlačítko pro odhlášení se vrátíme zpět na přihlašovací formulář.

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 formulář, jehož akcí je servlet guru_login.java. Metoda, kterou jsou data předávána, je POST.

Code Řádek 13–16: Zde bereme vstupní pole „uživatelské jméno“, které je typu text.

Code Řádek 17–20: Zde bereme vstupní pole „heslo“, které je typu heslo.

Code Řádek 22: Zde bereme tlačítko „odeslat“ s hodnotou „Přihlásit se“. Po kliknutí na něj se řízení předá servletu guru_login, kde se obě pole načtou pomocí objektu požadavku.

Příklad 2: 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é třídy do kódu.

Code Řádek 14: Zde deklarujeme servlet guru_login, který rozšiřuje HttpServlet.

Code Řádek 21: Zde používáme metodu doPost(), protože formulář používá metodu POST.

Code Řádek 23–24: Zde čteme parametry pomocí objektu požadavku, tj. uživatelské jméno a heslo.

Code Řádek 25–29: Tímto způsobem používáme podmínku „if“, která kontroluje, zda jsou uživatelské jméno a heslo prázdné. Pokud je některé z nich prázdné, získáme objekt RequestDispatcher, který odešle řízení zpět do register_3.jsp s objekty request a response.

Code Řádek 30–34: Tato větev se provede, pokud obě nejsou prázdné; poté přepošle požadavek na register_4.jsp s objekty request a response.

Příklad 3: 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 do objektu String username. To funguje, protože forward() zachovává původní požadavek a tedy i jeho parametry beze změny.

Code Řádek 13: Zde máme uvítací zprávu s uživatelským jménem.

Code Řádek 14: Zde máme odkaz pro odhlášení, který uživatele pošle zpět na register_3.jsp.

Když spustíte výše uvedený kód, získáte následující výstup.

Výstup:

Otevření souboru register_3.jsp zobrazí dvě pole s přihlašovacími údaji a tlačítko pro přihlášení.

Guru Přihlašovací formulář v JSP zobrazující pole pro uživatelské jméno a heslo s tlačítkem pro přihlášení

Po kliknutí na tlačítko Přihlásit se zobrazí níže uvedená zpráva spolu s odkazem Odhlásit se.

Úvodní obrazovka souboru Register_4.jsp vítá přihlášeného uživatele odkazem pro odhlášení.

Kliknutím na odkaz Odhlásit se vrátíte na přihlašovací stránku zobrazenou zde.

Přihlašovací stránka se znovu zobrazí v prohlížeči po kliknutí uživatele na tlačítko Odhlásit

Poznámka: Tento příklad porovnává pouze prázdné hodnoty, takže je akceptováno jakékoli neprázdné uživatelské jméno. Produkční přihlášení musí ověřit přihlašovací údaje v úložišti a hesla uchovávat hašovaná, nikdy ne v prostém textu.

Zpracování formuláře JSP pomocí getParameter()

Formuláře jsou běžnou metodou sběru vstupů při webovém zpracování. Potřebujeme odeslat informace na webový server a poté tyto informace načíst zpět na straně serveru.

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.
  • Odesílá zakódované informace připojené ke stránce URL, oddělené znakem ?.
  • Má také omezení velikosti; klasický návod je zhruba 1024 znaků na požadavek, ačkoli skutečný strop je stanoven prohlížečem a serverem spíše než specifikací HTTP.
  • Měli bychom se vyhnout odesílání hesel a citlivých informací metodou GET.

Metoda POST:

  • POST je spolehlivější metoda odesílání informací na server.
  • Odesílá informace jako samostatné tělo zprávy, nikoli do adresního řádku.
  • Protože se hodnoty nikdy neobjevují za znakem ? v URL, nejsou ukládány do historie prohlížeče ani do protokolů přístupu k serveru.
  • Běžně se používá k odesílání citlivých informací.

JSP zpracovává data z formulářů pomocí následujících metod:

  1. getParameter(): používá se k získání hodnoty jednoho parametru formuláře.
  2. getParameterValues(): používá se k vrácení více hodnot parametru.
  3. getParameterNames(): používá se k získání názvů všech parametrů.
  4. getInputStream(): používá se ke čtení binárních dat odeslaných klientem.

Příklad:

V tomto příkladu máme formulář se dvěma poli, „uživatelské jméno“ a „heslo“, a tlačítkem pro odeslání.

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ář, jehož akce je zpracována jiným JSPV atributu action přidáme JSP, na které má být formulář odeslán 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 získáváme vstup od uživatele.

Tento vstup lze načíst pomocí metody getParameter. Máme také tlačítko pro odeslání, které předává hodnoty polí do action_form_process.jsp.

Action_form_process.jsp

Code Řádek 14: Zde získává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:

Action_form.jsp nejprve vykreslí formulář se dvěma poli, jak je znázorněno níže.

Soubor Action_form.jsp vykresluje textová pole Uživatelské jméno a Heslo s tlačítkem Odeslat.

Po odeslání soubor action_form_process.jsp pomocí metody getParameter() odešle uživatelské jméno, které načetl.

Výstupní stránka Action_form_process.jsp zobrazující záhlaví Zpracování formuláře a uvítací zprávu

Když spustíme action_form.jsp, získáme formulář se dvěma poli, uživatelským jménem a heslem, a tlačítkem pro odeslání. Po zadání uživatelského jména a hesla klikneme na tlačítko Odeslat a požadavek je zpracován na další stránce, která vrátí stránku Zpracování formuláře s uvítací zprávou.

Poznámka k verzi: Oba výše uvedené servlety importují javax.servlet, což je správné pro Tomcat 9 a starší verze. Jakarta EE 9 přejmenovala API, takže v Tomcatu 10 a novějších verzích se každý import javax.servlet stává jakarta.servlet, nebo je nutné aplikaci převést pomocí nástroje Apache Tomcat Migration Tool pro Jakarta EE.

Nejčastější dotazy

Výpisy cílí na Tomcat 9 a starší verze, kde se API nachází v souboru javax.servlet. Jakarta EE 9 přejmenovala jmenný prostor, takže Tomcat 10 a novější verze vyžadují import souboru jakarta.servlet a rekompilaci nebo spuštění pomocí nástroje Tomcat Migration Tool.

Nikdy jej neukládejte jako prostý text. Před vstupem do databáze jej hašujte pomalým algoritmem se solenými hodnotami, jako je BCrypt nebo Argon2, a při přihlášení porovnávejte haše. Ukázkový servlet kontroluje pouze prázdné hodnoty, takže je nutné přidat hašování.

Funkce include() spustí cílový zdroj a vrátí řízení volajícímu servletu, takže se zobrazí oba výstupy. Funkce forward() předá celý požadavek cíli a nikdy se nevrací, takže servlet musel nejprve potvrdit odpověď.

JSP stránky tvoří pohled, servlet je kontroler, který čte parametry a rozhoduje, kam jít, a model by poskytovala databáze nebo bean vrstva. RequestDispatcher je spojení mezi kontrolerem a pohledem.

Asistenti umělé inteligence mohou navrhovat validační větve, vyhledávat chybějící null kontroly u getParameter(), navrhovat hašovací knihovny a vysvětlovat stack. tracKaždý návrh považovat za koncept: před odesláním ověřte verzi API servletu a otestujte vygenerovaný kód.ping to.

Copilot je dobrý v opakujících se standardních příkazech, jako jsou doPost stuby, čtení parametrů a volání dispečera. Často se standardně používá starší import javax.servlet, proto zkontrolujte jmenný prostor, validační logiku a esca.ping jakéhokoli uživatelského vstupu, který vygeneruje.

Přidejte do servletu vrstvu JDBC: otevřete sdílené připojení, použijte příkaz PreparedStatement pro vložení nebo vyhledávání přihlašovacích údajů a uzavřete zdroje v bloku finally. Udržujte SQL mimo JSP, aby zobrazení zůstalo pouze prezentační.

Protože guru_login testuje pouze to, zda jsou pole prázdná. Prázdné uživatelské jméno nebo heslo znovu zahrne přihlašovací stránku namísto přesměrování, což funguje spíše jako velmi jednoduchá ochrana ověření než jako skutečné ověřování.

Shrňte tento příspěvek takto: