JSP-programexempel: Registrerings- och inloggningsformulär

I den här handledningen kommer jag att leda dig genom att utveckla exempelprogram med JSP och implementera MVC-arkitekturen i den här handledningen.

Följande programexempel kommer att utvecklas:

ANMÄLNINGSBLANKETT
Inloggnings- och utloggningsformulär
JSP-formulär

Använd registreringsformuläret via JSP

I registreringsformuläret kommer vi att ha ett formulär för att fylla i alla detaljer som kommer att innehålla namn, användarnamn, lösenord, adress, kontaktnummer, etc.

Detta formulär hjälper oss att registrera oss med ansökan. De tar alla våra detaljer och lagrar dem i en databas eller cache.

I det här exemplet kommer vi att ta "Guru Registration form" som har följande fält:

Förnamn
Efternamn
Användarnamn
Lösenord
Adress
Kontaktnummer

Efter att ha fyllt i alla dessa detaljer har vi skicka-knappen, om du klickar på den knappen kommer alla detaljer att lagras.

Exempel 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>

Förklaring av koden:

Kodrad 11: Här tar vi ett formulärnamn som har åtgärd, dvs servleten som begäran kommer att behandlas till och servletnamnet är guru_register.java. Förfrågan kommer att behandlas med POST-metoden.

Kodrad 14-16: Här tar vi indatatyp som text och namn är förnamn

Kodrad 18-20: Här tar vi indatatyp som text och namn är efternamn

Kodrad 22-24: Här tar vi ingångstyp som text och namn är användarnamn

Kodrad 26-28: Här tar vi ingångstyp som lösenord (detta kommer att dölja lösenordet när det skrivs) och namn som lösenord

Kodrad 30-32: Här tar vi indatatyp som text och namn som adress

Kodrad 34-36: Här tar vi ingångstyp som text och namn som kontakt

Kodrad 37: Här tar vi en knapp av typen submit och värde är också submit. När du klickar på den här knappen kommer åtgärden att gå till motsvarande guru_register-servlet där alla parametervärden kommer att skickas i begäran.

Exempel 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);
		}
	}

}

Förklaring av koden:

Kodrad 14: Här definierar vi guru_servlet som utökar HttpServlet.

Kodrad 18: Denna åtgärd doPost() metod som kommer att anropas när vi nämner POST in action-attributet i ovanstående JSP-formulär.

Kodrad 20-25: Här hämtar vi värdena från request i.efirst_name, last_name , användarnamn, lösenord, adress och kontakt med request.getParameter.

Kodrad 27-32: Här tar vi om tillstånd där vi kontrollerar någon av parametrarna som hämtas från begäran som om de är tomma eller inte. Om någon av parametrarna är tom kommer den att ange detta villkor ( first_name.isEmpty() || last_name.isEmpty || username.isEmpty || password.isEmpty || address.isEmpty || contact.isEmpty()) och vi har för att hämta RequestDispatcher-objekt med hjälp av request-objekt som vidarebefordrar begäran till register_1.jsp. Här inkluderar vi även förfrågnings- och svarsobjekt.

Kodrad 33-37: Det här fallet kommer att köras när någon av parametrarna inte är tomma. Vi måste hämta requestDispatcher-objektet med request-objektet som vidarebefordrar begäran till register_2.jsp.Här vidarebefordrar vi begäran- och svarsobjekt.

Exempel 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>

Förklaring av koden:

Kodrad 10: Här säger vi välkommen användare. Denna JSP kommer att anropas när alla parametrar är ifyllda.

När du kör ovanstående kod får du följande utdata:

Produktion:

När vi klickar på register_1.jsp får vi ett formulär som innehåller detaljer som förnamn, efternamn, användarnamn, lösenord, adress, kontakt. Alla detaljer har fyllts i. När vi klickar på skicka-knappen får vi meddelandet som "Välkommen användare"

Inloggnings- och utloggningsformulär

Liksom registreringsformuläret kommer vi att ha ett inloggnings- och utloggningsformulär.

I det här exemplet har vi tagit inloggningsformuläret där vi har två fält "användarnamn" och "lösenord" med en skicka-knapp.

När vi klickar på skicka-knappen får vi ett välkomstmeddelande med en utloggningsknapp.

När vi klickar på utloggningsknappen kommer vi tillbaka till inloggningsformuläret.

Exempel 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>

Förklaring av koden:

Kodrad 10: Här tar vi ett formulärnamn som har åtgärd, dvs servlet som det har passerat till är guru_login.java. Metoden genom vilken den kommer att skicka sin POST.

Kodrad 13-16: Här tar vi ett inmatningsfält "användarnamn" som är av typen text.

Kodrad 17-20: Här tar vi ett inmatningsfält "lösenord" som är av typen lösenord.

Kodrad 22: Här tar vi en "skicka"-knapp med värdet "Logga in" som vi klickar på och sedan går den till servlet guru_login där båda fälten tas med request object.

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);
		}
	}

}

Förklaring av koden:

Kodrad 5-9: Här importerar vi nödvändiga importer i koden.

Kodrad 14: Här tar vi guru_login servlet som utökar HttpServlet.

Kodrad 21: Här använder vi doPost() metod som i den form vi använder POST-metoden.

Kodrad 23-24: Här tar vi parametrar med hjälp av begäranobjekt, dvs användarnamn och lösenord.

Kodrad 25-29: På det här sättet tar vi "if"-tillstånd där vi kontrollerar användarnamn och lösenord om de är tomma eller inte. Om det är tomt får vi requestdispatcher-objekt som vidarebefordrar till register_3.jsp med begäran och svarsobjekt.

Kodrad 30-34: Detta kommer att exekveras om båda inte är tomma, sedan vidarebefordras begäran till register_4.jsp med begäran och svarsobjekt.

Exempel 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>

Förklaring av koden:

Kodrad 12: Här får vi parametern "användarnamn" från begäranobjektet i strängobjektets användarnamn.

Kodrad 13: Här har vi ett välkomstmeddelande med användarnamnet.

Kodrad 14: Här länkar vi för att logga ut formuläret som omdirigerar till register_3.jsp.

När du kör ovanstående kod får du följande utdata:

Produktion:

Här när vi klickar på register_3.jsp får vi två fält ”användarnamn” och ”lösenord” med en inloggningsknapp.

Efter att ha klickat på knappen Logga in får du meddelandet nedan med knappen Logga ut.

När du klickar på utloggningsknappen går du tillbaka till inloggningssidan

JSP-formulärbearbetning med getParameter()

JSP-formulärbearbetning:

Blanketter är den vanliga metoden inom webbbehandling. Vi måste skicka information till webbservern och den informationen.

Det finns två vanliga metoder för att skicka och få tillbaka information till webbservern.

GET-metod:

Detta är standardmetoden för att skicka information från webbläsare till webbserver.
Den skickar den kodade informationen separerad av ?tecken som läggs till URL-sidan.
Den har också en storleksbegränsning och vi kan bara skicka 1024 tecken i förfrågan.
Vi bör undvika att skicka lösenord och känslig information via GET-metoden.

POST-metod:

Postmetoden är den mest pålitliga metoden för att skicka information till servern.
Den skickar information som ett separat meddelande.
Det skickas som textsträng efter ?i URL:en.
Det används ofta för att skicka information som är känslig.

JSP hanterar formulärdatabehandling genom att använda följande metoder:

getParameter(): Den används för att få värdet på formparametern.
getParameterValues(): Den används för att returnera flera parametrars värden.
getParameterNames(): Den används för att få namn på parametrar.
getInputStream(): Den används för att läsa binära data som skickas av klienten.

Exempelvis:

I det här exemplet har vi tagit ett formulär med två fält."användarnamn" och "lösenord" med en skicka-knapp

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>

Förklaring av koden: Action_form.jsp

Kodrad 10: Här har vi definierat en form och genom vilken vi har bearbetat handlingen till någon annan JSP. I handlingsparameter lägger vi till den JSP till vilken den måste bearbetas genom GET-metoden.

Här använder vi GET-metoden för att skicka informationen, dvs användarnamn och lösenord.

Kodrad 11-14: Här tar vi fält som användarnamn och lösenord som är textfält, och vi får input från användaren.

Denna indata kan hämtas med metoden getParameter. Vi har också skicka-knapp med typ submit-typ som hjälper oss att skicka fältvärdena till action_form_process.jsp

Action_form_process.jsp

Kodrad 14: Här får vi värdena för inmatningsfälten från action_form.jsp med hjälp av begäranobjektets getParameter-metod.

När vi kör ovanstående kod får vi följande utdata:

Produktion:

När vi kör action_form.jsp får vi ett formulär med två fält användarnamn och lösenord och en skicka-knapp. Sedan efter att ha angett användarnamn och lösenord kan vi klicka på skicka, och det bearbetas till nästa sida som ger utdata som formulärbearbetningssida med en välkomstmeddelande.

Du kanske gillar:

Använd registreringsformuläret via JSP

RELATERADE ARTIKLAR

Inloggnings- och utloggningsformulär

JSP-formulärbearbetning med getParameter()

JSP-formulärbearbetning:

GET-metod:

POST-metod: