文档章节

SiteMesh3简介及使用

七弦桐
 七弦桐
发布于 01/14 23:38
字数 2075
阅读 8
收藏 1

介绍

SiteMesh 是一个网页布局和修饰的框架,利用它可以将网页的内容和页面结构分离,以达到页面结构共享的目的。

Sitemesh 是由一个基于Web 页面布局、装饰以及与现存 Web 应用整合的框架。它能帮助我们在由大量页面构成的项目中创建一致的页面布局和外观,如一致的导航条,一致的 banner,一致的版权,等等。它不仅仅能处理动态的内容,如 jsp,php,asp 等产生的内容,它也能处理静态的内容,如 htm 的内容,使得它的内容也符合你的页面结构的要求。甚至于它能将 HTML 文件象 include 那样将该文件作为一个面板的形式嵌入到别的文件中去。所有的这些,都是 GOF 的 Decorator 模式的最生动的实现。尽管它是由 java 语言来实现的,但它能与其他 Web 应用很好地集成。

下图是SiteMesh的结构图:

工作原理

SiteMesh 是基于 Servlet 的 filter 的,即过滤流。它是通过截取 response,并进行装饰后再交付给客户。

其中涉及到两个名词: 装饰页面(decorator page)和 被装饰页面(Content page), 即 SiteMesh 通过对 Content Page 的装饰,最终得到页面布局和外观一致的页面,并返回给客户。

运行SiteMesh3至少需要:

  • JDK 1.5
  • 一个Servlet 2.5兼容容器
  • SiteMesh 运行时库

配置及使用

下载

wiki上的下载链接为:http://wiki.sitemesh.org/wiki/display/sitemesh3/Home

GitHub上3.0.1版本下载地址为(含demo):https://github.com/sitemesh/sitemesh3/releases/tag/3.0.1

1、添加maven依赖

pom.xml文件添加以下依赖:

<!--sitemesh-->
<dependency>
     <groupId>org.sitemesh</groupId>
     <artifactId>sitemesh</artifactId>
     <version>3.0.1</version>
 </dependency>

2、web.xml中添加SiteMesh过滤器

<web-app>
    ...
    <filter>
        <filter-name>sitemesh</filter-name>
        <filter-class>org.sitemesh.config.ConfigurableSiteMeshFilter</filter-class>
    </filter>

    <filter-mapping>
        <filter-name>sitemesh</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
</web-app>

3、创建一个“装饰页面”(decorator page)

该装饰页面包含Web应用程序中常见得布局和样式,它是一个包含<title>,<head><body>元素的模板。它至少要包含:

<HTML>
  <HEAD>
    <title> <sitemesh:write property ='title'/> </ title>
    <sitemesh:write property ='head'/>
  </HEAD>
  <BODY>
    <sitemesh:write property ='body'/>
  </BODY>
</HTML>

标签`<sitemesh:write property='...'/>`将会被 SiteMesh 重写,用来包含从『被装饰页面』(content page)中提取到的值。可以从被装饰页面(content page)中提取更多的属性,并且可以自定义规则 。 

在WEB应用程序中创建`/decorator.html`,其中包含:

```html
<html>
  <head>
    <title>SiteMesh example: <sitemesh:write property='title'>Title goes here</sitemesh:write></title>
    <style type='text/css'>
      body { font-family: arial, sans-serif; background-color: #ffffcc; }
      h1, h2, h3, h4 { text-align: center; background-color: #ccffcc; border-top: 1px solid #66ff66; }
      .disclaimer { text-align: center; border-top: 1px solid #cccccc; margin-top: 40px; color: #666666; font-size: smaller; }
    </style>
    <sitemesh:write property='head'/>
  </head>
  <body>
    <h1 class='title'>SiteMesh example site: <sitemesh:write property='title'>Title goes here</sitemesh:write></h1>

    <sitemesh:write property='body'>Body goes here. Blah blah blah.</sitemesh:write>

    <div class='disclaimer'>Site disclaimer. This is an example.</div>
    <div class='navigation'>
      <b>Examples:</b>
      [<a href="./">Static example</a>]
      [<a href="demo.jsp">Dynamic example</a>]
    </div>
  </body>
</html>

在这个例子中,装饰页面是一个静态的.html文件,但是如果你希望用动态页面,那么可以使用诸如JSP,FreeMarker等技术。

4、创建一个“被装饰页面”(content page)

<html>
  <head>
    <title>Hello World</title>
  </head>
  <body>
    <p>Well hello there, fine world.</p>
    <p>And so concludes this <b>SiteMesh</b> example.</p>

    <h2>How it works</h2>
    <ul>
      <li>This page (<code>/index.html</code>) contains vanilla HTML content.</li>
      <li>SiteMesh is configured (in <code>/WEB-INF/web.xml</code>) to apply a decorator to all paths (<code>/*</code>).</li>
      <li>The decorator (<code>/decorator.html</code>) contains the common look and feel that is applied to the site.</li>
    </ul>
  </body>
</html>

像装饰页面一样,被装饰页面可以是静态文件,也可以是由 Servlet 引擎动态生成(例如JSP)。

5、配置

SiteMesh 配置支持两种方法 : XML 或 Java。

5.1、XML方式

在工程的 /WEB-INF/sitemesh3.xml中添加以下设置:

<sitemesh>
  <mapping path="/*" decorator="/decorator.html"/>
</sitemesh>

5.1、Java方式

要使用 Java 的配置方式,自定义的 SitMesh 过滤器需要继承org.sitemesh.config.ConfigurableSiteMeshFilter并重写applyCustomConfiguration(SiteMeshFilterBuilder builder)方法。 具体如下:

package com.wangxiaoan1234;

import org.sitemesh.builder.SiteMeshFilterBuilder;
import org.sitemesh.config.ConfigurableSiteMeshFilter;

public class MySiteMeshFilter extends ConfigurableSiteMeshFilter {

    [@Override](https://my.oschina.net/u/1162528)
    protected void applyCustomConfiguration(SiteMeshFilterBuilder builder) {
        builder.addDecoratorPath("/*", "/decorator.html");
    }
}

既然使用 Java 配置方式,就不再需要sitemesh3.xml文件,但是在web.xml中要使用自己重写的 SiteMesh 过滤器。 即web.xml的设置改成如下所示:

<filter>
    <filter-name>sitemesh</filter-name>
    <filter-class>com.wangxiaoan1234.MySiteMeshFilter</filter-class>
</filter>

<filter-mapping>
    <filter-name>sitemesh</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

6、查看效果

本地查看内容页面.html效果如下:

通过SiteMesh3装饰后访问效果如下:

查看该效果页面源代码如下:

<html>
  <head>
    <title>SiteMesh example: Hello World (Dynamic)</title>
    <style type='text/css'>
      body { font-family: arial, sans-serif; background-color: #ffffcc; }
      h1, h2, h3, h4 { text-align: center; background-color: #ccffcc; border-top: 1px solid #66ff66; }
      .disclaimer { text-align: center; border-top: 1px solid #cccccc; margin-top: 40px; color: #666666; font-size: smaller; }
    </style>
    <style type='text/css'>
      .date { font-weight: bold; padding: 10px; font-size: larger; }
    </style>

  </head>
  <body>
    <h1 class='title'>SiteMesh example site: Hello World (Dynamic)</h1>
    <p>This page demonstrates that dynamic content can be decorated in the same way as static content.</p>
    <p>This is a simple JSP that shows the date and time on the server is now:</p>

    <div class='date'>Tue Aug 15 14:25:41 CST 2017</div>

    <p>Of course, with SiteMesh you are not limited to JSP. Because it's a Servlet Filter, both content and decorators can be
    generated by any technology in your ServletEngine, including: static files, JSP, Velocity, FreeMarker, JSF, MVC frameworks, JRuby.... you get the point.</p>
    <div class='disclaimer'>Site disclaimer. This is an example.</div>
    <div class='navigation'>
      <b>Examples:</b>
      [<a href="./">Static example</a>]
      [<a href="demo.jsp">Dynamic example</a>]
    </div>

  </body>
</html>

7、高级配置

7.1、XML形式配置

sitemesh3.xml文件如下:

<?xml version="1.0" encoding="UTF-8"?>
<sitemesh>
    <!--默认情况下,sitemesh 只对 HTTP 响应头中 Content-Type 为 text/html 的类型进行拦截和装饰,我们可以添加更多的 mime 类型-->
    <mime-type>text/html</mime-type>
    <mime-type>application/vnd.wap.xhtml+xml</mime-type>
    <mime-type>application/xhtml+xml</mime-type>

    <!-- 默认装饰器,当下面的路径都不匹配时,启用该装饰器进行装饰 -->
    <mapping decorator="/default-decorator.html"/>

    <!--不同的匹配路径采用不同的装饰页面-->
    <mapping path="/admin/*" decorator="/another-decorator.html"/>
    <mapping path="/*.special.jsp" decorator="/special-decorator.html"/>

    <!--一个匹配路径同时采用不同的装饰页面-->
    <mapping>
        <path>/articles/*</path>
        <decorator>/decorators/article.html</decorator>
        <decorator>/decorators/two-page-layout.html</decorator>
        <decorator>/decorators/common.html</decorator>
     </mapping>

    <!-- 满足该匹配路径将不被装饰 -->
    <mapping path="/login.htm" exclue="true" />

    <!-- 自定义标签 -->
    <content-processor>
        <tag-rule-bundle class="com.something.CssCompressingBundle" />
        <tag-rule-bundle class="com.something.LinkRewritingBundle"/>
  </content-processor>
</sitemesh>

7.2、Java形式配置

对应 Java 配置如下(同理还是在web.xml中引用自己的 SiteMesh 过滤器):

package com.wangxiaoan1234;

import org.sitemesh.builder.SiteMeshFilterBuilder;
import org.sitemesh.config.ConfigurableSiteMeshFilter;

public class MySiteMeshFilter extends ConfigurableSiteMeshFilter {

    [@Override](https://my.oschina.net/u/1162528)
    protected void applyCustomConfiguration(SiteMeshFilterBuilder builder) {
        //默认装饰器,当下面的路径都不匹配时,启用该装饰器进行装饰
        builder.addDecoratorPath("/*", "/decorator.html")
            //添加更多的 mime 类型
            .setMimeTypes("text / html","application / xhtml + xml","application / vnd.wap.xhtml + xml")
            //不同匹配路径采用不同的装饰页面
            .addDecoratorPath("/admin/*", "/another-decorator.html")
            .addDecoratorPath("/*.special.jsp", "/special-decorator.html")
            //一个匹配路径同时采用不同的装饰页面
            .addDecoratorPaths("/articles/*", "/decorators/article.html",
                    "/decoratos/two-page-layout.html",
                    "/decorators/common.html")
            //满足该匹配路径将不被装饰
            .addExcludedPath("/javadoc/*")
            //添加自定义标签
            .addTagRuleBundle(new CssTagRuleBundle());
    }
}

其中自定义标签类格式如下:

package com.wangxiaoan1234;

import org.sitemesh.SiteMeshContext;
import org.sitemesh.content.ContentProperty;
import org.sitemesh.content.tagrules.TagRuleBundle;
import org.sitemesh.content.tagrules.html.ExportTagToContentRule;
import org.sitemesh.tagprocessor.State;

/**
 * 自定义标签
 */
public class CssTagRuleBundle implements TagRuleBundle {
    [@Override](https://my.oschina.net/u/1162528)
    public void install(State defaultState, ContentProperty contentProperty, SiteMeshContext siteMeshContext) {
        defaultState.addRule("my-css",
                new ExportTagToContentRule(siteMeshContext, contentProperty.getChild("my-css"), false));
        defaultState.addRule("my-footer",
                new ExportTagToContentRule(siteMeshContext, contentProperty.getChild("my-footer"), false));
    }

    [@Override](https://my.oschina.net/u/1162528)
    public void cleanUp(State defaultState, ContentProperty contentProperty, SiteMeshContext siteMeshContext) {
    }
}

web.xml中还可以指定请求来源:

<filter>
    <filter-name>sitemesh</filter-name>
    <filter-class>com.wangxiaoan1234.MySiteMeshFilter</filter-class>
  </filter>
  <filter-mapping>
    <filter-name>sitemesh</filter-name>
    <url-pattern>/*</url-pattern>
      <dispatcher>FORWARD</dispatcher>
      <dispatcher>REQUEST</dispatcher>
  </filter-mapping>

<dispatcher>这个元素有四个可能的值:即 REQUEST、FORWARD、INCLUDE 和 ERROR,这个元素使得 filter 将会作用于直接从客户端过来的request,通过 forward 过来的 request,通过 include 过来的 request 和通过<error-page>过来的 request。如果没有指定任何K元素,默认值是REQUEST。

自定义标签的使用:

装饰页面(decorator):

<html>
<head>
  <title>SiteMesh example: <sitemesh:write property='title'>Title goes here</sitemesh:write></title>
  <style>
    <sitemesh:write property='my-css'/>
  </style>
  <sitemesh:write property='head'/>
  </head>
  <body>
    <div>
      <p>pppppppppppppppppppppp</p>
    </div>
  <siteMesh:write property='my-footer'/>
  </body>
</html>

内容页面(content):

<html>
  <head>
    <title>Hello World</title>
    <my-css>
      div p {
      color : red;
      }
    </my-css>
  </head>
  <body>
    <p>Well hello there, fine world.</p>
    <p>And so concludes this <b>SiteMesh</b> example.</p>
  <my-footer>
    <div style="text-align: center">
      &copy;wangxiaoan1234.com
    </div>
  </my-footer>
  </body>
</html>

效果:

效果页面源码

<html>
<head>
  <title>SiteMesh example: Hello World</title>
  <style>

      div p {
      color : red;
      }

  </style>
  </head>
  <body>
    <div>
      <p>pppppppppppppppppppppp</p>
    </div>

    <div style="text-align: center">
      &copy;wangxiaoan1234.com
    </div>

  </body>
</html>

本文转载自:https://blog.csdn.net/wangxiaoan1234/article/details/77017546

共有 人打赏支持
下一篇: Quartz 教程
七弦桐
粉丝 1
博文 7
码字总数 11070
作品 0
石景山
私信 提问
SpringMVC整合sitemesh3后无法POST

从新整理一下: 问题描述: SpringMVC中有一个方法被定义为 method= RequestMethod.POST, 详细代码如下 配置完后用一页面测试请求,代码如下 一切完美运行,没有任何错误 现在引入sitemesh3...

Nesson
2013/04/10
3.4K
2
Struts2结合sitemesh3制作网站母版页面

上一篇文章介绍了sitemesh3的使用,这篇文章来介绍如何结合struts2来配置和使用sitemesh,具体的如何使用sitemesh3我就不讲解了,这个你们可以看看我的上一篇博客。 首先你要添加struts和sit...

awbeci
2014/08/04
0
0
sitemesh3折磨我两天的问题

sitemesh3可不可以定义个name或者body啊, 比如我把A.jsp和B.jsp两个页面都定义在main.jsp里面 可不可以在main.jsp里面 左面显示A.jsp右边显示B.jsp 也就是说sitemesh3可以定义id或者name吗 ...

很纠结
2012/03/06
4.5K
8
sitemesh3 简单使用

sitemesh3 是使用filter安装装饰器模式对请求返回的内容进行装饰。 demo.html decorator.html 在web.xml中使用sitemesh的filter 然后在配置sitemesh3.xml,这个是sitemesh3的配置文件在/WEB-...

独钓渔
2016/12/22
42
0
关于 sitemesh3 性能问题

谁做过sitemesh3的性能测试。sitemesh3性能怎么样?大家都用哪个布局页面的?

Mr.CT
2012/02/06
5.1K
6

没有更多内容

加载失败,请刷新页面

加载更多

外教比较

确定收费的模式 确定授课的模式 确定教学的方式-用什么样的方式能让人更快更好的学会 确定核心竞争力-比如我们的师资是牛津大学的 英语流利说 收费的模式-报特色课程,比如训练营之类的,其实...

V字仇杀
8分钟前
0
0
上下文无关文法介绍

上下文无关文法 上下文无关文法是用来描述程序语言的一种表达方式,通过简单的符号描述语言的集合。正如我们所知道,一个程序即为一个句子(字符串),语言就是所有句子的集合。上下文无关文...

陶小陶
18分钟前
3
0
eggjs与sequelize简单demo

参考 egg 官方文档 安装 // 依赖npm install --save egg-sequelize mysql2// ts 类型npm install --save @types/sequelize 插件,config/plugin.ts import { EggPlugin } from 'egg';......

Geeyu
今天
1
0
看过上百部片子的这个人教你视频标签算法解析

本文由云+社区发表 随着内容时代的来临,多媒体信息,特别是视频信息的分析和理解需求,如图像分类、图像打标签、视频处理等等,变得越发迫切。目前图像分类已经发展了多年,在一定条件下已经...

腾讯云加社区
今天
4
0
2. 红黑树

定义:红黑树(Red-Black Tree,简称R-B Tree),它一种特殊的二叉查找树(Binary Search Tree)。 要理解红黑树,先要了解什么是二叉查找树。在上一章中,我们学习了什么是二叉树,以及二叉树...

火拳-艾斯
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部