Jiramot.info » sitemesh http://www.jiramot.info me?.note.each{ println it } Fri, 30 Jul 2010 19:57:08 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 Simple sitemesh tutorial http://www.jiramot.info/simple-sitemesh-totorial http://www.jiramot.info/simple-sitemesh-totorial#comments Fri, 19 Dec 2008 09:58:41 +0000 admin http://www.jiramot.info/?p=150 Sitemesh ถ้าพูดง่ายๆก็คือ Template Engine ของภาษา Java นั่นเอง โดยหากย้อนกลับไปก่อนหน้านิด หลายๆคนอาจจะรู้จัก Velocity, FreeMaker เป็นต้น หรือว่าเอาให้ง่ายที่สุด sitemesh ก็คือ master page นั่นเอง เอาไว้ทำ layout ของเวปไซต์ของเรา โดยหลักการทำงาน สามารถดูจาก sitemesh

ตัวอย่างนี้จะเป็นการลองใช้ sitemesh กับ jsp
1. เริ่มต้นจากการ ดาวโหลด sitemesh จากนั้นทำการเพิ่ม .jar เข้าไปในไฟล์เดอร์ WEB-INF/lib
2. ทำการเพิ่ม sitemesh filter ในไฟล์ web.xml

1
2
3
4
5
6
7
8
9
10

  <filter>
    <filter-name>sitemesh</filter-name>
    <filter-class>
      com.opensymphony.module.sitemesh.filter.PageFilter
    </filter-class>
  </filter>
  <filter-mapping>
    <filter-name>sitemesh</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>

3. สร้างไฟล์ decorators.xml ไว้ที่ /WEB-INF/decorators.xml

1
2
3
4
5

<decorators defaultdir="/WEB-INF/decorators">
    <decorator name="main" page="main.jsp">
        <pattern>/*.jsp</pattern>
    </decorator>
<decorators>

ดังตัวอย่างนี้ เราจะสร้างไฟล์ decorator ชื่อว่า main.jsp เก็บไว้ยังโฟล์เดอร์ WEB-INF/decorators/ โดยจะใช้ไฟล์นี้เป็นตัวกำหนด layout ของทุกไฟล์ที่มีนามสกุลเป็น .jsp
แต่หากว่าเราต้องการระบุเป็นเฉพาะไฟล์ไป สามารถทำได้โดยการเปลี่ยนเป็น

<pattern>/index.jsp</pattern>
<pattern>/home.jsp</pattern>

4. จากนั้นจะทำการสร้างไฟล์ main.jsp ไว้ที่ WEB-INF/decorators/ เพื่อเป็นไฟล์ที่กำหนด layout ของเรา

<head>
  <title>
    Lumidant.com - <decorator:title default="SiteMesh Tutorial Example" />
  </title>
  <style type="text/css">@import "css/global.css";</style>
  <decorator:head />
  <body>
    <div id="header">
      <h2><a href="http://www.lumidant.com/">Lumidant.com</a> Tutorials</h2>
    </div>
    <div id="content">
      <decorator:body />
    </div>
  </body>
</html>

ทำการสร้างไฟล์ main.jsp เพื่อเป็น layout ของเวป พร้อมทั้งใส่ เข้าไปในส่วนที่ต้องการนำไฟล์หลักเข้ามา mesh ลงใน template

ผลการทำงาน ฝั่ง server เมื่อได้รับ request จะทำการประมวลผล หน้าหลัก จากนั้นจะนำ code ส่วนของ body ของหน้าหลักมา แทนที่ ในไฟล์ template แล้วจึง return respanse กลับไปยัง web browser ของฝั่ง client

]]> http://www.jiramot.info/simple-sitemesh-totorial/feed 0 Introduction to SiteMesh http://www.jiramot.info/introduction-to-sitemesh http://www.jiramot.info/introduction-to-sitemesh#comments Fri, 14 Nov 2008 05:03:33 +0000 admin http://www.jiramot.info/?p=46 เนื่องจากช่วงนี้กำลังศึกษาเจ้า Grails ซึ่งเป็น Web framework คล้ายๆ Rails โดยใช้ภาษา Script ที่ชื่อว่า Groovy ซึ่งเจ้า Groovy เองก็เป็นภาษาที่รันอยู่บน runtime ของ java ทำให้เราสามารถเขียนได้ทั้ง Java หรือ Groovy ได้ตามแต่ถนัด โดยมีข้อดีเหมือนกับภาษา Script ในลักษณะใหม่ๆ ทั่วไป ซึ่งผมจะขอเก็บไว้พูดคราวหลัง

โดย Grails ได้รวม Sitemesh ซึ่งเอาไว้เป็นส่วนหนึ่ง โดยทำหน้าที่จัดการ layout ของหน้าตาเวป โดยมีการทำงานดังนี้

Normal Page Rendering

Normal Page Rendering
โดยปกติแล้วการทำงานของ Browser เริ่มต้นจากการส่ง Request ไปยัง Web Server, จากนั้น Web Server จะส่งหน้าเวปเพจที่ Render แล้วกลับไป, Browser จะทำการแสดงผล
SiteMesh Page Rendering

SiteMesh Page Rendering
หากใช้ SiteMesh จะต่างกันตรงที่ เมื่อ Web Server ทำการ Render เพจเสร็จแล้ว เจ้า SiteMesh จะทำการเพิ่มข้อมูลลงในเพจ จากนั้นจะส่งกลับไปยัง Browser
]]> http://www.jiramot.info/introduction-to-sitemesh/feed 1