جرعه آخر firstcup

January 8, 2008 11:08 AM

تعريف Navigation صفحات JSF
اين پروژه شامل دو صفحه jsp است كه از تكنولوژي JSF در آنها استفاده شده. يكي greeting.jsp و ديگري response.jsp است. قواعد حرکت بين صفحات JSF بايد در فايل configuration تعريف شود. اين کار در مورد مثال جاري بدين صورت انجام مي شود:
1. ماژول firstcup-war را باز کنيد.
2. فولدر Web Pages و سپس WEB-INF را باز کنيد.
3. روي faces-config.xml دبل کليک نماييد.
4. روي اديتور کليک راست کنيد و از قسمت JavaServer Faces گزينه Add Navigation Rule را انتخاب نماييد.
5. در فيلد Rule from view عبارت greeting.jsp/ را وارد کنيد.
6. دکمه Add را کليک کنيد.
7. مراحل 4 تا 6 را تکرار کنيد. با اين تفاوت که اين بار عبارت response.jsp/ را بعنوان Rule From view وارد کنيد.
8. روي اديتور کليک راست کنيد و از JavaServer Faces گزينه Add Navigation Case را انتخاب کنيد.
9. فيلد From View را greeting.jsp/ انتخاب نماييد.
10. در فيلد From Outcome عبارت success را وارد کنيد.
11. فيلد To View را response.jsp/ انتخاب نماييد.
12. Add را کليک کنيد.
13. مراحل 8 تا 12 را تکرار کنيد. با اين تفاوت که اين بار response.jsp/ را در From View و greeting.jsp/ را در To View وارد کنيد.
بدين ترتيب دو Navigation Rule خواهيد داشت. يکي از greeting.jsp به response.jsp و ديگري برعکس.
در پايان فايل را ذخيره نماييد.


ساخت صفحه response.jsp
1. روي ماژول firstcup-war کليک راست نماييد.
2. از قسمت New گزينه JSP را انتخاب کنيد.
3. نام فايل را response وارد کنيد.
4. Finish را کليک کنيد.
5. در فايل response.jsp تگ head را تغيير دهيد که اينگونه گردد:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Response Page</title>
</head>

6. تگ هاي ابتدا و انتهاي body را پاک کنيد.
7. تگ <h1> را نيز به همراه تگ خاتمه و محتوياتش حذف نماييد.
8. تگ هاي زير را پس از تگ بسته شدن head قرار دهيد.

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>

9. تگ هاي زير را در ادامه تگ هاي مرحله قبل در صفحه کپي کنيد:

<f:view>
<h:form>

 <h2><h:outputText value="#{bundle.YouAre} " />
 <h:outputText value="#{bundle.SameAge}" rendered="#{dukesBDay.ageDiff == 0}"/>
            
 <h:outputText value="#{dukesBDay.absAgeDiff}" rendered="#{dukesBDay.ageDiff < 0}"/>
 <h:outputText value=" #{bundle.Year} " rendered="#{dukesBDay.ageDiff == -1}"/>
 <h:outputText value=" #{bundle.Years} " rendered="#{dukesBDay.ageDiff < -1}"/>
 <h:outputText value="#{bundle.Younger}" rendered="#{dukesBDay.ageDiff < 0}"/>
           
 <h:outputText value="#{dukesBDay.absAgeDiff}" rendered="#{dukesBDay.ageDiff > 0}"/>
 <h:outputText value=" #{bundle.Year} " rendered="#{dukesBDay.ageDiff == 1}"/>
 <h:outputText value=" #{bundle.Years} " rendered="#{dukesBDay.ageDiff > 1}"/>
 <h:outputText value="#{bundle.Older}" rendered="#{dukesBDay.ageDiff > 0}"/>

</h:form>
</f:view>

10. قبل از بسته شدن تگ h:form تگ زير را قرار دهيد:

<p><h:commandButton id="back" value="#{bundle.Back}" action="success"/>

11. فايل را ذخيره نماييد.

Building, Packaging, Deploying & Running
در اين مرحله شما DukesBirthdayBean و firstcup web client راا Build خواهيد نمود، آنها را در فايل هاي EAR بصورت package درخواهيد آورد. فايل هاي EAR را در سرور deploy خوهيد نمود و سرانجام App را اجرا خواهيد کرد.
آماده سازي Deployment Descriptor
در اين مرحله برخي پارامترها که خود NetBeans در فايل Deployment Descriptor ايجاد کرده، اما ما به آنها نياز نداريم را پاک خواهيم کرد. بدين ترتيب:
1. ماژول firstcup-war را باز کنيد.
2. فولدر Configuration Files را باز کنيد.
3. روي web.xml دبل کليک نماييد.
4. در بالاي پنجره اديتور، روي تب General کليک نماييد.
5. علامت + کنار Context Parameters را انتخاب کنيد. با اين کار يک جدول باز مي شود.
6. از جدول مذکور تک تک پارامترها را انتخاب کنيد و با دکمه remove همه آنها را يکي يکي پاک نماييد.
7. در بالاي اديتور روي تب XML کليک کنيد.
8. عنصر welcome-file-list و همه اجزاي آن را حذف نماييد.
9. فايل را ذخيره نماييد.
Building و Packaging
دراين مرحله در مورد firstcup Enterprise Application عمل Building و packaging را انجام مي دهيم. بدين ترتيب:
1. firstcup را در قسمت پروژه ها انتخاب نماييد.
2. کليک راست کنيد و گزينه Build Project را انتخاب کنيد.
Deploying
در مرحله قبل شما DukesBirthdayBean enterprise bean و firstcup web client را بصورت فايل firstcup.ear پکيج نموديم. حالا آن را روي سرور deploy مي کنيم. بدين صورت:
1. firstcup را در قسمت پروژه ها انتخاب کنيد.
2. کليک راست کرده و گزينه Deploy Project را انتخاب کنيد.
Running
1. Browser را اجرا نماييد و در قسمت آدرس آن URL زير را وارد کنيد.

http://localhost:8080/firstcup

mahyar_ev | 11:08 AM | Comment(s)(0)

ساخت صفحه greeting.jsp

January 6, 2008 03:07 PM

اين صفحه شامل پيغام خوش آمدگويي، نمايش سن فعلي Duke و دريافت تاريخ تولد کاربر است. مراحل ساخت صفحه چنين است:
ساخت يک صفحه خالي:
1. روي ماژول firstcup-war کليک راست نماييد.
2. از قسمت New گزينه JSP را انتخاب کنيد.
3. نام فايل JSP را greeting وارد کنيد.
4. Finish را کليک کنيد.
5. تگ head را به اين صورت تغيير دهيد:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Firstcup Greeting Page</title> 
</head>

6. تگ هاي ابتدا و انتهاي body را حذف کنيد.
7. عبارت زير را حذف کنيد:

<h1>JSP Page</h1>

8. فايل را ذخيره نماييد.

Declare نمودن Tag Library هاي JSF
همانگونه که مي دانيد تکنولوژي JavaServer Faces در واقع مجموعه اي از custom tag هاي jsp است که براي نمايش کامپوننت هاي واسط کاربري ، اعتبار سنجي و ساير موارد مربوطه به کار مي رود. Custom tag ها در tag library ها تعريف مي شوند. تکنولوژي JavaServer Faces در دو tag library تعريف مي شود:
• HTML Render Kit library که در آن همه کامپوننت هاي استاندارد واسط کاربري تعريف شده اند.
• Core tag library که تگ هاي مورد نياز براي مبدل ها (convertors) ، اعتبارسنج ها (Validators) و event listener ها و ساير توابع عملکردي اشياء تعريف مي شوند.

براي استفاده از اين تگ ها در صفحه بايد tag library را declare نماييد. در اين مثال بايد خطوط زير را در فايل greeting.jsp درست پس از تگ بسته شدن head قرار دهيد:

<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>

افزودن تگ هاي f:view و f:form
يک صفحه JSF بوسيله درختي از کامپوننت هاي واسط کاربري نمايش داده مي شود. هر صفحه JSP که از تکنولوژي JSF استفاده مي کند بايد داراي تگ view باشد. اين تگ در Core tag Library تعريف شده است و ريشه يا root درخت کامپوننت ها را مشخص مي نمايد. ساير تگ هاي JSF بايد درون تگ view تعريف شوند.
همچنين از آنجا که معمولا صفحات JSF شامل فرمي براي دريافت اطلاعات از کاربر است، معمولا بايد شامل تگ form نيز باشد. همه کامپوننت هاي موجود در يک فرم بايد درون تگ form قرار گيرند.
با مثال خود بحث را پي مي گيريم.
در ادامه declare نمودن tag library ها تگ هاي view و form را بدين صورت تعريف نماييد:

<f:view>
    <h:form>
    </h:form>
</f:view>

افزودن Output Label ها براي نمايش محتواي فقط خواندني
يکي از مهمترين و پر کاربرد ترين تگ هاي JSF تگ outputText است. greeting.jsp براي نمايش پيغام خوش آمدگويي، دستورالعمل ها، Lebel ها و سن Duke از آن استفاده مي کند. براي اين کار از پيغام هاي تعريف شده در resource bundle استفاده مي نمايد. همچنين تگ outputText اي که سن Duke را نشان مي دهد از متغير age موجود در DukesBDay bean استفاده مي کند.
در داخل تگ h:form اين کد ها را بنويسيد:

<h2><h:outputText value="#{bundle.Welcome}"/></h2>
<h:outputText value="#{bundle.DukeIs} "/>
<h:outputText value="#{dukesBDay.age}"/>
<p><h:outputText value="#{bundle.Instructions}"/>
<p><h:outputText value="#{bundle.YourBD}"/>

افزودن يک کامپوننت input براي دريافت تاريخ تولد کاربر
يکي ديگر از تگ هاي پرکاربرد، تگ inputText است که يک فيلد متني براي دريافت ورودي از کاربر است. در اين مثال در صفحه greeting.jsp تاريخ تولد کاربر دريافت مي شود و مقدارش در متغير YourBD از DukesBDay Bean ريخته مي شود. بدين ترتيب:
پس از کدهاي نوشته شده از مراحل قبل، کدهاي زير را بنويسيد:

<h:inputText id="userBirthday" value="#{dukesBDay.yourBD}">
</h:inputText>

انتساب يک convertor به کامپوننت ورودي
JSF شامل مجموعه از convertor ها و validator هاي استاندارد است که مي توان به کامپوننت نسبت داد. هدف از آنها اعتبار سنجي داده هاي ورودي و كنترل انطباق آنها با الگويي خاص است. در اينجا ما مي خواهيم نحوه ورود تاريخ توسط كاربر را مشخص نماييم و روي آن كنترل داشته باشيم.
به اين منظور چنين عمل کنيد:
1. تگ زير را در داخل تگ h:inputText اضافه نماييد:

<f:convertDateTime pattern="MM/dd/yyyy"/>

2. براي نمايش الگوي ورود تاريخ به کاربر تگ زير را پس از تگ بسته شدن h:inputText قرار دهيد:

<h:outputText value="#{bundle.Pattern}"/>

3. براي اينکه در صورت بروز خطا هنگام conversion پيغامي به کاربر نشان داده شود لازم است مشخصه converterMessage را به تگ h:inputText اضافه نماييد. اين تگ بدين صورت خواهد شد:

<h:inputText id="userBirthday" 
          value="#{dukesBDay.yourBD}"
          converterMessage="#{bundle.DateError}">             
    <f:convertDateTime pattern="MM/dd/yyyy"/>
</h:inputText>

4. براي مشخص کردن جاي نمايش پيغام خطا به کاربر تگ زير را درست قبل از تگ بسته شدن h:form قرار دهيد. بدين صورت:

<p><h:message for="userBirthday" style="color:red"/>

افزودن دکمه براي submit
درست قبل از تگ message که در مرحله قبل ايجاد کرديد تگ زير را اضافه نماييد:

<p><h:commandButton value="#{bundle.Submit}" action="success"/>

در نهايت فايل را ذخيره نماييد.

پياده سازي greeting.jsp هم تمام شد. در مطلب بعد، آخرين جزء Application كه صفحه response.jsp است را خواهيم ساخت.

mahyar_ev | 03:07 PM | Comment(s)(1)

ساخت DukesBDay Managed Bean

January 5, 2008 02:52 PM

افزودن Dependency روي Enterprise Bean Module
ماژول firstcup-war به برخي از کلاس هاي firstcup-ejb وابسته است. شما بايد وجود اين وابستگي را به NetBeans اعلام نماييد. بدين ترتيب:
1. روي ماژول firstcup_war کليک راست نماييد و properties را انتخاب نماييد.
2. از category ها Libraries را انتخاب نماييد.
3. روي Add Project کليک کنيد.
4. مسير myexample/firstcup را انتخاب نماييد.
5. پروژه firstcup-ejb را انتخاب کنيد.
6 دکمه Add Project JAR Files را کليک کنيد.
7. توجه کنيد که Build Required Projects تيک خورده باشد.
8. OK را کليک نماييد.

ساخت كلاس DukesBDay و تعريف متغيرهاي لازم
DukesBDay يک Backing Bean است. منظور از Backing Bean، يک Bean کنترل شده (managed Bean ) توسط JSF است که براي ذخيره سازي داده هاي مربوط به مقادير کامپوننت هاي موجود در صفحه JSF به کار مي رود.
DukesBDay در واقع واسط بين صفحات JSF و Business Tier است. صفحات JSF اطلاعات مورد نياز خود را از اين managed Bean دريافت مي كنند و به آن نيز تحويل مي دهند.
براي ساخت کلاس DukesBDay اين مراحل را انجام دهيد:

ساخت يک کلاس خالي:
1. روي ماژول firstcup-war کليک راست کنيد.
2. از New گزينه Java Class را انتخاب نماييد.
3. نام کلاس را DukesBDay قرار دهيد.
4. Package را com.sun.firstcup.web وارد کنيد.
5. Finish را کليک کنيد.

افزودن Enterprise Bean Reference:
6. درست بعد از سطر تعريف کلاس (اولين سطر از بدنه کلاس) متغير private زير را به همراه عبارت EJB@ درج نماييد:
@EJB
Private DukesBirthdayRemote dukesBirthday;
افزودن property ها به Bean:
7. پس از تعريف متغير dukesBirthday متغيرهاي زير را بعد از آن درج نماييد:
private int age;
private Date YourBD;
private int ageDiff;
private int absAgeDiff;
8. با افزودن کدهاي زير به constructor پيش ساخته، متغيرها را initialize نماييد:
age = -1;
YourBD = null;
ageDiff = -1;
absAgeDiff = -1;
ساخت متدهاي دستيابي (Accessor Methods) براي property ها
در اين مرحله با استفاده از امكانات refactoring موجود در NetBeans متدهاي get و set را ايجاد مي كنيم. بدين ترتيب:
1. روي اديتور کليک راست کنيد.
2. از منوي باز شده گزينه Refactor و سپس Encapsulate Fields را انتخاب نماييد.
3. در فرمي که باز مي شود، تيک مربوط به getDukesBirthday و setDukesBirthday را برداريد.
4. Next را کليک نماييد.
5. در پنل refactoring روي Do Refactoring کليک کنيد. با اين کار کدهاي مربوط به get و set متغيرها به کلاس اضافه خواهند شد.

افزودن كدهاي لازم جهت دريافت سن Duke
1. ماژول firstcup-war را باز کنيد.
2. قسمت Web Service Refrences را باز کنيد.
3. وارد قسمت زير شويد:
DukesAgeService->DukesAgeService->DukesAgePort->getDukesAge
4. از اديتور در فايل DukesBDay.java متد getAge را بيابيد. سپس getDukesAge را که در مرحله قبل انتخاب نموده ايد به متد getAge قبل از عبارت return age با ماوس drag نماييد. محتويات اين متد پس از انجام اين عمل چنين خواهد شد:

public int getAge() {       

   try { // Call Web Service Operation

   com.sun.firstcup.webservice.DukesAgeService service = 

new  com.sun.firstcup.webservice.DukesAgeService();

   com.sun.firstcup.webservice.DukesAge port = service.getDukesAgePort();

   // TODO process result here

   int result = port.getDukesAge();

   System.out.println("Result = "+result);

   } catch (Exception ex) {

       // TODO handle custom exceptions here

   }

   return age;

}



5. در کدهاي متد getAge خط


int result = port.getDukesAge();


را حذف کنيد و به جايش عبارت زير را قرار دهيد.


age = port.getDukesAge();


6. خط زير را حذف نماييد:


System.out.println("Result = "+result);


افزودن كدهاي دريافت تفاوت سن از DukesBirthdayBean

داخل متد getAgeDiff درست قبل از دستور return کدهاي زير را وارد نماييد:


ageDiff = dukesBirthday.getAgeDifference(YourBD);

if (ageDiff < 0) {

    setAbsAgeDiff(Math.abs(ageDiff));

} else {

    setAbsAgeDiff(ageDiff);
}


افزودن Imort ها

1. روي اديتور کليک راست کنيد.

2. گزينه Fix Imports را انتخاب کنيد.

3. عبارت java.util.Date را براي کلاس Date انتخاب نماييد.

4. OK را کليک کنيد.



در خاتمه فايل را ذخيره نماييد.



تنظيم پيکربندي DukesBDay

تکنولوژي JSF امکان استفاده از فايل هاي Configuration را براي مقداردهي اوليه، پيکربندي و ذخيره سازي managed Bean ها در 3 scope زير مي دهد:

• Request که وقتي کاربر صفحه اي را submit مي کند آغاز مي شود و پس از ارسال پاسخ پايان مي پذيرد.

• Session که با اولين دسترسي کاربر به صفحه آغاز مي شود و پس از خاتمه يافتن session کاربر ، پايان مي يابد.

• Application که تا زماني که سرور، Application را متوقف نکرده اعتبار دارد.



Scope در managed Bean مثال ما session است.

به محض اينکه Bean ، پيکربندي شد يک صفحه JSF مي تواند آن را ايجاد کند و به آن دسترسي داشته باشد. در اينجا ما پيکربندي DukesBDay managed Bean را انجام مي دهيم:

1. ماژول firstcup-war را باز کنيد.

2. فولدر Web Pages و سپس WEB-INF را باز کنيد.

3. روي faces-config.xml دبل کليک نماييد.

4. روي اديتور کليک راست کرده و از JavaServer Faces گزينه Add Managed Bean را انتخاب کنيد.

5. نام Bean را dukesBDay وارد کنيد.

6. کلاس را com.sun.firstcup.web.DukesBDay قرار دهيد.

7. از منوي scope گزينه session را انتخاب کنيد.

8. در قسمت Description نيز عبارت DukesBDay backing bean را وارد کنيد.

9. Add را کليک کنيد. با اينکار عناصر XML مربوطه به فايل اضافه مي شوند.

10. فايل را ذخيره نماييد.




از Application نمونه اي ما تنها صفحات greeting.jsp و respone.jsp باقي مانده كه در مطالب آينده آنها را پياده سازي خواهيم نمود. براي يادآوري اين تصوير را دوباره مشاهده كنيد.

mahyar_ev | 02:52 PM | Comment(s)(0)

ساخت firstcup Web Client

January 1, 2008 11:18 AM

براي ساخت Web Client کارهاي زير را بايد انجام دهيد:
• تنظيم firstcup-war به اين منظور که JSF را پشتيباني نمايد.
• ساخت يک Web service client
• ساخت يک resource bundle براي نگهداري پيغام هايي که توسط صفحات JSP استفاده مي شوند.
• تنظيم resource bundle در فايل configuration
• ساخت کلاس مديريت DukesBDay
• تنظيم DukesBDay در فايل configuration
• ساخت صفحه greeting.jsp
• تنظيم قواعد navigation
• ساخت صفحه response.jsp
در ادامه، مراحل بالا يک به يک توضيح داده خواهند شد.

تنظيم firstcup-war جهت پشتيبالي JSF
همه Application هاي JSF بايد شامل يک map به نمونه FacesServlet در فايل deployment descriptor باشند. نمونه FacesServlet درخواست ها را دريافت مي کند و براي پردازش به life cycle مي فرستد. همچنين مقداردهي اوليه منابع را انجام مي دهد.

اين mapping بدين صورت انجام مي شود:
1. روي ماژول firstcup-war کليک راست کنيد و properties را انتخاب نماييد.
2. از category ها framework را انتخاب نماييد.
3. روي Add کليک کنيد.
4. از ليست انتخاب ها، JavaServer Faces را انتخاب نماييد و OK را کليک کنيد.
5. Servlet URL mapping را به */firstcupWeb/ تغيير دهيد. اين مسير نمونه FacesServlet است.
6. تيک Validate XML را برداريد.
7. OK را کليک کنيد.

فوروارد صفحه index.jsp به greeting.jsp
مي خواهيم بلافاصله پس از اجراي اين Web Application به صفحه greeting.jsp برويم. لذا بايد index.jsp را به greeting.jsp فوروارد نماييم. بدين صورت:
1. ماژول firstcup-war را باز کنيد و روي Web Pages دبل کليک نماييد.
2. روي welcomeJSF.jsp کليک راست کرده بوسيله Delete آن را حذف نماييد.
3. روي index.jsp دبل کليک کنيد.
4. هر چيزي که داخل اين صفحه نوشته شده است را پاک کنيد.
5. اين عبارت را در صفحه index.jsp وارد کنيد:
6. فايل را ذخيره کنيد.

توضيح اينكه صفحه greeting.jsp را بعدا خواهيم ساخت.

ساخت Web Service Client براي وب ماژول firstcup-war
اين ماژول از وب سرويس firstcup-dukes-age استفاده مي نمايد. به اين منظور لازم است يک Web Service Client در آن ايجاد نماييد. بدين صورت:
1. ماژول firstcup-war را انتخاب کنيد.
2. از منوي File گزينه New File را انتخاب کنيد.
3. از category ها گزينه Web Services را انتخاب کنيد.
4. از انواع فايل، Web Service Client را ايجاد نماييد.
5. Next را کليک کنيد.
6. WSDL URL را انتخاب کنيد.
7. در قسمت WSDL URL مقدار زير را وارد کنيد:
http://localhost:8080/DukesAgeService/DukesAgeService?WSDL
8. در فيلد package نيز اين مقدار را وارد نماييد:
com.sun.firstcup.webservice
9. Finish را کليک کنيد.

ساخت Resource Bundle
منظور از Resource Bundle فايلي است از نوع properties كه در آن كليه متون ثابت، شامل پيغام هاي خطا و عباراتي كه در صفحه jsp به كار مي روند، تعريف مي شود. نحوه ساخت آن بدين ترتيب است:
1. ماژول firstcup-war را انتخاب نماييد.
2. از منوي فايل گزينه New File را انتخاب کنيد.
3. category را other و نوع فايل را Properties File انتخاب کنيد و Next را کليک کنيد.
4.نام فايل را WebMessages وارد نماييد.
5. فولدر را نيز اين مسير وارد کنيد:
src/java/com/sun/firstcup/web
6. Finish را کليک نماييد.
7. پس از اينکه NetBeans فايل را ايجاد نمود متن زير را در آن کپي نماييد:
Welcome=Hi. My name is Duke. Let us find out who is older -- You or me
DukeIs=Duke is
YearsOldToday=years old today.
Instructions=Enter Your birthday and click submit.
YourBD=Your birthday
Pattern=MM/dd/yyyy
DateError=Please enter the date in the form MM/dd/yyyy.
YouAre=You are
Year=year
Years=years
Older=older than Duke!
Younger=younger than Duke!
SameAge= the same age as Duke!
Submit=Submit
Back=Back
8. فايل را ذخيره کنيد.
9. در صورت نياز مي توانيد براي هر زباني مانند زبان فارسي يک Properties File مشابه بالا تهيه نماييد.
10. توسط گزينه Refresh All Files از منوي File همه فايل ها را Refresh نماييد.

تنظيم و پيکر بندي Resource Bundle
1. ماژول firstcup-war را باز کنيد. از فولدر Web Pages فولدر WEB-INF را باز کنيد.
2. روي faces-config.xml دبل کليک نماييد.
3. قبل از تگ پاياني عنصر faces-config عناصر زير را اضافه نماييد:
<application>
    <resource-bundle>          
            <base-name>com.sun.firstcup.web.WebMessages</base-name>
        <var>bundle</var> 
    </resource-bundle>
    <locale-config>
        <default-locale>en</default-locale>
        <supported-locale>es</supported-locale>
    </locale-config>
</application>
4. فايل را ذخيره نماييد.

در مطلب بعد ساخت كلاس DukesBDay از اجزاي web client را خواهيم ديد. براي يادآوري اين تصوير را ببينيد.

mahyar_ev | 11:18 AM | Comment(s)(0)

مثال JSF Application بخش 4

August 28, 2007 01:44 PM

ادامه از مطلب قبلي

ادامه تعريف محتواي فايل هاي jsp
در مطلب قبل محتواي فايل inputname.jsp را مشخص كرديم. حال مي پردازيم به فايل greeting.jsp.
دستورات زير را در فايل greeting.jsp كپي نماييد:

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<f:loadBundle basename="jsfks.bundle.messages" var="msg"/>

<html>
   <head>
      <title>greeting page</title>
   </head>
   <body>
      <f:view>
         <h3>
            <h:outputText value="#{msg.greeting_text}" />,
            <h:outputText value="#{personBean.personName}" />
            <h:outputText value="#{msg.sign}" />
         </h3>
      </f:view>
   </body>
</html> 

دستورات موجود در اين فايل مشابه دستورات فايل jsp ديگر است كه قبلا توضيح داده شد.
خروجي اين فايل چيزي شبيه اين خواهد بود:

Welcome to JSF, name!

6- ايجاد فايل index.jsp
ما به يك فايل jsp سوم نيز نياز داريم كه واقعا بعنوان يك صفحه نمايش عمل نمي كند. بلكه تنها براي forward كردن به inputname.jsp به كار مي رود.
قابل index.jsp را درون فولدر WebContent بسازيد و دستورات زير را در آن كپي كنيد:

<html>
   <body>
      <jsp:forward page="/pages/inputname.jsf" />
   </body>
</html>

نكته قابل توجه در اينجا اين است كه ما در دستورات فوق پسوند فايل inputname.jsp را jsf ذكر كرده ايم. اين كار تنها در اينجا انجام مي شود. علت آن هم اين است كه در فايل web.xml مربوط به application، عبارتjsf.* الگو يا URL Pattern اي است كه مشخص مي كند handle كردن صفحه forward شده بايد توسط JavaServer Faces servlet موجود در Tomcat انجام شود.

با داشتن فايل index.jsp امكان اجراي برنامه توسط دستور زير فراهم مي شود:

http://localhost:8080/jsfks

كار ما در ساختن برنامه تقريبا تمام است. فقط مراحل كامپايل كردن و deployment مي ماند كه در ادامه به آن ها خواهيم پرداخت.

7- كامپايل كردن
براي اين كار كافي است فايل build.xml موجود در فولدر ant را بدين صورت اجرا نماييد:

ant  build

8- Deployment
قبل از اجراي برنامه در servlet container لازم است آن را Deploy نماييم. در اينجا ما از null Deployment استفاده خواهيم نمود. به اين منظور بايد در Tomcat يك context را register نماييم. براي اين كار بايد به فايل TomcatHome}\conf\server.xml} كد زير را اضافه نماييم:

<Context debug="0"
docBase="Path_to_WebContent"
path="/jsfks" reloadable="true"/>

اين كد بايد در داخل قسمت Host و درست قبل از بسته شدن آن با تگ اضافه شود.
ضمنا عبارت Path_to_WebContent بايد با مسير واقعي فولدر WebContent روي سيستم شما جايگزين گردد. مثلا c:/examples/jsfks/WebContent.

9- Run
براي اجرا ابتدا Tomcat Server بايد start شود. معمولا اين كار توسط startup.bat در دايركتوري bin از Tomcat انجام مي شود. سپس browser را اجرا نموده و عبارت http://localhost:8080/jsfks را وارد نماييد.

mahyar_ev | 01:44 PM | Comment(s)(2)

مثال JSF Application بخش 3

August 25, 2007 03:20 PM

ادامه از مطلب قبلي

5- تعريف محتواي فايل هاي jsp:
در مراحل قبل دو صفحه jsp در مسير WebContent/pages ايجاد كرده ايم. اكنون مي خواهيم محتواي آن را مشخص نماييم.

در فايل inputname.jsp اين دستورات را كپي نماييد:

 

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<f:loadBundle basename="jsfks.bundle.messages" var="msg"/>

<html>
   <head>
      <title>enter your name page</title>
   </head>
   <body>
      <f:view>
         <h1>
            <h:outputText value="#{msg.inputname_header}"/>
         </h1>
         <h:form id="helloForm">
            <h:outputText value="#{msg.prompt}"/>
            <h:inputText value="#{personBean.personName}" />
            <h:commandButton action="greeting" value="#{msg.button_text}" />
         </h:form>
      </f:view>
   </body>
</html>


حال به دستورات نوشته شده نگاهي مي اندازيم:
در اولين خط مشخص كرده ايم كه مسير تگ هاي JSF اي كه عناصر HTML را تعريف مي كنند چيست.
دومين خط مسير تگ ها JSF اي كه عناصر Core JSF را تعريف مي كنند، مشخص مي كند.
سومين خط، فايل properties تعريف شده در مرحله قبل را Load مي نمايد.

اما قسمت HTML

<h:outputText value="#{msg.inputname_header}"/>

دستور بالا، مشخص مي كند كه از فايل properties كه در بالا معرفي شده، مقدار پارامتر inputname_header را بياب و در اينجا چاپ كن.

<h:form id="helloForm">
   <h:outputText value="#{msg.prompt}"/>
   <h:inputText value="#{personBean.personName}" />
   <h:commandButton action="greeting" value="#{msg.button_text}" />
</h:form>

خط اول از مجموعه دستورات بالا شروع تعريف يك فرم با استفاده از تگ هاي JSF را مشخص مي كند.
خط دوم پارامتر prompt از فايل properties را چاپ مي نمايد.
خط سوم يك Text box ورودي HTML ايجاد مي كند. در مشخصه value ما اين فيلد را به Managed Bean كه قبلا ساخته ايم متصل مي كنيم.
خط چهارم يك تگ JSF براي ساخت يك Submit Button است. مقدار action در اين جا مساوي با greeting قرار داده شده. توجه كنيد كه اين مقدار همان مقدار تعريف شده در navigation_outcome فايل faces-config.xml مي باشد. بدين ترتيب صفحه بعدي كه بايد به آن برويم مشخص مي شود.

ادامه دارد...

mahyar_ev | 03:20 PM | Comment(s)(0)

مثال JSF Application بخش 2

August 20, 2007 11:07 AM

ادامه از مطلب قبلي

1- ايجاد فايل هاي JSP
در مسير WebContent/pages فايل هاي inputname.jsp و greeting.jsp را ايجاد نماييد. محتواي اين دو فايل را در مراحل بعدي مشخص خواهيم كرد. دليل اينكه اين دو فايل را الان ايجاد كرده ايم اين است كه براي تعريف Navigation Rule در مرحله بعدي به آنها نياز خواهيم داشت.
2- تعريف Navigation
Navigation قلب JSF است و قواعد آن در فايل faces-config.xml تعريف مي شود. در اين مثال تنها كاري كه مي خواهيم بكنيم اين است كه از inputname.jsp به greeting.jsp برويم.
اگر بخواهيم Navigation Rule را بر اساس قواعد تعريف آن بيان نماييم به چنين عبارتي مي رسيم: rule مي گويد كه از view يا صفحه inputname.jsp به view يا صفحه greeting.jsp برو به شرطي كه outcome اجراي inputname.jsp عبارت greeting باشد. اين rule بدين صورت بيان مي شود:

<navigation-rule>
          <from-view-id>/pages/inputname.jsp</fromview-id>
     <navigation-case>
          <from-outcome>greeting</from-outcome>
          <to-view-id>/pages/greeting.jsp</to-view-id>
     </navigation-case>
</navigation-rule>

3- ايجاد Managed Bean
در اين مرحله ابتدا در داخل فولدر JavaSource يك فولدر به نام jsfks كه همان نام Application است، ايجاد مي نماييم. در داخل اين فولدر، فايل PersonBean.java را براي ساخت كلاس PersonBean ايجاد مي نماييم. اين كلاس، براي set و get نام وارد شده توسط كاربر بكار مي رود. اين Bean را به اين دليل ساخته ايم كه منطق يا Logic برنامه را از قسمت نمايش يا همان صفحه jsp جدا كنيم. در فايل PersonBean.java با اين دستورات، كلاس PersonBean را ايجاد مي نماييم:

package jsfks;

public class PersonBean {
     String personName;

     public String getPersonName() {
          return personName;
     }

     public void setPersonName(String name) {
          personName = name;
     }

نحوه استفاده از اين كلاس از درون فايل jsp را در مراحل بعدي خواهيم ديد.
براي استفاده از Managed Bean تعريف شده، لازم است كه آن را در فايل faces-config.xml تعريف نماييم. از اين رو دستورات زير را به فايل مذكور اضافه مي نماييم:

<managed-bean>
     <managed-bean-name>personBean</managed-bean-name>
     <managed-bean-class>jsfks.PersonBean</managed-bean-class>
     <managed-bean-scope>request</managed-bean-scope>
</managed-bean>

با اين تغيير، محتواي نهايي فايل faces-config.xml بايد مشابه اين باشد:

<?xml version="1.0"?>
<!DOCTYPE faces-config PUBLIC
     "-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
     "http://java.sun.com/dtd/web-facesconfig_1_1.dtd">

<faces-config>
   <navigation-rule>
       <from-view-id>/pages/inputname.jsp</from-view-id>
           <navigation-case>
               <from-outcome>greeting</from-outcome>
                <to-view-id>/pages/greeting.jsp</to-view-id>
           </navigation-case>
   </navigation-rule>
   <managed-bean>
      <managed-bean-name>personBean</managed-bean-name>
      <managed-bean-class>jsfks.PersonBean</managed-bean-class>
      <managed-bean-scope>request</managed-bean-scope>
   </managed-bean>
</faces-config>
 

4- ايجاد يك فايل Properties يا resource bundle
فايل properties فايلي است حاوي مجموعه جفت هايي به فرمت param=value . در صفحات jsp كه خواهيم ساخت از پيغامهاي ذخيره شده در آن استفاده خواهد شد. جدا نمودن پيغام ها از صفحات jsp اين خوبي را دارد كه مي توان بدون تغيير در فايل jsp به سرعت پيغام ها را ويرايش نمود.
ابتدا در فولدر JavaSource/jsfks فولدر ديگري به نام bundle ايجاد نماييد و داخل آن نيز فايلي به نام messages.properties بسازيد. اين فايل حتما بايد داخل JavaSource باشد كه هنگام كامپايل پروژه به فولدر class منتقل شود و در هنگام اجرا قابل دستيابي باشد.
متن زير را درون فايل messages.properties كپي كنيد:

inputname_header=JSF KickStart
prompt=Tell us your name:
greeting_text=Welcome to JSF
button_text=Say Hello
sign=!

حالا هر آنچه لازم است براي ساخت صفحات jsp، در اختيار داريم.

ادامه دارد...

mahyar_ev | 11:07 AM | Comment(s)(0)

مثال JSF Application بخش 1

August 18, 2007 10:47 AM

از سايت j2eeBrain در مطلبي نحوه ايجاد يك JSF Application بصورت گام به گام توضيح داده شده است. ترجمه آن را در چند قسمت در ادامه خواهم آورد:

براي ايجاد JSF Application مورد بحث به چه چيزهايي نياز هست؟
. JDK1.4
. Tomcat 5 يا هر Servlet Container ديگر از جمله JBoss ، Resin و JRUN
. Ant
معرفي Application اي كه خواهيم ساخت:
در اين مثال ما دو صفحه خواهيم ساخت. در صفحه اول ما نام كاربر را از او دريافت مي كنيم و در صفحه دوم به او خوش آمد مي گوييم.

ساختار Application:
ساختار Web Application ها نوعا بدين صورت است:

jsfks
     /ant
          build.xml
     /JavaSource
     /WebContent
          /WEB-INF
               /classes
               /lib
                    Jsf-impl.jar
                    Jsf-api.jar
               Faces-config.xml
               Web.xml
          /pages

- فولدر Jsfks فولدر و نام اصلي پروژه است
- فولدر ant اسكريپت هاي مربوط به ant را به همراه فايل پيش فرض build.xml نگهداري مي كند.
- فولدر JavaSource جايي است كه فايل هاي source كلاس هاي جاوا قرار مي گيرند.
- فولدر WebContent فايل هاي واقعي web application را كه توسط application server يا servlet container بكار مي روند، در بر مي گيرد.
- فولدر WEB_INF كه درون WebContent قرار دارد، فايل هايي را نگهداري مي كند كه در زمان اجراي Web Application بكار مي روند، اما از دسترس Browser دور هستند.
- فولدر classes كه درون WEB_INF قرار دارد كلاس هاي كامپايل شده (كامپايل شده بر اساس فايل هاي موجود در JavaSource) را نگهداري مي نمايند.
- فولدر lib درون WEB_INF قرار دارد و كتابخانه هاي مورد نياز Application را نگهداري مي كند. از جمله - Jar file هاي third party (توليد شده توسط توليد كنندگان ديگر)
- دو فايل jsf-impl.jar و jsf-api.jar كه درون فولدر lib قرار دارند، فايل هاي كتابخانه خود JSF مي باشند. هر JSF Application الزاما بايد اين دو فايل را داشته باشد.
- فايل web.xml كه درون WEB_INF قرار دارد Deployment Descriptor ناميده مي شود. اين يك فايل XML است كه servlet و ساير كامپوننت هاي Application در آن معرفي مي شوند.
- فايل faces-config.xml درون WEB_INF قرار دارد كه فايل JSF Configuration است. در اين فايل Bean هاي مورد نياز و قواعد Navigation نوشته مي شوند.
- فولدر pages درون WebContent واقع شده و براي نگهداري صفحات نمايشي JSP و HTML بكار مي رود.

نكته 1: فايل هاي build.xml و Web.xml معمولا توسط خود IDE ها ايجاد و مقداردهي مي شوند و اغلب نيازي به مقداردهي آنها بصورت دستي نيست. اما بطور كلي براي آشنايي با ساختار محتوايي اين فايل ها مي توان به منابع فراواني كه در اينترنت وجود دارند، رجوع نمود.
نكته 2: مثال ذكر شده بر هيچ IDE خاصي مبتني نيست و حالت عام دارد. اما فايل و فولدرهايي كه با Netbeans و ساير IDE ها براي Web Application ساخته مي شود، از نظر نحوه نامگذاري و ساختار، تفاوت هايي با آنچه ذكر شد دارد. بااين حال متناظر با فايل و فولدرهاي ذكر شده در آن ها هم موجود و قابل شناسايي است.

مراحل كار:
1- ساخت صفحات JSP
2- تعريف Navigation Rule
3- ايجاد يك Managed Bean
4- ايجاد يك properties file
5- تعريف محتواي فايل هاي JSP
6- ايجاد فايل index.jsp
7- كامپايل كردن Application
8- Deploy كردن و اجراي Application

ادامه دارد...

mahyar_ev | 10:47 AM | Comment(s)(1)

تفاوت JSF و Struts

August 13, 2007 04:32 PM

يكي از سوالات متداول در ارتباط با JSF تفاوت آن با Struts است.
Struts يك Web Application Framework كد باز جاوا است كه معماري اش مبتني بر MVC است و در آن request ها توسط Controller كه وظيفه مديريت اجزاء Application را به عهده دارد، توزيع مي شوند.
اما همانطور كه قبلا نيز ذكر شد، تكنولوژي JSF يك User Interface Framework است كه تنها بر لايه View از معماري MVC تاكيد دارد. با اين حال برخي عمليات هست كه هم توسط Struts و هم JSF قابل پياده سازي است. اين دو مزايا و معايبي نسبت به يكديگر دارند كه در ادامه به مهمترين آنها اشاره مي شود:

مزاياي اصلي Struts نسبت به JSF عبارتند از:
1- از آنجا كه Struts يك Web Application Framework است، از معماري پيشرفته تري در Controller برخوردار است. برنامه نويسان در Struts مي توانند با ايجاد يك Action object به Controller دستيابي پيدا كنند. در حالي كه JSF امكان دسترسي به controller را فراهم نمي نمايد.
2- Struts شامل يك Layout management framework قدرتمند به نام Tiles است كه به شما امكان ايجاد reusabe Template را مي دهد كه مي توانيد آن را در صفحات مختلف دوباره مورد استفاده قرار دهيد. لذا بدين روش، ظاهر مشابه و يكپارچه اي را براي Application شما فراهم مي سازد.
3- framework اعتبار سنجي struts شامل مجموعه بزرگتري از validator هاي استاندارد است كه بطور اتوماتيك هر دو اعتبارسنجي هاي Server-side و Client-side را بر اساس مجموعه قوانين موجود در يك فايل Configuration ايجاد مي نمايد. همچنين شما مي توانيد Custom Validator ايجاد نماييد و با افزودن definition آن به فايل configuration به راحتي در Application خود، آن را include نماييد.

اما مهمترين مزيت JSF بر Struts مدل UI Component انعطاف پذير و قابل توسعه آن است و شامل اين موارد مي شود:
1- داراي يك API استاندارد براي تعريف وضعيت و رفتار انواع كامپوننت ها است. همچنين كاربران امكان ايجاد كامپوننت هاي جديد را نيز دارند. به علاوه كامپوننت هاي توليد شده توسط توليد كنندگان ديگر نيز در بازار، موجود و بصورت عمومي در دسترس است.
2- يك مدل rendering جداگانه براي تعريف نحوه render شدن كامپوننت ها دارد كه مي توان توسط آن نحوه render شدن كامپوننت را به روش هاي مختلف تعريف نمود. بعنوان مثال يك كامپوننت را كه براي انتخاب يك آيتم از ليست به كار مي رود را مي توان بعنوان يك menu يا radio button آن را render كرد.
3- داراي مدل event و Listener است كه توسط آن event هاي كامپوننت ها را مي توان كدنويسي نمود.
4- داراي مدل هايي براي conversion و validation داده هاي كامپوننت ها است.

از آنجا كه در JSF معماري كامپوننت از definition آن جدا است مي توان نحوه render شدن كامپوننت را به روش هاي گوناگوني فراهم نمود. حتي مي توان آنها را براي كاربران مختلف مثلا كاربران WML نيز render نمود. همچنين شما با JSF مي توانيد كامپوننت هاي جديد ايجاد نماييد. هيچ يك از اين دو، در struts امكان پذير نيست. در واقع در struts هيچ رويكردي درمورد كامپوننت هاي server-side وجود ندارد و به همين دليل نيز هيچ مدل و امكاني براي پاسخگويي به event هاي كامپوننت ها و نگهداري و بازيابي وضعيت كامپوننت ها وجود ندارد. با اين حال struts داراي يك tag library مفيد براي render كردن كامپوننت ها است كه تنها به HTML قابليت render شدن دارند.

مزيت مهم ديگر JSF اين است كه استاندارد است. منظور از استاندارد بودن اين است كه توسط JCP : Java Community Process و براي integrate شدن آسان با ابزار گوناگون ايجاد شده است. در نتيجه از JSF در حال حاضر پشتيباني زيادي مي شود و امكان استفاده از آن در چندين IDE قرار داده شده است.

از آنجا كه JSF و Struts هر دو داراي مزاياي با ارزشي هستند، طراحان شايد هر دو را در application خود بطور همزمان بكار گيرند. طراحان مي توانند مدل كامپوننت JSF را به Struts Application هاي خود وارد نمايند و همچنان از معماري controller موجود در struts بهره ببرند. بطور مشابه طراحاني كه JSF Application دارند مي توانند از مكانيزم هاي قدرتمند اعتبارسنجي client-side و Tiles Layout Framework استفاده كنند. به اين هدف مي توان با استفاده از Struts_Faces integration Library نيز دست يافت.

اين مطلب از FAQ about JSF Technology ترجمه شده است.

mahyar_ev | 04:32 PM | Comment(s)(0)

JSF

July 29, 2007 05:28 PM

JavaServer Faces را مي توان تركيبي از دو تكنولوژي Swing و Struts دانست.
JSF يك Component Framework سمت سرور يا Server_Side براي ايجاد واسط كاربري در Web Application هاي جاوا است. توسط JSF امكان استفاده از Component هاي مرسوم User Interface مانند Button، Textbox و غيره فراهم مي شوند. مي توان رويكرد مبتني بر component اي كه در طراحي Web Application ها در JSF مشاهده مي شود را با ASP.net مقايسه نمود. همچنين جاوا به همراه تكنولوژي JSF، امكان RAD: Rapid Application Development را فراهم نموده است. JSF بر پايه مدل MVC است كه قبلا توضيح داده شد. لذا Well Designed است و معماري آن مثل بقيه Application هايي است كه JSP و Servlet را به كار مي گيرند.
JSF امكان ايجاد و استفاده از دو نوع Component را به كاربر مي دهد:
1- Standard UI Components:
JSF شامل مجموعه component هاي پايه مانند Text box, Check box, List box, Panel, Label, Radio Button و غيره است. مانند موارد زير:
UIForm : فرمي است كه بعنوان Container ساير component ها در نظر گرفته مي شود.
UICommand: مشخص كننده Component هايي چون Button, Hyperlink, menuItem است.
UIinput : معرف component هاي ورودي مثل Text Input Filed است.

2- Custom UI Components:
معمولا نياز است كه طراحان Component ها را Customize نمايند. JSF اين امكان را فراهم مي نمايد. به علاوه JSF از Third Party Component ها نيز حمايت مي كند. منظور از Third Party Components آن Custom Component هايي است كه توسط فروشندگان ديگر توليد شده است. چه آنها كه تجاري و چه آنها كه Open Source اند، همه آنها در ايجاد واسط كاربري Web Application قابل استفاده اند.
براي ايجاد Component لازم است كه يا UIComponent كه يك interface است را implement نماييد، يا اينكه كلاس UIComponentBase را Extend كنيد.

نحوه عملكرد تكنولوژي JSF را در شكل زير مشاهده مي كنيد:
JSF1.JPG
همانگونه كه مي بينيد، واسط كاربري ساخته شده با JSF كه در شكل با myUI نمايش داده شده است روي سرور پردازش مي شود و نتيجه آن به فرمت HTML براي client ارسال مي شود. فايل jsp به نام myform.jsp در واقع يك فايل JSF است و شامل تگ هاي مربوط به JavaServer Faces مي باشد. در اين فايل با استفاده از Custom Tag هاي تعريف شده توسط تكنولوژي JSP اجزا و component هاي واسط كاربري مشخص مي شوند.

يك JSF Application نوعا شامل موارد زير است:
1- مجموعه اي از صفحات JSP. اگر چه كه شما محدود به استفاده از JSP بعنوان تكنولوژي presentation خود نيستيد.
2- تعدادي JavaBeans Component پشت صحنه كه property ها و متدهاي UI Component هاي روي صفحه را مشخص مي كنند.
3- يك فايل Application Configuration Resource كه قواعد Navigation صفحات ، همچنين تنظيمات و مشخصات Beans و ساير Object هاي تعريف شده توسط طراح در آن ثبت مي شود.
4- Deployment Descriptor يا همان فايل web.xml
5- در صورت وجود،مجموعه Object هاي ايجاد شده توسط طراح سيستم
6- مجموعه اي از Custom Tag ها جهت نمايش Custom Objects روي صفحه.

در ادامه بيشتر به اين موضوع پرداخته خواهد شد.

mahyar_ev | 05:28 PM | Comment(s)(0)