Java ค่อยๆ ร้อนแรงขึ้นในช่วงไม่กี่ปีที่ผ่านมา ด้วยการเปิดตัว Java SE 5 และ Java SE 6 อนาคตของ Java จะยิ่งสดใสยิ่งขึ้น อย่างไรก็ตาม JSP ที่ใช้ Java ไม่สามารถเงยหน้าขึ้นมองได้ก่อนที่จะเปิดตัว Java SE 5 เหตุผลที่สำคัญที่สุดคือแม้ว่า JSP จะทรงพลังมาก แต่ข้อได้เปรียบที่ใหญ่ที่สุดก็คือข้อเสียที่ใหญ่ที่สุดเช่นกัน ฟังก์ชันอันทรงพลังหมายถึงความซับซ้อน โดยเฉพาะอย่างยิ่ง มี มีเครื่องมือด้านภาพไม่มากนักสำหรับการออกแบบอินเทอร์เฟซส่วนหน้า และมีประสิทธิภาพไม่เพียงพอ ดังนั้นการออกแบบเพจ JSP จึงมีความซับซ้อนและยุ่งยากมาก...
Java ค่อยๆ ร้อนแรงขึ้นในช่วงไม่กี่ปีที่ผ่านมา ด้วยการเปิดตัว Java SE 5 และ Java SE 6 อนาคตของ Java จะยิ่งสดใสยิ่งขึ้น อย่างไรก็ตาม JSP ที่ใช้ Java ไม่สามารถเงยหน้าขึ้นมองได้ก่อนที่จะเปิดตัว Java SE 5 เหตุผลที่สำคัญที่สุดคือแม้ว่า JSP จะทรงพลังมาก แต่ข้อได้เปรียบที่ใหญ่ที่สุดก็คือข้อเสียที่ใหญ่ที่สุดเช่นกัน ฟังก์ชันอันทรงพลังหมายถึงความซับซ้อน โดยเฉพาะอย่างยิ่ง มี มีเครื่องมือด้านภาพไม่มากนักสำหรับการออกแบบอินเทอร์เฟซส่วนหน้า และมีประสิทธิภาพไม่เพียงพอ ดังนั้นการออกแบบเพจ JSP จึงซับซ้อนและยุ่งยากมาก อย่างไรก็ตาม ในเวลาเดียวกันกับที่เปิดตัว Java SE 5 ซันได้เปิดตัวข้อกำหนด JavaServer Faces ใหม่ (เรียกสั้น ๆ ว่า JSF) เพื่อให้การพัฒนา JSP ง่ายขึ้น ส่งผลให้ JSP อยู่บนเส้นทางที่สดใส
1. JSF คืออะไร
JSF และ JSP เป็นคู่ใหม่ JSP เป็นเทคโนโลยีที่ใช้สำหรับการประมวลผลลอจิกพื้นหลัง ในขณะที่ JSF เป็นเพียงเทคโนโลยีที่ช่วยให้นักพัฒนาสามารถพัฒนาเว็บแอปพลิเคชันที่ใช้ Java ได้อย่างรวดเร็ว ปัจจุบัน JSF1.2 ได้รับการเพิ่มอย่างเป็นทางการใน Java EE 5 เป็นมาตรฐาน
เนื่องจากเป็นเทคโนโลยีที่มีส่วนประกอบสูง นักพัฒนาจึงสามารถใช้การดำเนินการแก้ไขแบบลากและวางโดยได้รับการสนับสนุนจากเครื่องมือการพัฒนาบางอย่าง ผู้ใช้เพียงแค่ลากส่วนประกอบ JSF ลงบนเพจเพื่อดำเนินการพัฒนาเว็บได้อย่างง่ายดาย นี่คือประโยชน์ที่ใหญ่ที่สุดของเทคโนโลยีที่เป็นส่วนประกอบ ส่วนประกอบที่เราสามารถใช้ได้ไม่เพียงแต่เป็นกล่องอินพุตที่ค่อนข้างง่ายเท่านั้น แต่ยังรวมถึงส่วนประกอบที่ซับซ้อนมากขึ้นด้วย เช่น ส่วนประกอบของตาราง เช่น ส่วนประกอบของ Tree เช่น Tree เป็นต้น
ในฐานะเทคโนโลยีมาตรฐาน JSF ยังได้รับการสนับสนุนจากผู้ให้บริการเครื่องมือจำนวนไม่น้อย ในเวลาเดียวกัน เราจะมีเครื่องมือการพัฒนาฟรีดีๆ มากมายที่พร้อมใช้งาน ไม่นานมานี้ Sun Java Studio Creator 2 และ Oracle JDeveloper 10g ได้รับการเผยแพร่ในฐานะเครื่องมือการพัฒนาฟรีที่รองรับ JSF ซึ่งนำความมีชีวิตชีวามาสู่ JSF อย่างมาก นอกจากนี้ เรายังมีเครื่องมือการพัฒนาเชิงพาณิชย์ที่ยอดเยี่ยมให้เลือก เครื่องมือพัฒนาปลั๊กอินที่ใช้ Eclipse เช่น BEA Workshop (เดิมชื่อ M7 NitroX), Exadel และ MyEclipse ได้มอบความสะดวกสบายให้กับผู้ใช้ Eclipse ส่วนใหญ่ในปัจจุบัน Rational Application Developer และ JBuilder ของ Borland เป็นเครื่องมือการพัฒนาเชิงพาณิชย์ที่ดีมากซึ่งสนับสนุนการพัฒนาภาพ JSF
JSF นั้นแตกต่างโดยพื้นฐานจากเทคโนโลยีเว็บแบบดั้งเดิม เทคโนโลยีเว็บแบบดั้งเดิมต้องการให้ผู้ใช้จับคำขอเบราว์เซอร์ บันทึกสถานะไคลเอ็นต์ และควบคุมการเปลี่ยนเส้นทางเพจด้วยตนเอง ฯลฯ การเกิดขึ้นของ JSF ทำให้เราได้รับความสะดวกสบายอย่างมากอย่างไม่ต้องสงสัย JSF จัดเตรียมโมเดลการนำทางตามเหตุการณ์ ซึ่งช่วยให้นักพัฒนาแอปพลิเคชันสามารถออกแบบโฟลว์เพจของแอปพลิเคชันได้ เช่นเดียวกับวิธี Struts ข้อมูลโฟลว์เพจทั้งหมดถูกกำหนดไว้ในไฟล์ XML คอนฟิกูเรชัน JSF (faces-config.xml) แทนที่จะฮาร์ดโค้ดในแอปพลิเคชัน สิ่งนี้ช่วยลดความยุ่งยากในการพัฒนาสำหรับนักพัฒนาได้อย่างมากและลดความยุ่งยากในการพัฒนาแอปพลิเคชัน
ในเวลาเดียวกัน JSF ยังเป็นเฟรมเวิร์กที่เป็นไปตามรูปแบบ model-view-controller (MVC) สามารถแยกโค้ดมุมมอง (มุมมอง) และตรรกะของแอปพลิเคชัน (โมเดล) ได้อย่างสมบูรณ์ ทำให้แอปพลิเคชันที่ใช้เทคโนโลยี JSF สามารถแยกหน้าและโค้ดได้ดี คำขอทั้งหมดสำหรับเพจ JSF จะถูกประมวลผลผ่านตัวควบคุมส่วนหน้า (FacesServlet) ระบบจะประมวลผลคำขอของผู้ใช้โดยอัตโนมัติและส่งคืนผลลัพธ์ให้กับผู้ใช้ สิ่งนี้ไม่แตกต่างจากกรอบ MVC ดั้งเดิมมากนัก
JSF ไม่เพียงแต่ใช้เทคโนโลยี POJO เท่านั้น แต่ยังใช้เทคโนโลยี Spring-like Inversion of Control (IoC) (หรือ Dependency Injection-DI) อีกด้วย ใน Backing Bean ของ JSF เราสามารถใส่ข้อมูลและการดำเนินการที่จำเป็นสำหรับมุมมอง Put it into a Backing Bean . ในเวลาเดียวกัน ด้วยเทคโนโลยี DI ที่ใช้โดย JSF เราจึงสามารถเริ่มต้น Managed Bean ในไฟล์การกำหนดค่าได้ ในเวลาเดียวกัน เรายังสามารถใช้เทคโนโลยีนี้เพื่อรวมเข้ากับ Spring ซึ่งใช้เทคโนโลยีที่คล้ายกันได้อย่างง่ายดาย
2. วิธีใช้ JSF ใน JSP
JSF สามารถใช้เอฟเฟกต์ได้อย่างเต็มที่โดยการรวมเข้ากับ JSP เท่านั้น JSF ถูกรวมเข้าด้วยกันผ่านไลบรารีแท็กและ JSP ไลบรารีแท็กเทียบเท่ากับส่วนประกอบฝั่งเซิร์ฟเวอร์ของ ASP.NET JSF จัดเตรียมไลบรารีแท็กที่สมบูรณ์มาก ซึ่งสามารถสร้างโมเดลไคลเอ็นต์ต่างๆ ได้ เช่น HTML, WML, XML และ JavaScript ด้วยแท็กเหล่านี้ คุณสามารถสร้างโมเดลไคลเอนต์ขนาดใหญ่ได้อย่างง่ายดาย และจัดการคำขอของลูกค้าโดยอัตโนมัติผ่านแท็กเหล่านี้
ต่อไปเรามาดูตัวอย่างวิธีทำให้ JSF และ JSP ทำงานร่วมกัน JSF มีห้องสมุดสองแห่ง อันแรกเรียกว่าเคอร์เนลไลบรารีซึ่งมีแท็กหลักต่างๆ เช่น การกำหนดค่าส่วนประกอบ การจัดการเหตุการณ์ การตรวจสอบความถูกต้องของข้อมูลอินพุต เป็นต้น หน้าที่หลักของไลบรารีที่สองคือการสอดคล้องกับแท็กต่างๆ ของ HTML และ JSF แท็ก JSF แต่ละแท็กสอดคล้องกับองค์ประกอบ HTML ตัวอย่างเช่น แท็ก UIInput สอดคล้องกับกล่องข้อความหรือกล่องรหัสผ่านในรูปแบบ HTML
กล่องป้อนข้อความในแท็ก JSF เรียกว่า inputText และไลบรารีอินพุตรหัสผ่านเรียกว่า inputSecret ต่อไปนี้เป็นโปรแกรมอินเทอร์เฟซผู้ใช้แบบง่ายที่รวม JSF และ JSP
＜%@ taglib uri=" http://java.sun.com/jsf/html " prefix="h" %>
< ＜%@ taglib uri=" http://java.sun.com/jsf/core " คำนำหน้า ="f" %＞
＜html＞
＜head＞
＜meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=GB2312"＞
＜title><โปรแกรม JSF แรก ＜/title>
＜/head ><
＜body></a>
＜f:view>
＜h:form id="simpleForm">
＜h:outputText id="favoriteLabel" value="Please enter a number:"/>
＜h:inputText id="favoriteValue" value= " #{simple.longValue}">
＜f:validateLongrange maximum="30" maximum="0"/>
＜/h:inputText>
< ＜p/＞
＜h:commandButton id="submit" value="Submit" action = "#{simple.simpleActionMethod}"/＞
＜/h:form＞
＜/f:view＞
＜/body＞
＜/html＞
ในโค้ดข้างต้น เราสามารถเข้าใจได้ว่า JSF ถูกรวมเข้ากับ JSP อย่างไร ก่อนอื่นเราจะเห็นป้ายกำกับเคอร์เนล: มุมมอง จากนั้นจะมีส่วนประกอบ JSF หลายประการ เช่น form, outputText, inputText และ commandButton ส่วนประกอบเหล่านี้จะถูกวางในแบบฟอร์มและกลายเป็นส่วนหนึ่งของแบบฟอร์ม ที่จุดเริ่มต้นของโปรแกรม จะต้องนำเข้าไลบรารีแท็กสองรายการโดยใช้การนำเข้า รหัสมีดังนี้
＜%@ taglib uri=" http://java.sun.com/jsf/html " prefix="h" %>
< ＜%@ taglib uri=" http://java.sun.com/jsf/core " คำนำหน้า ="f" %>
โค้ดสองบรรทัดด้านบนประกาศว่าไลบรารีแท็ก JSF ใดที่จะใช้ใน JSP ไลบรารีเคอร์เนลถูกประกาศด้วยคำนำหน้า f ในขณะที่ไลบรารี HTML ถูกประกาศด้วยคำนำหน้า h ไม่จำเป็นต้องใช้คำนำหน้าทั้งสองนี้ แต่เป็นเพียงคำแนะนำเท่านั้น ในโปรแกรม ต้องใช้ไลบรารีเคอร์เนล เนื่องจากต้องใช้มุมมองในเพจ JSF ทั้งหมด แท็ก HTML แปลงแท็ก JSF ให้เป็นองค์ประกอบ HTML ณ รันไทม์ ไม่จำเป็น แต่แนะนำโดยข้อกำหนด JSF ด้วยวิธีนี้ เราทำให้โปรแกรม JSF ของเราอ่านง่ายขึ้น
หลังจากการประกาศจะมีคำสั่ง HTML มาตรฐานหลายบรรทัดซึ่งจะไม่มีการอธิบายโดยละเอียดในบทความนี้ เริ่มต้นจาก <f:view> เป็นคำสั่ง JSF รหัสนี้เป็นดังนี้:
＜f:view＞
＜h:form id="simpleForm"＞
＜h:outputText id="favoriteLabel" value="Please enter a number:"/>
＜h:inputText id="favoriteValue " value="#{simple.longValue}">
＜f:validateLongrange maximum="30" maximum="0"/>
＜/h:inputText>
< ＜p/>
＜h:commandButton id="submit" value=" ส่ง "
action="#{simple.simpleActionMethod}"/>
</ ＜/h:form>
＜/f:view>
＜/f:view> แท็กประกาศจุดเริ่มต้นของ JSF และแท็กถัดไปจะสร้างแบบฟอร์ม HTML แท็ก outputText เทียบเท่ากับองค์ประกอบฉลากใน HTML แท็ก inputText เทียบเท่ากับองค์ประกอบ textField ใน HTML แท็ก commandButton เทียบเท่ากับปุ่มส่งใน HTML เมื่อคุณรันโปรแกรม JSP นี้ คุณจะได้รับเอฟเฟกต์ดังแสดงในรูปที่ 1
3. JSP ตอบสนองต่อคำร้องขอ JSF อย่างไร
จากตัวอย่างข้างต้น เราทราบวิธีใช้ JSF ใน JSP แล้ว ในส่วนนี้ มาดูกันว่าคำขอได้รับการประมวลผลใน JSF อย่างไร
ก่อนอื่น เรามาดูตัวอย่างการแปลงฟาเรนไฮต์เป็นเซลเซียสกันก่อน โปรแกรมจะทำการเปลี่ยนแปลงเมื่อผู้ใช้คลิกปุ่มส่ง
＜%@ taglib uri=" http://java.sun.com/jsf/html " prefix="h" %>
< ＜%@ taglib uri=" http://java.sun.com/jsf/core " คำนำหน้า ="f" %＞
＜html＞
＜head＞
＜meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=GB2312"＞
＜title><โปรแกรมแปลงอุณหภูมิ＜/title>
＜/head>
＜ body>
</f:view>
＜h:form>
＜div>
＜h:outputText id="fahrenheitLabel" value="กรุณาระบุอุณหภูมิฟาเรนไฮต์:"/>
＜span>
＜h:inputText id="temperature" value= " #{tc.fahrenheitTemp}">
＜f:validateDoublerange maximum="-100.0" maximum="100.0"/>
＜f:valuechangeListener type="tempconv.page.TCChangedListener"/>
＜/h:inputText">
＜/span ＞
＜/div＞
＜div＞
＜h:outputText id="celsiusLabel" value="อุณหภูมิเซลเซียส:"/>
</span>
＜h:outputText id="celsiusValue" value="#{tc.celsiusTemp}">
＜ f :convertNumber maxFractionDigits="3" type="number"/>
</＜/h:outputText>
＜/span>
＜/div>
＜div>
＜h:commandButton value="Convert" action="#{tc.convert} " ＞
＜/h:commandButton＞
＜/div>
</ ＜/h:form>
＜/f:view>
＜/body>
＜/html>
ในสองบรรทัดแรกของโปรแกรม ไลบรารีหลัก JSF และไลบรารี HTML จะถูกนำเข้า . สิ่งนี้เคยเกิดขึ้นแล้วและจะไม่กล่าวถึงรายละเอียดที่นี่
มาดูกันว่าแท็ก JSF โต้ตอบกับแบ็กเอนด์อย่างไร เนื่องจากเราใช้ JSF ใน JSP จึงไม่มีความแตกต่างระหว่าง JSP นี้กับ JSP ปกติ จริงๆ แล้ว JSP นั้นเป็น Servlet เมื่อรัน JSP เป็นครั้งแรก คอมไพเลอร์ JSP จะคอมไพล์ไฟล์ .JSP ลงใน Servlet แล้วเรียกมันโดย Servlet จากนั้น Servlet จะรับกระแสข้อมูลจากไคลเอนต์ แต่ต่างจากโปรแกรม JSP ทั่วไป แท็ก JSF ถูกเรียกโดย JSF API (ซึ่งช่วยให้สามารถแยกเลเยอร์ลอจิกและเลเยอร์การนำเสนอได้) นอกจากนั้น ก็ไม่ต่างจากแท็ก JSP ทั่วไป
เมื่อแท็ก UIComponent ได้รับเมธอด doStartTag JSF จะใช้คุณสมบัติเหล่านี้เพื่อตั้งค่าของแท็ก ตัวอย่างเช่น แท็ก inputText ในตัวอย่างนี้จะถูกตั้งค่าตามค่าแอตทริบิวต์ ด้านล่างนี้คือข้อมูลโค้ดจาก JSF
＜h:inputText id="temperature" value="#{tc.fahrenheitTemp}">
</f:validateDoublerange maximum="-100.0" maximum="100.0"/>
＜f:valuechangeListener type="tempconv.page.TCChangedListener" />
＜/h:inputText>
แท็ก inputText ตั้งค่าแอตทริบิวต์ id และค่าตามค่าที่สอดคล้องกัน ใน JSF แต่ละค่าแอ็ตทริบิวต์จะถูกตั้งค่าผ่าน setAttribute (ชื่อสตริง ค่าอ็อบเจ็กต์) แต่สิ่งที่เราต้องทราบก็คือแท็ก JSF สามารถระบุค่าเริ่มต้นที่สอดคล้องกันได้ สิ่งนี้ค่อนข้างคล้ายกับคุณสมบัติของระบบใน Java หากคุณระบุชื่อคุณสมบัติ ระบบจะส่งกลับค่าของคุณสมบัตินั้น หากคุณระบุค่าเริ่มต้นและไม่มีคุณสมบัติอยู่ ค่าเริ่มต้นจะถูกส่งกลับ
ต่อไป มาดูส่วนที่สำคัญที่สุดของโปรแกรมด้านบนกัน ซึ่งก็คือการจัดการเหตุการณ์ของส่วนประกอบ UIInput
<f:valuechangeListener type="tempconv.page.TCChangedListener"/>
ใน JSF การประมวลผลเหตุการณ์จะเสร็จสิ้นโดยแท็ก valuechangeListener เหตุการณ์ที่แสดงโดยป้ายกำกับนี้จะทริกเกอร์เหตุการณ์เมื่อค่าของกล่องข้อความเปลี่ยนแปลง แต่สิ่งที่น่าสนใจคือเหตุการณ์นี้ไม่ได้ถูกส่งในทันที แต่เหตุการณ์และข้อมูลที่เกี่ยวข้องจะไม่ถูกส่งไปยังแบ็กเอนด์จนกว่าผู้ใช้จะคลิกปุ่ม "ส่ง" ดังนั้น คำขอเหตุการณ์นี้จึงเรียกว่าการคอมมิตล่วงหน้า สุดท้ายนี้ เรามาดูการใช้งานโค้ดของ UICommand กัน
＜div></p>
＜h:commandButton value="Conversion" action="#{tc.convert}">
＜/h:commandButton>
＜/div>
โค้ดข้างต้นเชื่อมโยงวิธีการแปลง () และ UICommand กล่าวคือ หลังจากคลิกปุ่ม "ส่ง" วิธีการแปลง () จะถูกดำเนินการ หลังจากพบแท็กมุมมอง ผลลัพธ์ของโปรแกรม JSF และ JSFAPI จะเรียกเมธอด doEnd เพื่อสิ้นสุดโปรแกรม JSF ในที่สุด หลังจากแยกวิเคราะห์โปรแกรมนี้ เอ็นจิ้น JSF จะแปลงแท็ก JSF ที่เกี่ยวข้องเป็นคอมโพเนนต์ HTML
สุดท้ายนี้ เรามาดูกันว่า JSP ตอบสนองต่อเหตุการณ์ JSF อย่างไร ด้านล่างนี้คือโค้ด Java ส่วนหนึ่งที่ตอบสนองต่อเหตุการณ์ JSF
คลาสสาธารณะ TCChangedListener ใช้ ValueChangeListener
{
TCChangedListener สาธารณะ ()
{
super();
}
// การจัดการ
เหตุการณ์
void processValueChange (เหตุการณ์ ValueChangeEvent)
พ่น AbortProcessingException
{
UIComponent comp = event.getComponent();
Object value = event.getNewValue();
null != value)
{
float curVal = ((ตัวเลข) value).floatValue();
ค่าแผนที่ = comp.getAttributes();
if (curVal < 0)
{
values.put("styleClass", "red") ;
}
else
{
value.put("styleClass", "black");
เพื่อ
ตอบสนองต่อเหตุการณ์ JSFคุณ
ต้องใช้อินเท
อร์เฟซ ValueChangeListener ในไลบรารี JSF สิ่งที่ควรสังเกตในโปรแกรมด้านบนคือในที่สุดสีที่สอดคล้องกันก็จะถูกตั้งค่าตามค่าอินพุต ค่าเหล่านี้ไม่ได้ขึ้นอยู่กับ JSP แน่นอน คุณยังสามารถตั้งค่าให้เป็นโมฆะและปล่อยให้แท็ก JSP ตั้งค่าสีได้