JavaRush /جاوا بلاگ /Random-SD /servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (ح...

سطح

Киев

28 February 2021
49 views
0 comments

servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (حصو 2)

servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (حصو 1) مضمون کي سمجهڻ لاءِ گهربل علم جي سطح: توهان اڳ ۾ ئي جاوا ڪور کي وڌيڪ يا گهٽ سمجهي چڪا آهيو ۽ توهان چاهيو ٿا ته JavaEE ٽيڪنالاجيز ۽ ويب پروگرامنگ کي ڏسڻ چاهيو. اهو سڀ کان وڌيڪ معنيٰ رکي ٿو جيڪڏهن توهان هن وقت جاوا مجموعن جي ڳولا جو مطالعو ڪري رهيا آهيو، جيڪو مضمون جي ويجهو عنوانن کي ڍڪي ٿو.

ادارو ٺاهڻ

ادارن جي پيڪيج ۾ اسان هڪ ڪلاس يوزر ٺاهينداسين ، ۽ ان ۾ ٻه پرائيويٽ اسٽرنگ ويريبلز جو نالو ۽ پاسورڊ هوندو . اچو ته ٺاھيندڙ ٺاھيون (ڊفالٽ ۽ ھڪڙو جيڪو ٻنھي قدرن کي قبول ڪري سگھن)، حاصل ڪندڙ / سيٽرز، صرف صورت ۾ toString() طريقي کي اوور رائڊ ڪريو ، گڏوگڏ equals() ۽ hashCode() طريقا . اهو آهي، اسان سڀ ڪجهه ڪنداسين جيڪو هڪ مهذب جاوا ڊولپر ڪندو آهي جڏهن ڪلاس ٺاهيندو آهي.

public class User {
    private String name;
    private String password;

    public User() {
    }

    public User(String name, String password) {
        this.name = name;
        this.password = password;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    @Override
    public String toString() {
        return "User{" +
                "name='" + name + '\'' +
                ", password='" + password + '\'' +
                '}';
    }

    @Override
    public boolean equals(Object o) {
        if (this == o) return true;
        if (o == null || getClass() != o.getClass()) return false;

        User user = (User) o;

        if (name != null ? !name.equals(user.name) : user.name != null) return false;
        return password != null ? password.equals(user.password) : user.password == null;

    }

    @Override
    public int hashCode() {
        int result = name != null ? name.hashCode() : 0;
        result = 31 * result + (password != null ? password.hashCode() : 0);
        return result;
    }
}

هاڻي اسان استعمال ڪندڙن جي هڪ فهرست ٺاهڻ شروع ڪري سگهون ٿا. اسان صارفين کي ان ۾ شامل ڪنداسين، ۽ جتان اسين انھن کي ڊسپلي لاء وٺي ويندا. بهرحال، اتي هڪ مسئلو آهي. اسان اسان جي servlet شيون پيدا نه ڪندا آھن، Tomcat اسان لاء ڪندو آھي . اهي طريقا جيڪي اسان انهن ۾ اوور رائڊ ڪريون ٿا اهي پڻ اسان لاءِ اڳ ۾ ئي بيان ڪيا ويا آهن، ۽ اسان هڪ پيٽرولر شامل نٿا ڪري سگهون. پوء ڪيئن اسان هڪ گڏيل لسٽ ٺاهي سگهون ٿا جيڪو اسان جي ٻنهي سرورن کي نظر اچي ٿو؟ جيڪڏهن اسان صرف هر سرورٽ ۾ پنهنجون لسٽ اعتراض ٺاهي سگهون ٿا، اهو ظاهر ٿيندو ته اسان صارفين کي هڪ فهرست ۾ شامل ڪنداسين، ۽ لسٽ سرورٽ استعمال ڪندڙ استعمال ڪندڙن جي فهرست کي ٻئي ڏانهن ڏيکارينداسين. اهو ظاهر ٿئي ٿو ته اسان کي هڪ اعتراض جي ضرورت آهي جيڪا ٻنهي سرورن لاء عام هجي. عام طور تي ڳالهائڻ، اسان کي هڪ اعتراض جي ضرورت آهي جيڪا اسان جي پروگرام ۾ سڀني طبقن لاء عام هجي؛ سڄي پروگرام لاء واحد اعتراض. مون کي اميد آهي ته توهان ڊزائن جي نمونن بابت ڪجهه ٻڌو آهي. ۽، شايد، ڪجهه لاءِ هي آهي پهرين حقيقي ضرورت آهي استعمال ڪرڻ جي سنگلٽن جو نمونو انهن جي پروگرام ۾. توھان خراب ٿي سگھوٿا ۽ ڊبل چيڪن ۽ سنڪرونائيزيشن سان ڪجھ ٿڌو سنگلٽن ٺاھي سگھو ٿا (ھا، اسان وٽ ھڪ گھڻائي ٿريڊ ايپليڪيشن آھي، جتان ٽام ڪيٽ مختلف ٿريڊن ۾ سروليٽ ھلائي ٿو)، پر مان اھو اختيار استعمال ڪندس شروعاتي شروعات سان، ڇو ته اھو ھتي بلڪل موزون آھي. ڪافي آهي ۽ اهو اسان جي مقصدن لاءِ مناسب آهي.

ماڊل ٺاهڻ

اچو ته ماڊل پيڪيج ۾ هڪ ڪلاس ٺاهيو (۽ ان ۾ سنگلٽن جو نمونو لاڳو ڪريو ) ۽ ان کي غير معمولي سڏيو. اچو ته ماڊل . اچو ته پنھنجي ڪلاس ۾ پرائيويٽ يوزر لسٽ شئي ٺاھيون ۽ ٻن طريقن تي عمل ڪريون: ھڪڙو ته جيئن اسان صارف کي شامل ڪري سگھون، ۽ ٻيو ته جيئن تارن جي لسٽ (يوزر جا نالا) موٽائي سگھون. جيئن ته اسان جو صارف اعتراض هڪ نالو ۽ پاسورڊ تي مشتمل آهي، ۽ اسان نٿا چاهيون ته "ظاهر" صارف پاسورڊ، اسان وٽ صرف نالن جي فهرست هوندي.

public class Model {
    private static Model instance = new Model();

    private List<User> model;

    public static Model getInstance() {
        return instance;
    }

    private Model() {
        model = new ArrayList<>();
    }

    public void add(User user) {
        model.add(user);
    }

    public List<String> list() {
        return model.stream()
                .map(User::getName)
                .collect(Collectors.toList());
    }
}

Mvc بابت ٿورڙو

جڏهن کان توهان سنگلٽن بابت ٻڌو آهي ، ته پوءِ توهان شايد ڪنهن ٻئي ڊيزائن جي نموني بابت ٻڌو هوندو - MVC (ماڊل-ويو-ڪنٽرولر، روسي ماڊل-ويو-ڪنٽرولر ۾، يا جيئن انگريزي ماڊل-ويو-ڪنٽرولر ۾). ان جو جوهر ڪاروبار منطق کي پيش ڪرڻ کان الڳ ڪرڻ آهي. اهو آهي، ڪوڊ الڳ ڪريو جيڪو اهو طئي ڪري ٿو ته ڪوڊ مان ڇا ڪجي جيڪو اهو طئي ڪري ٿو ته ڪيئن ڊسپلي ڪجي. ڏسو (ڏسو يا صرف ڏسڻ) ان فارم لاء ذميوار آهي جنهن ۾ ڪجهه ڊيٽا پيش ڪئي وئي آهي. اسان جي حالت ۾، نظريا اسان جا JSP صفحا آهن. ان ڪري مون انهن کي هڪ فولڊر ۾ رکيو آهي جنهن کي views سڏيو ويندو آهي . ماڊل حقيقي ڊيٽا آهي جنهن سان پروگرام ڪم ڪري ٿو. اسان جي حالت ۾، اهي صارف آهن (استعمال ڪندڙن جي فهرست). يقينن، ڪنٽرولرز انهن جي وچ ۾ ڳنڍيندڙ لنڪ آهن. اهي ماڊل مان ڊيٽا وٺن ٿا ۽ ان کي ڏيک ڏانهن منتقل ڪن ٿا (يا Tomcat کان ڪجهه ڊيٽا وصول ڪن ٿا، ان کي پروسيس ڪريو ۽ ان کي ماڊل ڏانهن منتقل ڪريو). ڪاروباري منطق (جيڪو واقعي پروگرام ڪرڻ گهرجي) انهن ۾ بيان ڪرڻ جي ضرورت آهي، ۽ نه ته ماڊل يا نظر ۾. تنهن ڪري، هرڪو پنهنجو ڪم ڪري ٿو:

ماڊل اسٽوريج ڊيٽا؛
نظارو ڊيٽا جي هڪ خوبصورت نمائندگي ٺاهي؛
ڪنٽرولر ڊيٽا پروسيسنگ کي سنڀاليندا آهن.

هي پروگرام کي بلڪل سادو ۽ برقرار رکڻ جي اجازت ڏئي ٿو، بلڪه هڪ ڪلاس ۾ سڀني ڪوڊ جي خوفناڪ ڊمپ جي. MVC نه رڳو ويب پروگرامنگ لاء مناسب آهي، پر اهو هن علائقي ۾ آهي ته اهو خاص طور تي اڪثر (تقريبا هميشه) مليو آهي. اسان جي صورت ۾، servlets ڪنٽرولر طور ڪم ڪندو. هي نموني جو هڪ تمام سطحي ۽ مختصر بيان آهي، پر MVC هن مضمون جو مکيه موضوع نه آهي. ڪير وڌيڪ ڄاڻڻ چاهي ٿو - گوگل بچاءُ لاءِ! يوزر کي شامل ڪرڻ لاءِ فارم ٺاهيو اچو ته add.jsp فائل ۾ شامل ڪريون هڪ فارم جنهن ۾ ٻه ٽيڪسٽ ان پٽ فيلڊز شامل آهن (هڪ باقاعده، ٻيو پاس ورڊ) ۽ هڪ بٽڻ سرور ڏانهن ڊيٽا موڪلڻ لاءِ.

<form method="post">
    <label>Name:
        <input type="text" name="name"><br />
    </label>

    <label>Password:
        <input type="password" name="pass"><br />
    </label>
    <button type="submit">Submit</button>
</form>

هتي فارم ۾ قدر پوسٽ سان هڪ طريقو خاصيت آهي . هن جو مطلب آهي ته هن فارم مان ڊيٽا پوسٽ جي درخواست جي صورت ۾ سرور ڏانهن موڪلي ويندي. عمل جي وصف بيان نه ڪئي وئي آهي، جنهن جو مطلب آهي ته درخواست ساڳئي پتي تي موڪلي ويندي جتي اسان هن صفحي تي ويا هئاسين ( /add ). اهڙيءَ طرح، اسان جو سرورٽ، هن ايڊريس تي پابند، GET جي درخواست حاصل ڪرڻ تي، هن jsp کي واپس ڪري ٿو فارم سان گڏ صارفين کي شامل ڪرڻ لاءِ، ۽ جيڪڏهن ان کي پوسٽ جي درخواست ملي ٿي، ته ان جو مطلب آهي ته فارم ان جي ڊيٽا اتي موڪلي آهي (جنهن کي اسين ان مان ڪڍنداسين. doPost() اها ڳالهه نوٽ ڪرڻ جي قابل آهي ته ان پٽ فيلڊن ۾ هڪ نالي وارو پيٽرولر هوندو آهي (هڪ فيلڊ لاءِ جنهن جي نالي سان ان ۾ قدر جو نالو هوندو آهي، ۽ پاسورڊ سان فيلڊ لاءِ ان ۾ قدر پاس هوندو آهي ). هي هڪ تمام اهم نقطو آهي. جيئن ته هن ڊيٽا کي حاصل ڪرڻ لاء (نالو ۽ پاسورڊ جيڪو داخل ڪيو ويندو) درخواست کان (اڳ ۾ ئي سرورليٽ جي اندر)، اسان بلڪل استعمال ڪنداسين نالو ۽ پاس . پر انهي تي وڌيڪ بعد ۾. ڊيٽا موڪلڻ لاءِ بٽڻ پاڻ وري هڪ بٽڻ جي صورت ۾ ٺاهيو ويو آهي ، ۽ نه ته آئوٽ پٽ فيلڊ جي طور تي، جيئن عام طور تي رواج آهي. مون کي خبر ناهي ته هي اختيار ڪيترو عالمگير آهي، پر اهو مون لاءِ ڪم ڪري ٿو (ڪروم برائوزر).

هڪ servlet سان پوسٽ جي درخواست تي عمل ڪندي

اچو ته واپس وڃو AddServlet servlet . مون کي توهان کي ياد ڏيارڻ ڏيو: اسان جي servlet لاءِ GET درخواستن کي ”پڪڙڻ“ جي قابل ٿيڻ لاءِ، اسان HttpServlet ڪلاس مان doGet() طريقي کي ختم ڪيو . اسان جي servlet کي سيکارڻ لاءِ POST جون درخواستون پڻ پڪڙڻ لاءِ، اسان کي به ضرورت آهي ته doPost() طريقي کي اوور رائڊ ڪريو . اهو Tomcat کان ساڳئي درخواست ۽ جوابي شيون وصول ڪري ٿو ، جنهن سان اسان ڪم ڪنداسين. پهرين، اچو ته درخواست مان ڪڍيون نالو ۽ پاس ڪيل پيٽرولر جيڪي فارم موڪليا ويا آهن (جيڪڏهن توهان انهن کي فارم ۾ مختلف طور تي رکيو، ته اهي نالا آهن جيڪي توهان لکندا آهيو). ان کان پوء، اسان حاصل ڪيل ڊيٽا استعمال ڪندي اسان جو صارف اعتراض ٺاهينداسين. پوء اسان ماڊل اعتراض حاصل ڪنداسين ۽ ٺاهيل صارف کي ماڊل ۾ شامل ڪنداسين.

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    String name = req.getParameter("name");
    String password = req.getParameter("pass");
    User user = new User(name, password);
    Model model = Model.getInstance();
    model.add(user);
}

ڏسڻ لاءِ ڊيٽا پاس ڪرڻ

اچو ته اڳتي وڃو ListServlet servlet . doGet() طريقو هتي اڳ ۾ ئي لاڳو ڪيو ويو آهي ، جيڪو صرف ڪنٽرول کي list.jsp ڏيک ڏانهن منتقل ڪري ٿو . جيڪڏهن توهان وٽ اڃا تائين اهو ناهي، اهو ساڳيو طريقي سان قياس سان ڪريو AddServlet servlet . ھاڻي اھو سٺو لڳندو ته ماڊل مان صارفين جي نالن جي ھڪڙي فهرست حاصل ڪري ۽ انھن کي ڏيک ڏانھن منتقل ڪريو، جيڪو انھن کي وصول ڪندو ۽ انھن کي چڱي طرح ڏيکاريندو. هن کي ڪرڻ لاء، اسان ٻيهر استعمال ڪنداسين درخواست اعتراض جيڪو اسان حاصل ڪيو آهي Tomcat . اسان هن اعتراض ۾ هڪ خاصيت شامل ڪري سگهون ٿا، ان کي ڪجهه نالو ڏيو، ۽ حقيقت ۾، اعتراض پاڻ، جنهن کي اسين ڏسڻ لاء منتقل ڪرڻ چاهيندا آهيون . ان حقيقت جي ڪري ته جڏهن عمل جي عمل کي هڪ servlet کان هڪ ڏيک ڏانهن منتقل ڪيو وڃي ٿو، اسان اتي ساڳيا درخواست ۽ جوابي شيون پاس ڪريون ٿا جيڪي سرورٽ پاڻ وصول ڪيون آهن، پوء اسان جي نالن جي فهرست کي درخواست واري اعتراض ۾ شامل ڪندي، اسان پوء هن درخواست مان ڪري سگھون ٿا. ڏسڻ ۾ اعتراض اسان جي صارفين جي نالن جي فهرست ٺاهيو ۽ حاصل ڪريو. اسان ListServlet ڪلاس سان ڪيو آهي ، تنهنڪري هتي سڄي طبقي لاء ڪوڊ آهي:

package app.servlets;

import app.model.Model;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.List;

public class ListServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        Model model = Model.getInstance();
        List<String> names = model.list();
        req.setAttribute("userNames", names);

        RequestDispatcher requestDispatcher = req.getRequestDispatcher("views/list.jsp");
        requestDispatcher.forward(req, resp);
    }
}

jsp فائلن ۾ جاوا ڪوڊ تي عمل ڪرڻ

اهو list.jsp فائل تي ڪم شروع ڪرڻ جو وقت آهي . اهو صرف تڏهن عمل ڪندو جڏهن ListServlet هتي عملدرآمد جي عمل کي گذري ٿو. ان کان علاوه، انهي سرورليٽ ۾ اسان اڳ ۾ ئي ماڊل مان صارف جي نالن جي هڪ فهرست تيار ڪئي آهي ۽ ان کي هتي درخواست اعتراض ۾ پاس ڪيو آهي. جيئن ته اسان وٽ نالن جي هڪ فهرست آهي، اسان ان جي ذريعي لوپ ڪري سگهون ٿا ۽ هر نالو ڇپائي سگهون ٿا. جيئن مون اڳ ۾ چيو آهي، jsp فائلون جاوا ڪوڊ تي عمل ڪري سگهن ٿيون (جيڪو انهن کي جامد html صفحن کان مختلف بڻائي ٿو). ڪجھ ڪوڊ تي عمل ڪرڻ لاء، اھو ڪافي آھي ھيٺ ڏنل تعمير کي جڳھ ۾ رکڻ لاء جيڪو اسان کي ضرورت آھي:

<!-- html code -->
<%
    // java code
%>
<!-- html code -->

هن تعمير جي اندر اسان وٽ ڪيترن ئي متغيرن تائين رسائي آهي:

درخواست اسان جي درخواست اعتراض آهي، جيڪو اسان servlet مان گذريو آهي، جتي اهو صرف سڏيو ويندو هو req ؛
ردعمل - جوابي اعتراض، جنهن کي servlet ۾ resp سڏيو ويندو آهي ؛
out JspWriter قسم جو هڪ اعتراض آهي (معمولي رائٽر کان ورثي ۾ مليل آهي )، جنهن جي مدد سان اسان ڪنهن به شيءِ کي سڌو سنئون html صفحي ۾ ئي لکي سگھون ٿا. out.println("Hello world!") داخلا System.out.println("Hello world!") جي داخلا سان تمام گهڻي مشابهت رکي ٿي ، پر ٻنھي کي پاڻ ۾ ضم نه ڪريو!
out.println() html پيج تي “لکي ٿو”، ۽ System.out.println سسٽم آئوٽ تي لکندو آهي. جيڪڏھن توھان سڏين ٿا jsp طريقو System.out.println() سيڪشن اندر جاوا ڪوڊ سان ، توھان ڏسندا نتيجن کي Tomcat ڪنسول ۾ ، ۽ صفحي تي نه.

توھان jsp جي اندر موجود ٻيون شيون ڳولي سگھوٿا ھتي . درخواست اعتراض استعمال ڪندي ، اسان نالن جي لسٽ حاصل ڪري سگھون ٿا جيڪي servlet مان منظور ڪيا ويا آھن (اسان ھن اعتراض سان لاڳاپيل وصف ڳنڍيو آھي)، ۽ out object استعمال ڪندي ، اسان انھن نالن کي ڏيکاري سگھون ٿا. اچو ته اهو ڪريون (هاڻي صرف html لسٽ جي صورت ۾):

<ul>
    <%
        List<String> names = (List<String>) request.getAttribute("userNames");

        if (names != null && !names.isEmpty()) {
            for (String s : names) {
                out.println("<li>" + s + "</li>");
            }
        }
    %>
</ul>

جيڪڏهن توهان کي صرف هڪ فهرست ڏيکارڻ جي ضرورت آهي جيڪڏهن اتي استعمال ڪندڙ آهن، ۽ ٻي صورت ۾ هڪ ڊيڄاريندڙ ڏيکاري ٿو ته اڃا تائين ڪو به استعمال ڪندڙ نه آهن، اسان هن حصي کي ٿورو ٻيهر لکي سگھون ٿا:

<%
    List<String> names = (List<String>) request.getAttribute("userNames");

    if (names != null && !names.isEmpty()) {
        out.println("<ui>");
        for (String s : names) {
            out.println("<li>" + s + "</li>");
        }
        out.println("</ui>");
    } else out.println("<p>There are no users yet!</p>");
%>

هاڻي ته اسان ڊيٽا کي servlets کان نظارن ڏانهن منتقل ڪري سگهون ٿا، اسان پنهنجي AddServlet کي ٿورو بهتر ڪري سگهون ٿا ته جيئن هڪ نوٽيفڪيشن ڏيکاري ٿي جڏهن صارف ڪاميابي سان شامل ڪيو ويو آهي. ائين ڪرڻ لاءِ، doPost() طريقي ۾ ، ماڊل ۾ نئين يوزر کي شامل ڪرڻ کان پوءِ، اسان req اعتراض جي خاصيتن ۾ ھن صارف جو نالو شامل ڪري سگھون ٿا ۽ ڪنٽرول واپس add.jsp ڏيک ڏانھن منتقل ڪري سگھون ٿا . ۽ ان ۾ اڳ ۾ ئي جاوا ڪوڊ سان ھڪڙو سيڪشن ٺاھيو جنھن ۾ چيڪ ڪيو ويو آھي ته ڇا ڪا خاص خصوصيت درخواست ۾ آھي، ۽ جيڪڏھن آھي، ته پوء ھڪڙو پيغام ٻاھر ڪڍو جيڪو بيان ڪري ٿو ته صارف ڪاميابيء سان شامل ڪيو ويو آھي. انهن تبديلين کان پوء، مڪمل AddServlet servlet ڪوڊ ڪجهه هن طرح نظر ايندو:

package app.servlets;

import app.entities.User;
import app.model.Model;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class AddServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        RequestDispatcher requestDispatcher = req.getRequestDispatcher("views/add.jsp");
        requestDispatcher.forward(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String name = req.getParameter("name");
        String password = req.getParameter("pass");
        User user = new User(name, password);
        Model model = Model.getInstance();
        model.add(user);

        req.setAttribute("userName", name);
        doGet(req, resp);
    }
}

هتي، doPost() طريقي جي آخر ۾ ، اسان ماڊل ۾ شامل ڪيل صارف جي نالي سان هڪ وصف مقرر ڪيو، جنهن کان پوء اسان کي سڏين ٿا doGet() طريقو ، جنهن ۾ اسان موجوده درخواست ۽ جواب کي پاس ڪريون ٿا. ۽ doGet() طريقو اڳ ۾ ئي ڪنٽرول کي ڏسڻ ڏانهن منتقل ڪري ٿو، جتي اهو شامل ڪيل صارف جي نالي سان هڪ وصف جي طور تي ڳنڍيل هڪ درخواست اعتراض موڪلي ٿو. باقي رهي ٿو ته add.jsp کي درست ڪرڻ لاءِ ته جيئن اها اهڙي نوٽيفڪيشن ڏيکاري جيڪڏهن اهڙي خاصيت موجود هجي. آخري add.jsp آهي :

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>Add new user</title>
    </head>

    <body>
        <div>
            <h1>Super app!</h1>
        </div>

        <div>
            <%
                if (request.getAttribute("userName") != null) {
                    out.println("<p>User '" + request.getAttribute("userName") + "' added!</p>");
                }
            %>
            <div>
                <div>
                    <h2>Add user</h2>
                </div>

                <form method="post">
                    <label>Name:
                        <input type="text" name="name"><br />
                    </label>
                    <label>Password:
                        <input type="password" name="pass"><br />
                    </label>
                    <button type="submit">Submit</button>
                </form>
            </div>
        </div>

        <div>
            <button onclick="location.href='/'">Back to main</button>
        </div>
    </body>
</html>

صفحي جي جسم تي مشتمل آهي:

div-a header سان؛
مواد لاءِ div ڪنٽينر، اهو چيڪ ڪري ٿو ته ڇا صارف نالي سان هڪ خاصيت موجود آهي؛
صارفين کي شامل ڪرڻ لاء هڪ فارم سان div؛
۽ آخر ۾ ھڪڙو فوٽر آھي ھڪڙي بٽڻ سان مکيه صفحي ڏانھن موٽڻ لاء.

اهو لڳي سگھي ٿو ته اتي تمام گھڻا ڊويزن آھن، پر اسين انھن کي بعد ۾ استعمال ڪنداسين جڏھن اسان اسٽائل شامل ڪنداسين. آخري فهرست.jsp آهي:

<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>Users</title>
    </head>

    <body>
        <div>
            <h1>Super app!</h1>
        </div>

        <div>
            <div>
                <div>
                    <h2>Users</h2>
                </div>
                <%
                    List<String> names = (List<String>) request.getAttribute("userNames");

                    if (names != null && !names.isEmpty()) {
                        out.println("<ui>");
                        for (String s : names) {
                            out.println("<li>" + s + "</li>");
                        }
                        out.println("</ui>");
                    } else out.println("<p>There are no users yet!</p>");
                %>
            </div>
        </div>

        <div>
            <button onclick="location.href='/'">Back to main</button>
        </div>
    </body>
</html>

اهڙيء طرح، اسان وٽ هڪ مڪمل طور تي ڪم ڪندڙ ويب ايپليڪيشن آهي جيڪا صارفين کي ذخيرو ۽ شامل ڪري سگهي ٿي، انهي سان گڏ انهن جي نالن جي فهرست ڏيکاري ٿي. باقي اهو آهي ته ان کي سينگاريو ... :)

انداز شامل ڪرڻ. اسان W3.CSS فريم ورڪ استعمال ڪندا آهيون

هن وقت اسان جي ايپليڪيشن ڪم ڪري رهي آهي، پر بلڪل چريو. تنهن ڪري، اسان هڪ پس منظر شامل ڪنداسين، متن جو رنگ ۽ بٽڻ، طرز جي فهرست، ترتيب ڏيو، انڊنٽ شامل ڪريو، ۽ جھڙوڪ. جيڪڏهن توهان هٿرادو انداز لکندا آهيو، اهو تمام گهڻو وقت ۽ اعصاب وٺي سگھي ٿو. ان ڪري، مان W3.CSS CSS فريم ورڪ استعمال ڪرڻ جي صلاح ڏيان ٿو. ان ۾ اڳ ۾ ئي تيار ڪيل ڪلاس موجود آهن انداز سان؛ باقي اهو آهي ته سي ايس ايس ڪلاسن کي رکڻ لاءِ جيڪي اسان صحيح هنڌن تي لاڳو ڪرڻ چاهيون ٿا. انھن کي اسان جي صفحن ۾ شامل ڪرڻ لاءِ، پھريائين اسان ھڪڙي فائل کي شامل ڪنداسين انداز سان. اهو ٻن طريقن سان ڪري سگهجي ٿو:

اسان جي صفحن ذريعي وڃو ۽ هيڊ سيڪشن ۾ داخل ڪريو ھڪڙي سڌي ڪڙي فائل سان اسٽائل سان

<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

هي اختيار مناسب آهي جيڪڏهن توهان وٽ مسلسل انٽرنيٽ ڪنيڪشن آهي. پوء، جڏهن توهان مقامي سرور تي پنهنجا صفحا کوليو ٿا، انداز انٽرنيٽ تان کڄي ويندا.

جيڪڏهن توهان چاهيو ٿا ته سڀئي اسٽائل مقامي طور تي هجن ۽ انٽرنيٽ ڪنيڪشن تي منحصر نه هجن، فائلن سان گڏ ڊائون لوڊ ڪريو ۽ ان کي ويب فولڊر جي اندر ڪٿي رکو (مثال طور، web/styles/w3.css )، پوء اسان جي سڀني ذريعي وڃو صفحا ( index.html, add.jsp, list.jsp ) ۽ هيڊ سيڪشن اندر اسلوب سان هن فائل جي لنڪ داخل ڪريو

<link rel="stylesheet" href="styles/w3.css">

ان کان پوء، صرف ٽيگ ذريعي وڃو ۽ انداز شامل ڪريو جيڪي توھان پسند ڪريو. مان ان تي تفصيل سان نه ڳالهائيندس، پر فوري طور تي منهنجي ٽن فائلن جا تيار ڪيل ورجن ترتيب ڏنل انداز جي ڪلاسن سان ڏيندس.

index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Super app!</title>
        <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    </head>

    <body class="w3-light-grey">
        <div class="w3-container w3-blue-grey w3-opacity w3-right-align">
            <h1>Super app!</h1>
        </div>

        <div class="w3-container w3-center">
            <div class="w3-bar w3-padding-large w3-padding-24">
                <button class="w3-btn w3-hover-light-blue w3-round-large" onclick="location.href='/list'">List users</button>
                <button class="w3-btn w3-hover-green w3-round-large" onclick="location.href='/add'">Add user</button>
            </div>
        </div>
    </body>
</html>

add.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>Add new user</title>
        <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    </head>

    <body class="w3-light-grey">
        <div class="w3-container w3-blue-grey w3-opacity w3-right-align">
            <h1>Super app!</h1>
        </div>

        <div class="w3-container w3-padding">
            <%
                if (request.getAttribute("userName") != null) {
                    out.println("<div class=\"w3-panel w3-green w3-display-container w3-card-4 w3-round\">\n" +
                            "   <span onclick=\"this.parentElement.style.display='none'\"\n" +
                            "   class=\"w3-button w3-margin-right w3-display-right w3-round-large w3-hover-green w3-border w3-border-green w3-hover-border-grey\">×</span>\n" +
                            "   <h5>User '" + request.getAttribute("userName") + "' added!</h5>\n" +
                            "</div>");
                }
            %>
            <div class="w3-card-4">
                <div class="w3-container w3-center w3-green">
                    <h2>Add user</h2>
                </div>
                <form method="post" class="w3-selection w3-light-grey w3-padding">
                    <label>Name:
                        <input type="text" name="name" class="w3-input w3-animate-input w3-border w3-round-large" style="width: 30%"><br />
                    </label>
                    <label>Password:
                        <input type="password" name="pass" class="w3-input w3-animate-input w3-border w3-round-large" style="width: 30%"><br />
                    </label>
                    <button type="submit" class="w3-btn w3-green w3-round-large w3-margin-bottom">Submit</button>
                </form>
            </div>
        </div>

        <div class="w3-container w3-grey w3-opacity w3-right-align w3-padding">
            <button class="w3-btn w3-round-large" onclick="location.href='/'">Back to main</button>
        </div>
    </body>
</html>

list.jsp

<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>Users list</title>
        <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    </head>

    <body class="w3-light-grey">
        <div class="w3-container w3-blue-grey w3-opacity w3-right-align">
            <h1>Super app!</h1>
        </div>

        <div class="w3-container w3-center w3-margin-bottom w3-padding">
            <div class="w3-card-4">
                <div class="w3-container w3-light-blue">
                    <h2>Users</h2>
                </div>
                <%
                    List<String> names = (List<String>) request.getAttribute("userNames");

                    if (names != null && !names.isEmpty()) {
                        out.println("<ul class=\"w3-ul\">");
                        for (String s : names) {
                            out.println("<li class=\"w3-hover-sand\">" + s + "</li>");
                        }
                        out.println("</ul>");

                    } else out.println("<div class=\"w3-panel w3-red w3-display-container w3-card-4 w3-round\">\n"
+
                            "   <span onclick=\"this.parentElement.style.display='none'\"\n" +
                            "   class=\"w3-button w3-margin-right w3-display-right w3-round-large w3-hover-red w3-border w3-border-red w3-hover-border-grey\">×</span>\n" +
                            "   <h5>There are no users yet!</h5>\n" +
                            "</div>");
                %>
            </div>
        </div>

        <div class="w3-container w3-grey w3-opacity w3-right-align w3-padding">
            <button class="w3-btn w3-round-large" onclick="location.href='/'">Back to main</button>
        </div>
    </body>
</html>

اھو سڀ آھي :) جيڪڏھن توھان اڃا تائين ڪي سوال آھن يا ڪي رايا آھن، يا ان جي ابتڙ، ڪجھ ڪم نٿو ڪري - ھڪڙو تبصرو ڇڏي ڏيو. UPD: جيڪڏهن توهان کي 404 غلطين سان مسئلو آهي جڏهن بٽڻ تي ڪلڪ ڪريو، جيتوڻيڪ سڀ ڪجهه صحيح طريقي سان ڪيو ويو، شايد توهان کي خيال ۾ ترتيب ڏيڻ واري ترتيب کي درست ڪرڻ گهرجي. هن کي ڪرڻ لاءِ، توهان کي وڃڻ جي ضرورت آهي ايڊيٽ ڪنفيگريشنز (شروعاتي بٽڻ جي ويجھو مٿي تي)، ونڊو جي ساڄي پاسي ڊيپلائيمينٽ ٽئب ڏانهن وڃو ۽ پڪ ڪريو ته ايپليڪيشن جي حوالي سان اهو صرف اشارو ڪيو ويو آهي / خير، مان. هن سڀني مان ڇا نڪتو ان جا ڪجهه اسڪرين شاٽ ڳنڍيندا.

servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (حصو 2) - 2

servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (حصو 2) - 3

servlets ۽ jsp استعمال ڪندي هڪ سادي ويب ايپليڪيشن ٺاهڻ (حصو 2) - 4

۽ آخرڪار ، جيڪڏهن توهان هن منصوبي سان مشق ڪرڻ چاهيو ٿا، توهان ڪوشش ڪري سگهو ٿا:

هڪ صارف کي حذف ڪرڻ لاءِ servlet ۽ jsp ٺاهيو ۽ موجوده صارف کي تبديل ڪرڻ/ايڊٽ ڪرڻ لاءِ ڪجهه وڌيڪ. توھان حاصل ڪندا ھڪ حقيقي CrUD ويب ايپليڪيشن :) servlets تي));
لسٽ (فهرست) کي ڊيٽابيس سان ڪم ڪرڻ سان تبديل ڪريو ته جيئن شامل ڪيل صارف سرور کي ٻيهر شروع ڪرڻ کان پوء غائب نه ٿين :)

سدا خوشقسمت رهو!

ٻيو ڇا پڙهو:

IntelliJ Idea Enterprise ۾ هڪ سادي ويب پروجيڪٽ ٺاهڻ. قدم بہ قدم، تصويرن سان

منهنجي چيٽ

تبصرا

TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION