JavaRush /Blog Java /Random-MS /Mencipta aplikasi web mudah menggunakan servlets dan jsp ...
fatfaggy
Tahap
Киев

Mencipta aplikasi web mudah menggunakan servlets dan jsp (bahagian 2)

Diterbitkan dalam kumpulan
Saya terus menerangkan proses mencipta aplikasi web menggunakan servlets, jsp, Maven dan Tomcat. Permulaan artikel , jika perlu.
Kami mencipta entiti.
Mari buat kelas Pengguna dalam pakej entiti, di mana kita akan mencipta dua nama pembolehubah rentetan peribadi dan kata laluan. Mari buat pembina (lalai dan satu yang akan menerima kedua-dua nilai), getter/setter, mengatasi kaedah toString() untuk berjaga-jaga, serta kaedah equals() dan 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; } } Kini kami boleh mula membuat senarai pengguna, tempat kami akan menambah pengguna kami, dan dari mana kami akan membawa mereka untuk paparan. Tetapi ada masalah. Kami tidak mencipta objek servlet kami; Tomcat menciptanya untuk kami. Kaedah yang kami timpa di dalamnya juga telah ditakrifkan untuk kami dan kami tidak boleh menambah parameter. Bagaimanakah kita boleh membuat senarai biasa yang boleh dilihat dalam kedua-dua servlet kita? Jika kami hanya mencipta objek senarai kami sendiri dalam setiap servlet, ternyata kami akan menambah pengguna ke satu senarai, tetapi memaparkan senarai pengguna menggunakan servlet ListServlet akan berbeza sama sekali. Ternyata kita memerlukan objek yang biasa untuk kedua-dua servlet. Secara amnya, kami memerlukan objek yang biasa kepada semua kelas dalam program kami; satu-satunya objek untuk keseluruhan program. Saya harap anda pernah mendengar sesuatu tentang corak reka bentuk. Dan mungkin bagi sesetengah orang ini adalah keperluan sebenar pertama untuk menggunakan templat Singleton dalam program mereka. Anda boleh menjadi kreatif dan membuat beberapa singleton yang keren, dengan semakan dua kali dan penyegerakan (ya, kami mempunyai aplikasi berbilang benang, kerana Tomcat menjalankan servlet dalam benang yang berbeza), tetapi saya akan menggunakan pilihan dengan permulaan awal, kerana dalam kes ini ia cukup sesuai.
Mencipta model.
Kemudian kami akan mencipta kelas (dan melaksanakan templat tunggal di dalamnya) dalam pakej model, dan kami juga akan memanggilnya Model yang agak berwarna-warni. Mari buat objek senarai pengguna peribadi di dalamnya, dan buat dua kaedah: satu supaya anda boleh menambah pengguna, dan yang kedua - biarkan ia hanya mengembalikan senarai rentetan (nama pengguna). Memandangkan objek pengguna kami terdiri daripada nama dan kata laluan, kami tidak mahu "mendedahkan" kata laluan pengguna, jadi kami hanya akan mengembalikan senarai nama mereka. public class Model { private static Model instance = new Model(); private List model; public static Model getInstance() { return instance; } private Model() { model = new ArrayList<>(); } public void add(User user) { model.add(user); } public List list() { return model.stream() .map(User::getName) .collect(Collectors.toList()); } }
Sedikit tentang mvc.
Memandangkan anda pernah mendengar tentang singleton, ini bermakna anda mungkin pernah mendengar tentang corak reka bentuk lain - MVC (model-view-controller, atau dalam model-view-controller Rusia, atau sama seperti dalam model-view-controller bahasa Inggeris). Intipatinya adalah untuk memisahkan logik perniagaan daripada pembentangan. Iaitu, asingkan kod yang menentukan perkara yang perlu dilakukan daripada kod yang menentukan cara untuk memaparkan . Paparan (pandangan atau hanya pandangan) bertanggungjawab ke atas bentuk di mana beberapa data dibentangkan. Dalam kes kami, paparan ialah halaman JSP kami. Itulah sebabnya saya meletakkannya dalam folder yang dipanggil pandangan. Model ialah data sebenar yang digunakan oleh program ini. Dalam kes kami, ini adalah pengguna (senarai pengguna). Nah, pengawal adalah pautan penghubung antara mereka. Mereka mengambil data daripada model dan memindahkannya ke paparan, atau mereka menerima beberapa data daripada Tomcat, memprosesnya dan memindahkannya ke model. Logik perniagaan (iaitu, apa yang perlu dilakukan ) harus diterangkan di dalamnya, dan bukan dalam model atau dalam pandangan. Oleh itu, setiap orang melakukan perkara mereka sendiri:
  • model menyimpan data
  • Pandangan melukis perwakilan data yang indah
  • pengawal memproses data
Ini membolehkan mereka semua menjadi agak mudah dan boleh diselenggara. Dan bukan pembuangan semua kod dalam satu kelas. MVC bukan sahaja sesuai untuk pengaturcaraan web, tetapi ia masih sangat biasa (jika tidak selalu) di kawasan ini. Dalam kes kami, servlet akan bertindak sebagai pengawal. Ya, ini adalah penerangan yang sangat dangkal dan kasar tentang corak ini, tetapi artikel ini bukan mengenai corak reka bentuk, tetapi tentang cara membuat aplikasi web yang mudah :) Siapa yang ingin mengetahui lebih lanjut - Google mengetahui segala-galanya ! :) Mari kita kembali kepada pandangan kita.
Buat borang untuk menambah pengguna.
Mari tambahkan borang pada fail add.jsp, yang terdiri daripada dua input teks (satu biasa, satu lagi jenis kata laluan) dan butang untuk menghantar data ke pelayan. Di sini borang mempunyai atribut kaedah dengan siaran nilai. Ini bermakna data daripada borang ini akan dihantar ke pelayan dalam bentuk permintaan POST. Atribut tindakan tidak ditentukan, yang bermaksud permintaan ini akan pergi ke alamat yang sama di mana kami pergi ke halaman ini (/add). Oleh itu, servlet kami, yang terikat pada alamat ini, apabila menerima permintaan GET, mengembalikan jsp ini dengan borang untuk menambah pengguna, dan jika ia menerima permintaan POST, maka borang ini telah menghantar datanya ke sana (yang akan kami dapatkan daripada objek permintaan dalam kaedah doPost() , proses dan pindahkannya ke model untuk disimpan). Perlu diingat bahawa input mempunyai parameter nama di sini (untuk medan dengan nama ia mempunyai nama nilai, dan untuk medan dengan kata laluan ia mempunyai pas nilai). Ini adalah perkara yang cukup penting. Oleh kerana untuk mendapatkan data ini (nama dan kata laluan yang akan dimasukkan) daripada permintaan (sudah di dalam servlet), kami akan menggunakan nama dan pas ini dengan tepat. Tetapi lebih lanjut mengenai itu kemudian. Butang untuk menghantar data itu sendiri sekali lagi dibuat dalam bentuk butang, dan bukan input, seperti biasa. Saya tidak tahu betapa universalnya pilihan ini, tetapi ia berfungsi untuk saya dalam Chrome :)
Memproses permintaan POST dengan servlet.
Mari kembali ke servlet AddServlet. Kami sudah tahu bahawa untuk servlet kami dapat "menangkap" permintaan GET, kami mengatasi kaedah doGet() daripada kelas HttpServlet. Untuk mengajar servlet kami untuk menangkap permintaan POST, kami juga mengatasi kaedah doPost(). Ia menerima permintaan dan objek respons yang serupa daripada Tomcat, yang akan kami bekerjasama. Mula-mula, mari kita ekstrak dari permintaan nama dan lulus parameter yang dihantar oleh borang (jika anda menamakannya secara berbeza dalam borang, maka itu adalah nama yang anda tulis). Kemudian kami akan membuat objek pengguna kami menggunakan data yang diterima. Kemudian kita akan mendapat objek model dan menambah pengguna yang dibuat pada model. @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); }
Memindahkan data ke paparan.
Sekarang mari kita beralih ke servlet ListServlet. Kami telah pun melaksanakan kaedah doGet(), yang hanya memindahkan kawalan ke paparan list.jsp. Jika anda belum mempunyai ini, lakukannya dengan analogi dengan kaedah yang sama dari servlet AddServlet. Sekarang adalah baik untuk mendapatkan senarai nama pengguna daripada model dan menyerahkannya ke paparan, yang akan menerimanya di sana dan memaparkannya dengan baik. Untuk melakukan ini, kami sekali lagi akan menggunakan objek permintaan yang kami terima daripada Tomcat. Kita boleh menambah atribut pada objek ini, memberikannya beberapa nama dan, sebenarnya, objek itu sendiri yang ingin kita pindahkan ke paparan. Disebabkan fakta bahawa apabila memindahkan proses pelaksanaan dari servlet ke paparan, kami meneruskan permintaan dan objek respons yang sama yang diterima oleh servlet itu sendiri, kemudian dengan menambahkan senarai nama kami ke objek permintaan, kami boleh dari permintaan ini objek dalam paparan buat senarai nama pengguna kami dan dapatkan. Kami telah selesai dengan kelas ListServlet, jadi berikut ialah kod untuk keseluruhan kelas. 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 names = model.list(); req.setAttribute("userNames", names); RequestDispatcher requestDispatcher = req.getRequestDispatcher("views/list.jsp"); requestDispatcher.forward(req, resp); } }
Melaksanakan kod java dalam fail jsp.
Sekarang mari kita beralih ke fail list.jsp. Fail ini hanya akan dilaksanakan apabila ListServlet melepasi proses pelaksanaan di sini. Di samping itu, dalam servlet itu kami telah menyediakan senarai nama pengguna daripada model dan menyampaikannya di sini dalam objek permintaan. Memandangkan senarai nama, kita boleh menjalankan gelung for melaluinya dan mencetak setiap nama. Seperti yang telah saya katakan, fail jsp boleh melaksanakan kod java (pada dasarnya, inilah yang menjadikannya berbeza daripada halaman html statik). Untuk melaksanakan beberapa kod, cukup untuk meletakkan pembinaan di tempat yang kami perlukan. <% // java code %> Di dalam pembinaan sedemikian, kami mendapat akses kepada beberapa pembolehubah: permintaan - objek permintaan kami, yang kami lalui dari servlet, di mana ia hanya dipanggil respons req - objek tindak balas, dalam Servlet dipanggil resp out - objek jenis JspWriter (diwarisi daripada Penulis biasa), dengan bantuannya kita boleh "menulis" sesuatu terus ke dalam halaman html itu sendiri. Out.println("Hello world!") sangat serupa dengan System.out.println("Hello world!"), tetapi jangan mengelirukan mereka! out.println() "menulis" ke halaman html dan System.out.println - ke output sistem. Jika anda memanggil kaedah System.out.println() di dalam bahagian dengan kod jsp, anda akan melihat hasilnya dalam konsol Tomcat, dan bukan pada halaman, seperti yang anda mahu :) Anda boleh mencari objek lain yang tersedia di dalam jsp di sini . Menggunakan objek permintaan kita boleh mendapatkan senarai nama yang telah diluluskan daripada servlet (kami melampirkan atribut yang sepadan dengan objek ini), dan menggunakan objek keluar kita boleh memaparkan nama-nama ini. Mari lakukan ini buat masa ini hanya dalam bentuk senarai html: Jika kita mahu memaparkan senarai hanya apabila terdapat pengguna, dan sebaliknya memaparkan amaran bahawa tiada pengguna lagi, kita boleh menulis semula bahagian ini sedikit: Sekarang kita tahu cara memindahkan data daripada servlet ke paparan - kami boleh menambah baik AddServlet kami sedikit supaya pemberitahuan dipaparkan tentang penambahan pengguna yang berjaya. Untuk melakukan ini, dalam kaedah doPost(), selepas menambah pengguna baharu pada model, kita boleh menambah nama pengguna ini pada atribut objek req dan lulus kawalan kembali ke paparan add.jsp. Dan di dalamnya sudah membuat bahagian dengan kod Java, di mana anda boleh menyemak sama ada atribut sedemikian ada dalam permintaan, dan jika ya, kemudian paparkan mesej bahawa pengguna telah berjaya ditambahkan. Selepas perubahan ini, kod lengkap servlet AddServlet akan kelihatan seperti ini: Di ​​sini, pada penghujung kaedah doPost(), kami menetapkan atribut dengan nama pengguna yang ditambahkan pada model, dan kemudian memanggil doGet( ) kaedah, yang kami luluskan permintaan dan respons semasa. Dan kaedah doGet() sudah memindahkan kawalan ke paparan, di mana ia menghantar objek permintaan dengan nama pengguna tambahan dilampirkan sebagai atribut. Ia kekal untuk membetulkan add.jsp itu sendiri supaya ia memaparkan pemberitahuan sedemikian jika atribut sedemikian wujud. add.jsp akhir
    <% List names = (List ) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { for (String s : names) { out.println("
  • " + s + "
  • "); } } %>
<% List names = (List ) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println(" "); for (String s : names) { out.println("
  • " + s + "
  • "); } out.println("
    "); } else out.println("

    There are no users yet!

    "); %>
    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); } } <%@ page contentType="text/html;charset=UTF-8" language="java" %> Add new user

    Super app!

    <% if (request.getAttribute("userName") != null) { out.println("

    User '" + request.getAttribute("userName") + "' added!

    "); } %>

    Add user

    Badan halaman terdiri daripada div dengan pengepala, diikuti dengan bekas div untuk kandungan, menyemak sama ada atribut dengan nama pengguna wujud di dalamnya, kemudian div dengan borang untuk menambah pengguna, dan pada akhir pengaki dengan butang untuk kembali ke halaman utama. Ia mungkin kelihatan seperti terdapat terlalu banyak div, tetapi kami akan menggunakannya kemudian apabila kami menambah gaya :) Nah, versi terakhir ialah list.jsp. Oleh itu , kami mempunyai aplikasi web yang berfungsi sepenuhnya yang boleh menyimpan dan menambah pengguna, juga sebagai memaparkan senarai nama mereka. Yang tinggal hanyalah untuk menghiasinya... :) <%@ page import="java.util.List" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %> Users

    Super app!

    Users

    <% List names = (List ) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println(" "); for (String s : names) { out.println("
  • " + s + "
  • "); } out.println("
    "); } else out.println("

    There are no users yet!

    "); %>
    Menambah gaya. Kami menggunakan rangka kerja W3.CSS.
    Pada masa ini, aplikasi kami berfungsi, tetapi benar-benar gila :) Kami perlu menambah latar belakang, warna untuk teks dan butang, menggayakan senarai, melakukan penjajaran, menambah inden, secara umum banyak perkara. Jika anda menulis gaya secara manual, ia boleh mengambil banyak masa dan saraf. Oleh itu, saya cadangkan menggunakan rangka kerja CSS W3.CSS . Ia sudah mempunyai kelas siap pakai dengan gaya; yang tinggal hanyalah meletakkan kelas CSS di tempat yang betul yang kami mahu gunakan di tempat ini. Untuk menambahkannya pada halaman kami, mula-mula kami perlu memasukkan fail dengan gaya. Ini boleh dilakukan dengan dua cara: 1. pergi melalui halaman kami dan dalam bahagian kepala masukkan pautan terus ke fail dengan gaya. Pilihan ini sesuai jika anda mempunyai sambungan Internet yang berterusan. Kemudian, apabila anda membuka halaman anda pada pelayan tempatan, gaya akan ditarik dari Internet. 2. Jika anda ingin mempunyai semua gaya secara setempat dan tidak bergantung pada sambungan Internet, anda boleh memuat turun fail dengan gaya dan letakkannya di suatu tempat di dalam folder web (contohnya web/styles/w3.css), dan kemudian pergi melalui semua halaman kami (index.html, add.jsp, list.jsp) dan masukkan pautan ke fail ini dengan gaya di dalam bahagian kepala. Selepas itu, hanya melalui teg dan tag mereka dengan gaya yang anda suka . Saya tidak akan memikirkan perkara ini secara terperinci, tetapi akan segera memberikan versi siap saya bagi tiga fail saya dengan kelas gaya tersusun. index.html add.jsp list.jsp Itu sahaja :) Jika anda masih mempunyai sebarang soalan atau mempunyai sebarang ulasan, atau sebaliknya, sesuatu tidak berjaya - tinggalkan ulasan. Baiklah, saya akan melampirkan beberapa tangkapan skrin tentang perkara yang terhasil daripada semuanya. Dan akhirnya. Jika anda ingin berlatih dengan projek ini, anda boleh mencuba: Super app!

    Super app!

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

    Super app!

    <% if (request.getAttribute("userName") != null) { out.println("
    \n" + " ×\n" + "
    User '" + request.getAttribute("userName") + "' added!
    \n" + "
    "); } %>

    Add user

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

    Super app!

    Users

    <% List names = (List ) request.getAttribute("userNames"); if (names != null && !names.isEmpty()) { out.println("
      "); for (String s : names) { out.println("
    • " + s + "
    • "); } out.println("
    "); } else out.println("
    \n" + " ×\n" + "
    There are no users yet!
    \n" + "
    "); %>
    Laman utama aplikasi Tambah tetingkap pengguna senarai pengguna
    • buat servlet dan jsp untuk memadam pengguna dan beberapa lagi untuk menukar/mengedit pengguna sedia ada. Anda akan mendapat aplikasi web CrUD sebenar :) pada servlets))
    • ganti senarai (Senarai ) untuk bekerja dengan pangkalan data supaya pengguna yang ditambahkan tidak hilang selepas pelayan dimulakan semula :)
    Semoga berjaya!
    Komen
    TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
    GO TO FULL VERSION