Apa itu JSF? Memperkenalkan JavaServer Faces
JavaServer Faces (JSF) adalah teknologi standard Java untuk membina antara muka web berorientasikan acara berdasarkan komponen. Seperti JavaServer Pages (JSP), JSF membenarkan akses ke data dan logik sisi pelayan. Tidak seperti JSP, yang pada dasarnya merupakan halaman HTML yang dipenuhi dengan kemampuan sisi pelayan, JSF adalah dokumen XML yang mewakili komponen formal dalam pohon logik. Komponen JSF disokong oleh objek Java, yang bebas dari HTML dan memiliki kemampuan Java yang lengkap, termasuk mengakses API dan pangkalan data jauh.
Idea utama untuk rangka seperti JSF adalah merangkum (atau membungkus ) teknologi sisi klien seperti HTML, CSS, dan JavaScript, yang membolehkan pembangun membina antara muka web tanpa banyak interaksi dengan teknologi ini.
Artikel ini memaparkan gambaran ringkas pendekatan JSF terhadap pengembangan UI berasaskan komponen untuk aplikasi web Java. Contoh ringkas memperkenalkan seni bina, model acara, dan perpustakaan komponen JSF MVC. Contohnya merangkumi ciri baru di JSF 2.3, dan kami akan menggunakan PrimeFaces untuk perpustakaan komponen kami.
JSF Berkembang
Sudah lama popular, JSF baru-baru ini menghadapi persaingan dari kerangka web yang serasi dengan Java, termasuk kerangka kerja JavaScript di sisi pelanggan. Namun, JavaServer Faces tetap menjadi standard Java, terutama untuk pengembangan perusahaan Java berskala besar. Spesifikasi JSF juga telah menghasilkan banyak kerangka kerja dan perpustakaan, yang seiring dengan peningkatan sisi pelanggan baru-baru ini. Salah satunya adalah PrimeFaces, yang kami terokai dalam tutorial ini.
Walaupun jadual untuk pembangunan masa depan tidak jelas, JSF 2.3 memberikan banyak pembangun untuk bekerja sementara kita menunggu. Dilancarkan pada Mac 2017, JSF 2.3 sengaja dirancang untuk memodenkan JSF. Di antara beberapa ratus pembaikan kecil dan kemas kini yang lebih besar, JSF 2.3 menghentikan anotasi kacang yang diuruskan untuk menyokong CDI, yang akan saya perkenalkan kemudian dalam tutorial ini.
JSF 2.3 di Jakarta EE
Pada bulan September 2017, Oracle mengumumkan niatnya untuk mengalihkan Java EE ke Eclipse Foundation. Java EE sejak itu diganti menjadi Jakarta EE, dan JSF 2.3 (Eclipse Mojarra) telah diadopsi untuk kelanjutan. Pelepasan utama spesifikasi JSF seterusnya adalah Eclipse Mojarra 3.0.
Membina antara muka web berasaskan komponen di JSF
Idea teras JSF adalah merangkumi fungsi menjadi komponen yang boleh digunakan semula. Ini serupa dengan tag yang boleh digunakan semula yang digunakan dalam JSP, tetapi komponen JSF lebih formal.
Walaupun anda dapat menggunakan halaman JSF dalam JavaServer Pages, lebih biasa menggunakan Facelets untuk membina halaman JSF yang berdiri sendiri. Faset adalah halaman XHTML yang direka untuk menentukan antara muka JSF. Dengan Facelet, anda menggunakan tag XML untuk membuat pokok komponen yang menjadi perancah untuk antara muka pengguna JSF.
Penyenaraian 1 menunjukkan bahagian utama halaman JSF ringkas yang ditulis menggunakan Facelets. Dalam contoh ini kita mengakses kemampuan sisi pelayan Java melalui kacang yang diletakkan dalam ruang lingkup melalui CDI. Anda akan melihat lebih banyak mengenai CDI di kemudian hari.
Penyenaraian 1. Halaman contoh JSF
Hello JavaWorld! #{javaBean.content} Dalam Penyenaraian 1 kita melihat halaman XHTML standard. Paparan Facelets dibina di atas XHTML. Sebagai tambahan kepada ruang nama XHTML, ruang nama sekunder ditakrifkan dan dirujuk.
The hperpustakaan mengandungi komponen standard untuk digunakan dalam laman JSF HTML. The //xmlns.jcp.org/jsf/htmlperpustakaan mentakrifkan koleksi komponen JSF, dalam kes ini koleksi elemen HTML biasa. Salah satu komponen ini adalah unsur.
Komponen HTML di JSF
Dari segi sintaks, elemen Penyenaraian 1 merujuk jsf/htmlperpustakaan dengan hawalan. Kemudian merujuk komponen tertentu dalam perpustakaan, yang merupakan headkomponen.
The komponen output elemen kepala HTML. (Semua sintaks itu mungkin kelihatan berlebihan untuk tujuan sederhana, tetapi ada alasan yang baik untuknya, seperti yang akan anda lihat sebentar lagi.)
Komponen bersarang
Di dalam kepala terdapat elemen HTML standard . Elemen ini disediakan untuk komponen, bersama dengan elemen kandungan anak yang bersarang di dalamnya.
Dalam badan dokumen, ungkapan JSF terkandung dalam #{}sintaks. Ini sama persis dengan ekspresi JSP dengan ${}format: ia membenarkan akses objek Java dalam ruang lingkup, dan fungsi sederhana.
Pola asas untuk JSF adalah mudah: Gunakan Facelets untuk membina pohon XML yang merujuk perpustakaan komponen atau perpustakaan, kemudian gunakan komponen dalam perpustakaan untuk menjadikan objek Java sebagai HTML.
Menggunakan objek Java di JSF
Kembali ke Penyenaraian 1, perhatikan bahawa di dalam ekspresi JSF ( ${javaBean.content) javaBeanObjek berada dalam ruang lingkup ketika markup ini dijalankan. XHTML Facelet mengakses .contentharta benda pada javaBeanobjek. Output terakhir adalah antara muka web yang menggabungkan struktur pandangan Facelets dengan kemampuan data dan logik sisi pelayan Java.
Menggunakan ekspresi JSF adalah salah satu cara untuk mengakses data aplikasi Java dari antara muka pengguna JSF. Akhirnya, anda ingin meneroka cara lain komponen JSF dapat berinteraksi dengan backend Java - seperti senarai data dan grid dan pelbagai kawalan input. Buat masa ini, sudah cukup untuk menyerap bagaimana JSF menggunakan tag XML (atau anotasi) untuk membuat struktur komponen yang mengeluarkan HTML berdasarkan data yang terdapat dalam objek Java.
Anotasi vs XML
Dengan JSF 2.3 telah menjadi mungkin untuk menentukan komponen JSF dengan anotasi, menghindari metadata XML sepenuhnya. Sangat mungkin untuk menentukan dan menggunakan aplikasi JSF tanpa mengedit XML apa pun.
Struktur aplikasi JSF
Seperti JavaServer Pages dan Servlet API, JavaServer Faces memerlukan struktur dan metadata direktori standard. Ini digunakan sebagai fail .war .
Struktur fail .war serupa dengan aplikasi Servlet atau JSP. Ini berisi /web-appdirektori, yang menyimpan file markup aplikasi (dalam hal ini HTML, JSP, dan Facelets), serta /WEB-INFdirektori, yang menyajikan metadata untuk menggambarkan aplikasi.
Melayan JSF
Walaupun anda boleh menjalankan JSF dalam wadah Java EE seperti Glassfish, wadah servlet sederhana adalah yang anda perlukan. Tomcat adalah wadah yang popular untuk JSF dan teknologi Java yang lain dari pelayan.
JSF 2.3: Spesifikasi dan pelaksanaannya
Salah satu kelebihan Java adalah berdasarkan standard, dan standard tersebut diatur oleh proses open source komunitas. Sejak dimulakan, Java Community Process (JCP) telah mengawasi pengembangan teknologi Java. Setelah peningkatan spesifikasi atau spesifikasi dikembangkan dan disetujui oleh JCP, ia dapat dilaksanakan oleh pelbagai pihak. Sehingga baru-baru ini, Servlets, JSP, dan JSF semuanya dikembangkan menggunakan proses spesifikasi sumber terbuka JCP.
Spesifikasi JSF terbaru dari penulisan ini adalah JSF 2.3, dikeluarkan sebagai sebahagian daripada Java EE 8 pada tahun 2017. Oracle (sekarang Eclipse's) Mojarra adalah pelaksanaan rujukan JSF, dan MyFaces dan PrimeFaces adalah implementasi pihak ketiga yang popular.
Setiap kerangka ini menerapkan teras JSF, yang merangkumi beberapa komponen standard. Penjual juga boleh menawarkan perpustakaan komponen tambahan di atas standard. Semasa menilai kerangka kerja JSF, ada baiknya anda mempertimbangkan keperluan aplikasi anda dan perpustakaan komponen apa yang tersedia untuk membantu anda membuatnya. Sebaik-baiknya, kerangka JSF anda harus membuat anda sedekat mungkin dengan apa yang anda perlukan, langsung dari kotak.
MVC di JSF 2.3
JSF adalah kerangka MVC , menerapkan corak model-view-controller. Dalam corak MVC, idenya adalah untuk memisahkan tiga kebimbangan UI menjadi bahagian yang tidak berhati-hati, sehingga mereka lebih mudah dikendalikan. Secara umum, pandangan bertanggung jawab untuk menampilkan data dalam model, dan pengawal bertanggung jawab untuk mengatur model dan mengarahkan pengguna ke tampilan yang betul.
Dalam pelaksanaan JSF, paparan adalah halaman Facelets dengan set tag XMLnya. Ini menentukan susun atur antara muka pengguna. Separuh lagi penggunaan JSF adalah sisi pelayan, di mana Java mengembalikan komponen UI tersebut.
Kacang terurai tidak digunakan dalam JSF 2.3
Managed bean annotations have been deprecated in JSF 2.3, and replaced by CDI (Contexts and Dependency Injection). With CDI, developers define a context and inject objects to that context. Those familiar with managed beans will find the annotation syntax slightly different, but the semantics remain exactly the same.
Controller beans
In JSF 2.3, controller beans provide the controller part of the MVC equation. Normal Java objects (often called POJOs, or plain old Java objects) provide the model.
In terms of process flow, controller beans:
- Decide where to direct user requests
- Set up POJOs for the model
- Use the model to render the Facelets view
JSF then folds together the component tree and model to render the output HTML.
Penyenaraian 2 menunjukkan bagaimana anda akan menentukan javaBeanobjek dari Penyenaraian 1 menggunakan CDI. Penyenaraian ini menganggap aplikasi mempunyai cdi-api-1.2.jar dalam pergantungannya.
Penyenaraian 2. JavaBean yang ditentukan menggunakan CDI
import javax.inject.Named; import javax.enterprise.context.SessionScoped; @Named @ViewScoped public class JavaBean implements Serializable { private String content = ìWelcome to JSF!î // getters/setters } JSF 2.3 dengan PrimeFaces
Pada bahagian seterusnya saya akan menggunakan PrimeFaces untuk menunjukkan kepada anda bagaimana JSF menerapkan corak MVC, pemesejan berdasarkan acara, dan komponen yang boleh digunakan semula. Untuk memulakan, buka PrimeFaces Showcase, klik pautan Data di lajur sebelah kiri, dan pilih DataList . Ini akan menaikkan kod demo DataList untuk PrimeFaces.
Rajah 1 menunjukkan di mana anda mencari sampel ini.
Matthew Tyson
Gambar 2 menunjukkan output dari jadual data sederhana, yang diambil dari demo PrimeFaces DataList.
Matthew Tyson
PrimeFaces DataList: Mengakses model data
Listing 3 presents the markup for this dataList display. If you scroll to the bottom of the PrimeFaces showcase, you can see the markup in the dataList.xhtml tab.
Listing 3. Facelet for PrimeFaces DataList
Basic #{car.brand}, #{car.year} In Listing 3, notice the value property of the dataList component. You can see that this references a dataListView object, and accesses the .cars1 property on it. The component is going to use the model object returned by that field. JSF tokens use conventional accessors to reference object properties, so .cars1 will refer to the getCars() getter on the object.
Next, notice the var="car" property. This tells the dataList component what variable to use when it iterates over the list of cars returned by the value field. These properties are specific to the dataList component, but the value property is very common. The var attribute is also conventional for components that iterate over lists.
In the body of the component in Listing 3, you can see the car variable is accessed via JSF expressions like #{car.brand}. Each iteration of the dataListView.cars1 instance will output the car.brand field.
Notice that the tag demonstrates the ability to customize components for how they will display. In this case, the header is defined as Basic.
You can see how the Facelets XML will drive this output by combining the data with the markup. Now let's look at the Java code behind it.
DataList's server-side components
Listing 4 shows DataListView, the Java class that is used by the markup in Listing 3. You'll see shortly how the dataListView instance is associated with the DataListView class.
Listing 4. DataListView class
package org.primefaces.showcase.view.data; import java.io.Serializable; import java.util.List; import javax.annotation.PostConstruct; import javax.inject.Named; // Pre JSF 2.3, this was: // import javax.faces.bean.ManagedBean; import javax.inject.Inject; import javax.faces.bean.ViewScoped; import org.primefaces.showcase.domain.Car; import org.primefaces.showcase.service.CarService; @Named @ViewScoped public class DataListView implements Serializable { private List cars1; private Car selectedCar; @Inject("#{carService}") private CarService service; @PostConstruct public void init() { cars1 = service.createCars(10); } public List getCars1() { return cars1; } public void setService(CarService service) { this.service = service; } } Listing 4 has a few other important elements, which we'll consider piece by piece.
Dependency injection and annotations
First, notice that the DataListView class is annotated with @Named, which you can see from the import import javax.inject.Named; is part of JSF. The @Named annotation tells JSF this bean is part of the app. The @ViewScoped annotation informs JSF that the bean will live for just the life of the view.
Seterusnya, perhatikan bahawa CarServiceharta tanah mempunyai @Injectanotasi (disebut @ManagedPropertysebelum JSF 2.3). Ini adalah satu lagi ciri JSF yang membolehkan kacang "disatukan bersama", teknik yang dipopularkan oleh rangka Spring dan alat suntikan ketergantungan lain. Pada dasarnya, JSF akan mencari carServiceobjek dalam ruang lingkup dan mengaitkannya secara automatik ke servicemedan pada DataListViewobjek tersebut.
