जेएसपी कार्यक्रम उदाहरण: पंजीकरण और लॉगिन फॉर्म
जेम्स हार्टमैन
⚡ स्मार्ट सारांश
यहां दिए गए JSP प्रोग्राम के उदाहरण तीन मॉड्यूल बनाते हैं — एक पंजीकरण फॉर्म, एक लॉगिन और लॉगआउट फॉर्म, और एक फॉर्म-प्रोसेसिंग पेज — जिनमें से प्रत्येक JSP व्यू को एक सर्वलेट कंट्रोलर से जोड़ता है ताकि MVC का विभाजन शुरुआती लोगों के लिए स्पष्ट रहे।
इन उदाहरणों से पता चलता है कि JSP का उपयोग करके सैंपल प्रोग्राम कैसे विकसित किए जाते हैं और उनमें MVC आर्किटेक्चर कैसे लागू किया जाता है। तीन मॉड्यूल क्रम से बनाए गए हैं:
- पंजीकरण फार्म
- लॉगिन और लॉगआउट फॉर्म
- जेएसपी फॉर्म
JSP में पंजीकरण फॉर्म कैसे बनाएं
पंजीकरण फॉर्म में, हमें सभी विवरण भरने होते हैं, जिनमें नाम, उपयोगकर्ता नाम, पासवर्ड, पता, संपर्क नंबर आदि शामिल होते हैं।
यह फॉर्म हमें एप्लिकेशन के साथ पंजीकरण करने में मदद करता है। यह हमारी सभी जानकारी लेता है और उसे संग्रहीत करता है। डेटाबेस या कैश.
इस उदाहरण में, हम “Guru पंजीकरण प्रपत्र”, जिसमें निम्नलिखित फ़ील्ड हैं:
- प्रथम नाम
- उपनाम
- उपयोगकर्ता नाम
- पासवर्ड
- पता
- संपर्क नंबर
इन सभी विवरणों को भरने के बाद हमारे पास एक सबमिट बटन होता है; उस बटन पर क्लिक करने पर सभी विवरण सर्वलेट को भेज दिए जाते हैं।
उदाहरण 1: रजिस्टर_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>
कोड का स्पष्टीकरण:
Code रेखा 11: यहां हम एक फॉर्म ले रहे हैं जिसमें एक एक्शन है, यानी वह सर्वलेट जिसे अनुरोध भेजा जाएगा, और सर्वलेट का नाम guru_register.java है। अनुरोध को POST विधि के माध्यम से संसाधित किया जाएगा।
Code पंक्ति 14-16: यहां हम इनपुट टाइप के रूप में टेक्स्ट ले रहे हैं और नाम first_name है।
Code पंक्ति 18-20: यहां हम इनपुट टाइप के रूप में टेक्स्ट ले रहे हैं और नाम last_name है।
Code पंक्ति 22-24: यहां हम इनपुट टाइप के रूप में टेक्स्ट ले रहे हैं और नाम यूजरनेम है।
Code पंक्ति 26-28: यहां हम इनपुट टाइप के रूप में पासवर्ड ले रहे हैं (इससे पासवर्ड टाइप करते समय छिपा रहता है) और नाम को भी पासवर्ड के रूप में ले रहे हैं।
Code पंक्ति 30-32: यहां हम इनपुट टाइप के रूप में टेक्स्ट और नाम के रूप में पता ले रहे हैं।
Code पंक्ति 34-36: यहां हम इनपुट टाइप के रूप में टेक्स्ट और नाम के रूप में कॉन्टैक्ट ले रहे हैं।
Code रेखा 37: यहां हम सबमिट प्रकार का एक बटन ले रहे हैं जिसका मान भी सबमिट है। इस बटन पर क्लिक करने पर क्रिया संबंधित गुरु_रजिस्टर सर्वलेट पर जाती है, जहां अनुरोध में सभी पैरामीटर मान पास किए जाते हैं।
नोट: टेबल विशेषता में Code पंक्ति 12 में लिखा है style="with: 50%"सही सीएसएस प्रॉपर्टी यह है: widthइसलिए, सूची को ठीक उसी रूप में पुन: प्रस्तुत किया गया है जैसा प्रकाशित हुआ है, लेकिन जब तक आपकी अपनी प्रति में वह टाइपो ठीक नहीं हो जाता, तब तक तालिका का आकार निर्धारित नहीं किया जाएगा।
उदाहरण 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); } } }
कोड का स्पष्टीकरण:
Code रेखा 14: यहां हम गुरु_रजिस्टर सर्वलेट को परिभाषित करते हैं, जो HttpServlet का विस्तार है।
Code रेखा 18: यह doPost() विधि है, जिसे तब कॉल किया जाता है जब हम ऊपर दिए गए JSP फॉर्म में विधि विशेषता के रूप में POST निर्दिष्ट करते हैं।
Code पंक्ति 20-25: यहां हम request.getParameter का उपयोग करके अनुरोध से मान प्राप्त कर रहे हैं, अर्थात् first_name, last_name, username, password, address और contact।
Code पंक्ति 27-32: यहां हम एक if कंडीशन का उपयोग कर रहे हैं, जिसमें हम यह जांचते हैं कि अनुरोध से प्राप्त किए गए पैरामीटरों में से कोई खाली तो नहीं है। यदि कोई भी पैरामीटर खाली है, तो कंट्रोल इस कंडीशन (first_name.isEmpty() || last_name.isEmpty() || username.isEmpty() || password.isEmpty() || address.isEmpty() || contact.isEmpty()) में प्रवेश करता है और हम अनुरोध ऑब्जेक्ट से एक RequestDispatcher ऑब्जेक्ट प्राप्त करते हैं, जो अनुरोध को वापस register_1.jsp पर भेजता है। यहां हम अनुरोध और प्रतिक्रिया ऑब्जेक्ट भी शामिल कर रहे हैं।
Code पंक्ति 33-37: यह शाखा तब निष्पादित होती है जब कोई भी पैरामीटर खाली नहीं होता है। हम अनुरोध ऑब्जेक्ट से एक RequestDispatcher ऑब्जेक्ट प्राप्त करते हैं, जो अनुरोध को register_2.jsp पर अग्रेषित करता है। यहां हम अनुरोध और प्रतिक्रिया ऑब्जेक्ट अग्रेषित कर रहे हैं।
दोनों शाखाओं के बीच का अंतर महत्वपूर्ण है: include() यह register_1.jsp को चलाता है और नियंत्रण को सर्वलेट को वापस लौटा देता है, जबकि forward() यह अनुरोध register_2.jsp को भेजता है और वापस नहीं आता है।
उदाहरण 3: रजिस्टर_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>
कोड का स्पष्टीकरण:
Code रेखा 10: यहां हम स्वागत संदेश प्रदर्शित करते हैं। यह JSP तब कॉल किया जाता है जब सभी पैरामीटर भर दिए जाते हैं।
जब आप उपरोक्त कोड निष्पादित करते हैं, तो आपको निम्नलिखित आउटपुट मिलता है।
आउटपुट:
पंजीकरण पृष्ठ पर छह चिह्नित फ़ील्ड और एक सबमिट बटन दिखाई देता है, जैसा कि नीचे दिखाया गया है।
जब सभी फ़ील्ड भर दिए जाते हैं और सबमिट पर क्लिक किया जाता है, तो guru_register फ़ाइल register_2.jsp पर भेज दी जाती है और सफलता पृष्ठ दिखाई देता है।
जब हम register_1.jsp पर क्लिक करते हैं, तो हमें एक फॉर्म मिलता है जिसमें पहला नाम, अंतिम नाम, उपयोगकर्ता नाम, पासवर्ड, पता और संपर्क विवरण देना होता है। सभी विवरण भरने और सबमिट बटन पर क्लिक करने के बाद, हमें "स्वागत है उपयोगकर्ता" संदेश मिलता है।
JSP में लॉगिन और लॉगआउट फॉर्म कैसे बनाएं
पंजीकरण फॉर्म की तरह, अब हम लॉगिन और लॉगआउट फॉर्म बनाएंगे।
इस उदाहरण में, हमने एक लॉगिन फॉर्म लिया है जिसमें दो फ़ील्ड हैं, "उपयोगकर्ता नाम" और "पासवर्ड", और एक सबमिट बटन है।
जब हम सबमिट बटन पर क्लिक करते हैं, तो हमें एक स्वागत संदेश मिलता है जिसमें लॉगआउट बटन होता है।
जब हम लॉगआउट बटन पर क्लिक करते हैं, तो हम वापस लॉगिन फॉर्म पर आ जाते हैं।
उदाहरण 1: रजिस्टर_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>
कोड का स्पष्टीकरण:
Code रेखा 10: यहां हम एक फॉर्म ले रहे हैं जिसका एक्शन servlet guru_login.java है। डेटा पास करने का तरीका POST है।
Code पंक्ति 13-16: यहां हम "यूजरनेम" नामक एक इनपुट फ़ील्ड ले रहे हैं, जो टेक्स्ट प्रकार का है।
Code पंक्ति 17-20: यहां हम "पासवर्ड" नामक एक इनपुट फ़ील्ड ले रहे हैं, जो पासवर्ड प्रकार का है।
Code रेखा 22: यहां हम "लॉगिन" मान वाला एक "सबमिट" बटन ले रहे हैं। इस पर क्लिक करने पर, नियंत्रण guru_login नामक सर्वलेट पर चला जाता है, जहां अनुरोध ऑब्जेक्ट का उपयोग करके दोनों फ़ील्ड पढ़े जाते हैं।
उदाहरण 2: Guru_login.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_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); } } }
कोड का स्पष्टीकरण:
Code पंक्ति 5-9: यहां हम आवश्यक क्लासों को कोड में इम्पोर्ट कर रहे हैं।
Code रेखा 14: यहां हम गुरु_लॉगिन सर्वलेट घोषित कर रहे हैं, जो HttpServlet का विस्तार है।
Code रेखा 21: यहां हम doPost() विधि का उपयोग कर रहे हैं, क्योंकि फॉर्म POST विधि का उपयोग करता है।
Code पंक्ति 23-24: यहां हम रिक्वेस्ट ऑब्जेक्ट का उपयोग करके पैरामीटर पढ़ रहे हैं, यानी यूजरनेम और पासवर्ड।
Code पंक्ति 25-29: इस तरह हम एक "if" शर्त का उपयोग करते हैं जो यह जांचती है कि उपयोगकर्ता नाम और पासवर्ड खाली हैं या नहीं। यदि इनमें से कोई भी खाली है, तो हमें एक RequestDispatcher ऑब्जेक्ट मिलता है जो अनुरोध और प्रतिक्रिया ऑब्जेक्ट के साथ नियंत्रण को वापस register_3.jsp पर भेजता है।
Code पंक्ति 30-34: यह शाखा तभी निष्पादित होती है जब दोनों खाली न हों; फिर यह अनुरोध और प्रतिक्रिया ऑब्जेक्ट के साथ अनुरोध को register_4.jsp पर अग्रेषित करती है।
उदाहरण 3: रजिस्टर_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>
कोड का स्पष्टीकरण:
Code रेखा 12: यहां हम अनुरोध ऑब्जेक्ट से "username" पैरामीटर को स्ट्रिंग ऑब्जेक्ट username में प्राप्त करते हैं। यह इसलिए काम करता है क्योंकि forward() मूल अनुरोध और उसके पैरामीटर को बरकरार रखता है।
Code रेखा 13: यहां हमारे पास उपयोगकर्ता नाम के साथ एक स्वागत संदेश है।
Code रेखा 14: यहां लॉगआउट लिंक है, जो उपयोगकर्ता को वापस register_3.jsp पर भेज देता है।
जब आप उपरोक्त कोड निष्पादित करते हैं, तो आपको निम्नलिखित आउटपुट मिलता है।
आउटपुट:
register_3.jsp खोलने पर दो क्रेडेंशियल फ़ील्ड और एक लॉगिन बटन दिखाई देता है।
लॉगिन बटन पर क्लिक करने के बाद, आपको नीचे दिया गया संदेश और साथ ही एक लॉगआउट लिंक प्राप्त होगा।
लॉगआउट लिंक पर क्लिक करने से आप वापस लॉगिन पेज पर आ जाएंगे, जैसा कि यहां दिखाया गया है।
नोट: यह उदाहरण केवल खाली मानों की तुलना करता है, इसलिए कोई भी गैर-खाली उपयोगकर्ता नाम स्वीकार्य है। उत्पादन लॉगिन को क्रेडेंशियल को एक संग्रहीत डेटा के विरुद्ध सत्यापित करना चाहिए और पासवर्ड को हैश में रखना चाहिए, कभी भी सादे टेक्स्ट में नहीं।
getParameter() का उपयोग करके JSP फॉर्म प्रोसेसिंग
वेब प्रोसेसिंग में इनपुट एकत्र करने का एक सामान्य तरीका फॉर्म भरना है। हमें वेब सर्वर को जानकारी भेजनी होती है और फिर सर्वर साइड पर उस जानकारी को वापस पढ़ना होता है।
वेब सर्वर पर सूचना भेजने और वापस प्राप्त करने के लिए आमतौर पर दो तरीके प्रयुक्त होते हैं।
GET विधि:
- यह ब्राउज़र से वेब सर्वर तक जानकारी भेजने की डिफ़ॉल्ट विधि है।
- यह पृष्ठ में संलग्न एन्कोडेड जानकारी भेजता है। URL, जो एक ? चिह्न द्वारा अलग किए गए हैं।
- इसमें आकार की भी एक सीमा है; सामान्य दिशानिर्देश प्रति अनुरोध लगभग 1024 वर्णों का है, हालांकि वास्तविक सीमा HTTP विनिर्देश के बजाय ब्राउज़र और सर्वर द्वारा निर्धारित की जाती है।
- हमें GET विधि के माध्यम से पासवर्ड और संवेदनशील जानकारी भेजने से बचना चाहिए।
पोस्ट विधि:
- सर्वर को जानकारी भेजने का POST तरीका अधिक विश्वसनीय है।
- यह जानकारी को एड्रेस बार में भेजने के बजाय एक अलग संदेश निकाय के रूप में भेजता है।
- क्योंकि ? के बाद मान कभी दिखाई नहीं देते हैं URLवे ब्राउज़र हिस्ट्री या सर्वर एक्सेस लॉग में संग्रहीत नहीं होते हैं।
- इसका उपयोग आमतौर पर संवेदनशील जानकारी भेजने के लिए किया जाता है।
JSP फॉर्म डेटा प्रोसेसिंग के लिए निम्नलिखित विधियों का उपयोग करता है:
- getParameter(): इसका उपयोग किसी एक फॉर्म पैरामीटर का मान प्राप्त करने के लिए किया जाता है।
- getParameterValues(): इसका उपयोग किसी पैरामीटर के कई मानों को लौटाने के लिए किया जाता है।
- getParameterNames(): इसका उपयोग सभी पैरामीटरों के नाम प्राप्त करने के लिए किया जाता है।
- getInputStream(): क्लाइंट द्वारा भेजे गए बाइनरी डेटा को पढ़ने के लिए उपयोग किया जाता है।
उदाहरण:
इस उदाहरण में, हमने एक फॉर्म लिया है जिसमें दो फ़ील्ड हैं, "उपयोगकर्ता नाम" और "पासवर्ड", और एक सबमिट बटन है।
एक्शन_फॉर्म.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>
एक्शन_फॉर्म_प्रोसेस.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
Code रेखा 10: यहां हमने एक ऐसे रूप को परिभाषित किया है जिसकी क्रिया को दूसरे द्वारा संसाधित किया जाता है। JSPएक्शन एट्रिब्यूट में हम उस JSP फ़ाइल को जोड़ते हैं जिसमें फॉर्म को GET विधि के माध्यम से सबमिट किया जाना है।
यहां हम जानकारी, यानी उपयोगकर्ता नाम और पासवर्ड को पास करने के लिए GET विधि का उपयोग कर रहे हैं।
Code पंक्ति 11-14: यहां हम यूजरनेम और पासवर्ड जैसे टेक्स्ट फील्ड ले रहे हैं और यूजर से इनपुट प्राप्त कर रहे हैं।
इस इनपुट को getParameter मेथड का उपयोग करके प्राप्त किया जा सकता है। हमारे पास एक सबमिट बटन भी है, जो फ़ील्ड मानों को action_form_process.jsp में भेजता है।
एक्शन_फॉर्म_प्रोसेस.jsp
Code रेखा 14: यहां हम रिक्वेस्ट ऑब्जेक्ट के getParameter मेथड का उपयोग करके action_form.jsp से इनपुट फ़ील्ड के मान प्राप्त करते हैं।
जब हम उपरोक्त कोड को निष्पादित करते हैं, तो हमें निम्नलिखित आउटपुट प्राप्त होता है।
आउटपुट:
Action_form.jsp सबसे पहले नीचे दिखाए गए दो फ़ील्ड वाले फ़ॉर्म को रेंडर करता है।
सबमिट करने के बाद, action_form_process.jsp getParameter() का उपयोग करके पढ़े गए उपयोगकर्ता नाम को प्रतिध्वनित करता है।
जब हम action_form.jsp फ़ाइल चलाते हैं, तो हमें उपयोगकर्ता नाम और पासवर्ड नामक दो फ़ील्ड और एक सबमिट बटन वाला फ़ॉर्म मिलता है। उपयोगकर्ता नाम और पासवर्ड दर्ज करने के बाद हम सबमिट बटन पर क्लिक करते हैं, और अनुरोध को अगले पृष्ठ द्वारा संसाधित किया जाता है, जो स्वागत संदेश के साथ फ़ॉर्म प्रोसेसिंग पृष्ठ पर वापस ले जाता है।
संस्करण नोट: ऊपर दिए गए दोनों सर्वलेट javax.servlet को इम्पोर्ट करते हैं, जो टॉमकैट 9 और उससे पहले के संस्करणों के लिए सही है। जकार्ता EE 9 ने API का नाम बदल दिया है, इसलिए टॉमकैट 10 या उसके बाद के संस्करणों में हर javax.servlet इम्पोर्ट jakarta.servlet बन जाता है, या एप्लिकेशन को अपाचे टॉमकैट माइग्रेशन टूल फॉर जकार्ता EE का उपयोग करके परिवर्तित किया जाना चाहिए।
