Sitemesh tutorial - page decoration technology principles and applications

Sitemesh tutorial - page decoration technology principles and applications

1. Basic Concepts

1. Sitemesh is a page decoration technology:

1 : It intercepts page access through filters
2 : Find the appropriate decoration template based on the URL of the visited page
3 : Extract the content of the visited page and put it in the appropriate position in the decoration template
4 : Finally, the decorated page is sent to the client.

2. In sitemesh, pages are divided into two types: decorative templates and ordinary pages.
1) Decorative template refers to a page used to decorate other pages.
2) Ordinary pages, generally referring to various application pages.
3. Next, we will use a simple example to illustrate the basic principle of sitemesh modification of web pages.

Second, the principle of template modification of web pages







Through Sitemesh's registration mechanism, tell Sitemesh to use the XXX template (assuming the previous template is used) to modify the visited page when accessing the path.



When the user clicks "Show the Great Wall" (/ShowGreatWall.do) in the left navigation bar, the "Show the Great Wall" page on the right will be decorated with the specified template



To summarize the above process, the basic principle of Sitemesh modifying web pages can be explained as follows:



3. Configuration and use of Sitemesh

1) Add filter definition and sitemesh taglib definition to WEB-INF/web.xml

Copy
the code as follows:

<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>
<taglib>
<taglib-uri>sitemesh-decorator</taglib-uri>
<taglib-location>/WEB-INF/sitemesh-decorator.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>sitemesh-page</taglib-uri>
<taglib-location>/WEB-INF/sitemesh-page.tld</taglib-location>
</taglib>

2) Create WEB-INF/decorators.xml, in which you can configure which templates are included and which URLs each template modifies. You can also configure which URLs do not need template control. An example of decorators.xml is as follows:

Copy
the code as follows:

<excludes>
<pattern>/Login*</pattern>
</excludes>
<decorators defaultdir="/decorators">
<decorator name="main" page="DecoratorMainPage.jsp">
<pattern>/*</pattern>
</decorator>
<decorator name="pop" page="PopPage.jsp">
<pattern>/showinfo.jsp*</pattern>
<pattern>
/myModule/GreatWallDetailAction.do*
</pattern>
</decorator>
</decorators>

3) Let's look at an example of a modified template

Copy
the code as follows:

<%@page contentType="text/html;?charset=GBK"%>
<%@taglib uri="sitemesh-decorator"?prefix="decorator" %>
<html>
<head>
<title> <decorator:title/> </title>
<decorator:head/>
</head>
<body>
Hello World <hr/>
<decorator:body/>
</body>
</html>

4) Let's look at an example of a modified page:

Copy
the code as follows:

<%@ page contentType="text/html;?charset=GBK"%>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<p>Decorated page goes here.</p
</body>
</html>

5) Let’s take a look at the Sitemesh tag

<decorator:head />

that can be used in the decoration template

and extract the content in the head tag of the decorated page.

<decorator:body />

takes out the content of the body tag of the decorated page.

<decorator:title default="" />

takes out the content of the title tag of the decorated page. default is the default value

<decorator:getProperty property="" default="" writeEntireProperty=""/>

takes out the attribute value of the relevant tag of the decorated page.

writeEntireProperty indicates whether to display the value of the property or

the attribute of the "property=value" HTML tag
Body Tag Attributes

Note that if the content value

of the Meta tag

contains ">" or <", an error will be reported and it needs to be transcoded. For example, &lt;

default is the default value.

<decorator:usePage id="" />

will be constructed as an object by the decorated page and can be directly referenced in the JSP of the decorated page .

6) See an example of using tags in a decoration template

Copy
the code as follows:

<html lang=" <decorator:getProperty property="lang"/> ">
<head>
<title> <decorator:title default="Hello" /> </title>
<decorator:head />
</head>

<body <decorator:getProperty property="body.onload" writeEntireProperty="1"/> >
Get the name of the variable company from meta:
<decorator:getProperty property="meta.company"/>
The following is the content of the body of the modified page:
<decorator:body />
<decorator:usePage id="myPage" />
<%=myPage.getRequest().getAttribute("username")%>
</body>
</html>

7) Take a look at the corresponding code in the modified page:

Copy
the code as follows:

<html lang="en">
<head>
<title>My sitemesh</title>
<meta name="company" content="smartdot"/>
<meta name="Author" content="zhangsan"/>
<script>
function count(){return 10;}
</script>
</head>
<body onload="count()">
<p>This is a modified page</p>
</body>
</html>

IV. Conclusion

1. The most important thing about Sitemesh is to make templates for decoration, and configure these templates in decorators.xml to decorate which pages. Therefore, the main process of using Sitemesh is to make a decoration template and then configure the URL Pattern in decorators.xml

2. Analyze the entire project to see which pages need to be abstracted into templates. For example, secondary pages, tertiary pages, pop-up windows, etc. may all need to be made into corresponding templates. Generally speaking, a large OA system will not have more than 8 templates.

What if a special request path is within the scope of the filter but you don’t want to use a template

?


You can't be so unreasonable!

Don't worry, SiteMesh has already considered this, and the decorators.xml mentioned in step 5 above will come into play at this time!
Below is my decorators.xml :

Copy
the code as follows:

<?xml version="1.0" encoding="ISO-8859-1"?>
<decorators defaultdir="/decorators">
<!-- Any urls that are excluded will never be decorated by Sitemesh -->
<excludes>
<pattern>/index.jsp*</pattern>
<pattern>/login/*</pattern>
</excludes>
<decorator name="main" page="main.jsp">
<pattern>/*</pattern>
</decorator>
</decorators>

There are two main nodes in decorators.xml :
The decorator node specifies the location and file name of the template, and uses the pattern to specify which paths reference which templates.
The excludes node specifies which paths of requests do not use any templates.

For example, in the above code, /index.jsp and any request path starting with /login/ do not use templates.

Another point to note is that the defaultdir attribute of the decorators node specifies the directory where template files are stored.

<<:  Using CSS3 to implement font color gradient

>>:  A practical record of an accident caused by MySQL startup

Recommend

Solution to Vue's inability to watch array changes

Table of contents 1. Vue listener array 2. Situat...

JS+Canvas draws a lucky draw wheel

This article shares the specific code of JS+Canva...

MySQL Binlog Data Recovery: Detailed Explanation of Accidentally Deleting a Database

MySQL Bin log data recovery: accidentally delete ...

MySQL sorting using index scan

Table of contents Install sakila Index Scan Sort ...

Analyzing Linux high-performance network IO and Reactor model

Table of contents 1. Introduction to basic concep...

In-depth analysis of HTML table tags and related line break issues

What is a table? Table is an Html table, a carrie...

What does href=# mean in a link?

Links to the current page. －－－－－－－－－－－－－－－－－－－ Com...

Introduction to possible problems after installing Tomcat

1. Tomcat service is not open Enter localhost:808...

Several popular website navigation directions in the future

<br />This is not only an era of information...

How to use node to implement static file caching

Table of contents cache Cache location classifica...

Solution to MySQL connection exception and error 10061

MySQL is a relational database management system ...

How to verify whether MySQL is installed successfully

After MySQL is installed, you can verify whether ...

How to construct a table index in MySQL

Table of contents Supports multiple types of filt...

Detailed process of compiling and installing Storm on Kylin V10 server

1 Introduction Apache Storm is a free, open sourc...

Sharing ideas on processing tens of millions of data in a single MySQL table

Table of contents Project Background Improvement ...