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

其中涉及到两个名词: 装饰页面(decorator page)和 “被装饰页面(Content page)" , 即 SiteMesh通过对Content Page的装饰,最终得到页面布局和外观一直的页面,

并返回给客户

运行环境需要:servlet2.3 , JDK1.4 以上。

正常模式下的web访问流程

加入SiteMesh装饰的web访问流程

一:搭建SiteMesh环境及简单使用

1.1:准备资源

siteMesh2.4.jar, sitemesh-page.tld , sitemesh-decorator.tld 这个三个必要文件

将jar包复制进/WEB-INF/lib目录下, 两个tld文件导入/WEB-INF下即可

在web.xml中加入siteMesh的filter和taglib

<filter>  
   <filter-name>sitemesh</filter-name>  
   <filter-class>com.opensymphony.sitemesh.webapp.SiteMeshFilter</filter-class>  
 </filter>  
  
 <filter-mapping>  
   <filter-name>sitemesh</filter-name>  
   <url-pattern>/*</url-pattern>  
 </filter-mapping>   
  
<!-- not required for containers that fully support JSP 1.2 -->  
 <taglib>  
   <taglib-uri>sitemesh-page</taglib-uri>  
   <taglib-location>/WEB-INF/lib/sitemesh-page.tld</taglib-location>  
 </taglib>  
 <taglib>  
   <taglib-uri>sitemesh-decorator</taglib-uri>  
   <taglib-location>/WEB-INF/lib/sitemesh-decorator.tld</taglib-location>  
 </taglib>  

1.2 建立decorators.xml

在/WEB-INF下创建decorators.xml文件,siteMesh通过该文件来获知"装饰页面"和"被装饰页面"的映射

decorators.xml

<?xml version="1.0" encoding="UTF-8"?>  
  
<!-- 默认目录 -->  
<decorators defaultdir="/decorators">  
  
    <!-- 缺省装饰页 -->  
    <decorator name="main" page="main.jsp">  
        <pattern>/*</pattern>  
    </decorator>  
       
    <!-- 自定义装饰页,我们下面实例就是这部分起作用 -->  
    <decorator name="mai" page="mai.jsp">  
        <pattern>/mai.html</pattern>  
    </decorator>  
  
    <!-- 只装饰一个页面也可用这种方式定义 -->  
    <decorator name="panel" page="panel.jsp"/>  
  
    <!-- 装饰velocity模板 -->  
    <decorator name="velocity" page="velocity.vm">  
        <pattern>/velocity.html</pattern>  
    </decorator>  
      
    <!-- 装饰freeMarker模板 -->  
    <decorator name="freemarker" page="freemarker.ftl">  
        <pattern>/freemarker.html</pattern>  
    </decorator>  
  
    <decorator name="test" page="test.jsp">  
        <pattern>/agent.jsp</pattern>  
    </decorator>  
</decorators>  

下边是对上边中所缺少的一些补充

<?xml version="1.0" encoding="utf-8"?>    
<decorators defaultdir="/decorators">    
    <!-- 此处用来定义不需要过滤的页面 -->    
    <excludes>    
    </excludes>    
    
 <!-- 用来定义装饰器要过滤的页面 -->    
    <decorator name="main" page="main.jsp">    
        <pattern>/*</pattern>    
    </decorator>    
</decorators>

1.3 装饰页的创建

在web目录(或者webContent)下创建文件夹decorators,在文件夹中建立mai.jsp文件

<%@ page language="java" contentType="text/html; charset=UTF-8"  
    pageEncoding="UTF-8"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
  
/*这里导入了SiteMesh的标签库 */  
  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  
OK,there is a decorator begin!<hr />  
    /*这里的意思是,被装饰页的title内容将会在这里插入 */  
    <decorator:title></decorator:title>  
    
</head>  
<body>  
    /*被修饰页的body内容将在这里插入  
    <decorator:body></decorator:body>  
  
<hr />Yse,there is a decorator end !  
  
</body>  
</html>  

1.4 被修饰页的创建

在web目录(或webContent)下创建mai.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Insert title here</title>  
</head>  
<body>  
this is the Content Page !!!  
</body>  
</html>  

1.5 使用tomcat进行示例运行,访问http://localhost:8080/{your project name}/mai.html , 运行结果如下:

1.6 sitemesh.xml的配置(可选, 示例中没有用到该文件)

该配置文件用于高级元素的配置,有具体需要的可以配置

<sitemesh>  
    <property name="decorators-file" value="/WEB-INF/decorators.xml"/>  
    <excludes file="${decorators-file}"/>  
  
    <page-parsers>  
        <parser content-type="text/html" class="com.opensymphony.module.sitemesh.parser.HTMLPageParser" />  
    </page-parsers>  
  
    <decorator-mappers>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.PageDecoratorMapper">  
            <param name="property.1" value="meta.decorator" />  
            <param name="property.2" value="decorator" />  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.FrameSetDecoratorMapper">  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.AgentDecoratorMapper">  
            <param name="match.MSIE" value="ie" />  
            <param name="match.Mozilla [" value="ns" />  
            <param name="match.Opera" value="opera" />  
            <param name="match.Lynx" value="lynx" />  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.PrintableDecoratorMapper">  
            <param name="decorator" value="printable" />  
            <param name="parameter.name" value="printable" />  
            <param name="parameter.value" value="true" />  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.RobotDecoratorMapper">  
            <param name="decorator" value="robot" />  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.ParameterDecoratorMapper">  
            <param name="decorator.parameter" value="decorator" />  
            <param name="parameter.name" value="confirm" />  
            <param name="parameter.value" value="true" />  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.FileDecoratorMapper">  
        </mapper>  
  
        <mapper class="com.opensymphony.module.sitemesh.mapper.ConfigDecoratorMapper">  
            <param name="config" value="${decorators-file}" />  
        </mapper>  
  
    </decorator-mappers>  
  
</sitemesh>  

使用总结:整个过程配置是相对简单的,先导入所需资源,然后再配置filter,之后是derator page和content page的创建以及他们之间的映射关系,配置命令是相对简单的,简单的需求上面这些已经足矣。

二:使用示例

2.1 例子1

在{myapp}/WEB-INF/decorators.xml文件中添加以下decorator

<decorator name="mydecorator1" page="mydecorator1.jsp">  
        <pattern>/test1.jsp</pattern>  
    </decorator>

在{myapp}/decorators目录下添加mydecorator1.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<html>  
    <head>  
        <title>My Site - <decorator:title default="Welcome!" /></title>  
        <decorator:head />  
    </head>  
    <body>  
        <decorator:body />  
        <p>This message is in /decorators/mydecorator1.jsp</p>         
    </body>  
</html>  

在{myapp}目录下添加test1.jsp文件,内容如下:

<%@page contentType="text/html"%>  
<%@page pageEncoding="UTF-8"%>  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>This is test1</title>  
    </head>  
    <body>  
    <b>This is test1</b>  
    </body>  
</html>  
  • 打开浏览器,访问http://localhost:8080/myapp/test1.jsp,将会出现一下内容:

This is test1

This message is in /decorators/mydecorator1.jsp

2.2 例子2(decorator:getProperty)

有时候,我们期望修改页面中某个有固定标记的片段,例如我们的jsp中有一个标记<mytag>...</mytag>,此时可以用如下方法实现:

在{myapp}/WEB-INF/decorators.xml文件中添加以下decorator

<decorator name="mydecorator2" page="mydecorator2.jsp">  
<pattern>/test2.jsp</pattern>  
</decorator>  

在{myapp}/decorators目录下添加mydecorator2.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
  
<html>  
    <head>  
        <title>My Site - <decorator:title default="Welcome!" /></title>  
        <decorator:head />  
    </head>  
  
    <body>  
        <decorator:body />  
        <decorator:getProperty property="page.content1"/>  
        <decorator:getProperty property="page.content2"/>  
          
        <!-- do nothing -->  
        <decorator:getProperty property="page.content3"/>  
        <p>This message is in /decorators/mydecorator2.jsp</p>  
    </body>  
</html>  

在{myapp}目录下添加test2.jsp文件,内容如下:

<%@page contentType="text/html"%>  
<%@page pageEncoding="UTF-8"%>  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>This is test2</title>  
    </head>  
     
    <body>  
    <b>This is test2</b>  
    <b>Use <decorator:getProperty> tag</b>  
     
    <content tag="content1"><p>This is content1</p></content>  
    <content tag="content2"><p>This is content2</p></content>  
    <content tag="content4"><p>This is content4, it shouldn't be display</p></content>  
    </body>  
</html>  

打开浏览器,访问http://localhost:8080/myapp/test2.jsp,将会出现一下内容:

This is test2

Use <decorator:getProperty> tag

This is content1

This is content2

This message is in /decorators/mydecorator2.jsp

2.3 例子3 (page:applyDecorator tag)

在{myapp}/WEB-INF/decorators.xml文件中添加以下decorator:

<decorator name="mydecorator3" page="mydecorator3.jsp">  
    <pattern>/test3.jsp</pattern>  
</decorator>  
<decorator name="mydecorator31" page="mydecorator31.jsp">  
</decorator> 

在{myapp}/decorators目录下添加mydecorator3.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>  
<html>  
    <head>  
        <title>My Site - <decorator:title default="Welcome!" /></title>  
        <decorator:head />  
    </head>  
  
    <body>  
        <decorator:body />  
        <page:applyDecorator name="mydecorator31">  
            <content tag="content1"><p>This is content1</p></content>  
            <content tag="content2"><p>This is content2</p></content>  
        </page:applyDecorator>  
    </body>  
</html>  

在{myapp}/decorators目录下添加mydecorator31.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>  
  
<p><i>begin</i></>  
<decorator:getProperty property="page.content1"/>  
<decorator:getProperty property="page.content2"/>  
<p><i>end</i></>  
在{myapp}目录下添加test3.jsp文件,内容如下:  
<%@page contentType="text/html"%>  
<%@page pageEncoding="UTF-8"%>  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>This is test3</title>  
    </head>  
     
    <body>  
    <b>This is test3</b>  
    <b>Use <page:applyDecorator> tag</b>  
    </body>  
</html>  

注意:相对于例子2,这里已经没有了<content tag="XXX"/>标签。

打开浏览器,访问http://localhost:8080/myapp/test3.jsp,将会出现一下内容:

This is test3

Use <page:applyDecorator> tag

begin

This is content1

This is content2

end

这里,我在mydecorator3.jsp中应用了mydecorator31.jsp的的decorator,并且将原来在test2.jsp中的 <content />标签复制到mydecorator3.jsp中,此时对于<content tag="xxx"/>的标签将会由mydecorator31.jsp了装饰。

2.4 例子4(page:parm tag)

在{myapp}/WEB-INF/decorators.xml文件中添加以下decorator:

<decorator name="mydecorator4" page="mydecorator4.jsp">  
        <pattern>/test4.jsp</pattern>  
    </decorator>  
      
    <decorator name="mydecorator41" page="mydecorator41.jsp">  
    </decorator>  

在{myapp}/decorators目录下添加mydecorator4.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>  
  
<html>  
    <head>  
        <title>My Site - <decorator:title default="Welcome!" /></title>  
        <decorator:head />  
    </head>  
    <body>  
        <decorator:body />  
        <page:applyDecorator name="mydecorator41" >  
            <content tag="content1"><p>This is content1</p></content>  
            <content tag="content2"><p>This is content2</p></content>  
            <page:param name="page.content1"><p>This content1 has been replaced</p></page:param>  
        </page:applyDecorator>  
    </body>  
</html>  

在{myapp}/decorators目录下添加mydecorator41.jsp文件,内容如下:

<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>  
<%@ taglib uri="http://www.opensymphony.com/sitemesh/page" prefix="page" %>  
  
<p><i>begin</i></>  
<decorator:getProperty property="page.content1"/>  
<decorator:getProperty property="page.content2"/>  
<p><i>end</i></>  

在{myapp}目录下添加test4.jsp文件,内容如下:

<%@page contentType="text/html"%>  
<%@page pageEncoding="UTF-8"%>  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
        <title>This is test4</title>  
    </head>  
     
    <body>  
    <b>This is test4</b>  
    <b>Use <page:param> tag</b>  
    </body>  
</html>   

打开浏览器,访问http://localhost:8080/myapp/test4.jsp,将会出现一下内容:

This is test4

Use <page:param> tag

begin

This content1 has been replaced

This is content2

end

这里,我在mydecorator4.jsp中应用了mydecorator41.jsp的的decorator,并且添加了<page:param name="page.content1">标签,那么此时页面上将会用<page:param>标签中的内容替换原来在<decorator:getProperty property="page.content1"/>中的内容,因此页面将不在This is content1”而显示This content1 has been replaced

 

SiteMesh的一个重要特性是使用原始HTML的meta标签(例如<meta name="foo" content="bar">)从基础页面传递信息到装饰器。作为一个例子,下面我们使用一个meta标签来定义HTML页面的作者。

<html>   
     <meta name="author" content="test@example.com">   
     <head>   
         <title> Simple Document </title>   
     </head>   
     <body>   
        Hello World!< br/>   
        <%=1 + 1%>   
     </body>   
</html>   

我们定义一个“smart”装饰器来研究meta标签,如果出现这个标签,则可以得到一个相应的HTML:

<%@taglib uri = "sitemesh-decorator"  prefix = "decorator"%>   
<decorator:usePage id = " myPage "  />   
<html>  
     <head>   
         <title>   
            My Site - <decorator:title default="Welcome!"/>   
         </title>   
         <decorator:head/>   
     </head>   
     <body>   
         <h1><decorator:title default="Welcome!"/></h1>   
         <h3>   
             <a href="mailto: <decorator:getProperty property= "meta.author" default="staff@example.com"/>">   
                 <decorator:getProperty property="meta.author" default="staff@example.com"/>   
             </a>   
         </h3>   
         <hr/>   
         <decorator:body/>   
         <p>   
             <small>(<a href="/?printable=true">printable version</a> )</small>   
         </p>   
     </body>   
</html>    

可以看到我们使用了 getProperty标签的 一个默认属性——如果没有指定author,我们就设定其为staff。如果你决定使用这个模型储存页面的meta数据,你或许需要和你的开发伙伴一起来 确定将使用什么标签以及如何使用他们。简单的,你或许想要使用meta标签来描述诸如页面作者及时间戳之类的东西。更复杂一些,你或许会想像XML文件一 样标准化的管理你的站点导航,同时使用meta标签来通过页面节点转到装饰器。

转载:http://blog.csdn.net/drift_away/article/details/8088758

参考资料:http://my.oschina.net/thinkinginc/blog/76180

参考资料:http://www.cnblogs.com/mailingfeng/archive/2011/12/21/2296041.html

SiteMesh 2.X 的使用(网页结构模板)的更多相关文章

  1. Flask08 包含(include)、继承(extends)、宏???、模板中变量的来源、利用bootstrap构建自己的网页结构

    1 包含 直接把另一个文件的内容,复制粘贴过来 {% include "模板路径" %} 注意:模板都是放在 templates 这个文件夹下面的,可以在里面新建文件夹来进行分离: ...

  2. 安全、结构良好的jQuery结构模板

    安全.结构良好的jQuery结构模板 ;(function($,window,document,undefined){ //我们的代码- })(jQuery,window,document);   参 ...

  3. 【7】Django网页视图模板处理

    天下难事必作於易.天下大事必作於细.是以圣人终不为大,故能成其大 --老子<道德经> 本节内容 HTML页面的渲染 使用页面模板 异常处理 超链接路径处理 路由命名空间 1. HTML页面 ...

  4. 网页结构的简介和Xpath语法的入门教程

    相信很多小伙伴已经听说过Xpath,之前小编也写过一篇关于Xpath的文章,感兴趣的小伙伴可以戳这篇文章如何利用Xpath抓取京东网商品信息以及Python网络爬虫四大选择器(正则表达式.BS4.Xp ...

  5. html5-1 网页结构描述

    html5-1 网页结构描述 一.总结 一句话总结:注意head中的title,keywords,description,这对seo优化很有帮助 1.如何给某元素动态使用类似onclick方法? 点o ...

  6. 毕设1--利用Java实现网页的模板功能技术---简要了解

    首先,关于我对自己的毕业设计题目的理解,其中没有接触过的技术有怎么用Java实现将原有的Word的模板上传到网页中,在网页中进行相关操作.之所以把这部分放在一开始来进行了解是因为没有接触过这一方面,比 ...

  7. 25套用于 Web UI 设计的免费 PSD 网页元素模板

    Web 元素是任何网站相关项目都需要的,质量和良好设计的元素对于设计师来说就像宝贝一样.如果您正在为您的网站,博客,Web 应用程序或移动应用程序寻找完美设计的网页元素,那么下面这个列表会是你需要的. ...

  8. html5中的网页结构

    一.html5中的大纲 在html5中,使用各种结构元素所描述出来的整个网页的层次结构,就是该网页的大纲.因此在组织这份大纲的时候,不能使用div元素,因为div元素只能当做容器,用在需要对网页中某个 ...

  9. 网页结构——head标签内

    之前写网页都很标准的格式,最近一个项目出现了页面闪动等一系列问题[项目不是前后端分离], 所以这边有后台的功劳,有部分后台是不管你页面结构的,在他们操作的时候可能会在,你的head内meta前加内联c ...

随机推荐

  1. JS高级程序随笔二

    var person1={ toLoginString:function(){ return "lili"; }, toString2:function(){ return &qu ...

  2. 重读ORB_SLAM之LoopClosing线程难点

    1. DetectLoop 这里有个ConsistenGroup概念,比较难懂.这里是最让人迷惑的地方.一旦vbConsistentGroup为真,其他帧的spCanditateGroup就进不来了. ...

  3. kubernetes容器集群管理启动一个测试示例

    创建nginx 创建3个nginx副本 [root@master bin]# kubectl run nginx --image=nginx --replicas=3 kubectl run --ge ...

  4. LeetCode Array Easy 414. Third Maximum Number

    Description Given a non-empty array of integers, return the third maximum number in this array. If i ...

  5. 什么是restful风格?

    文章参考 RESTful API 设计指南--阮一峰 概念 一种软件架构风格.设计风格,而不是标准,只是提供了一组设计原则和约束条件.它主要用于客户端和服务器交互类的软件.基于这个风格设计的软件可以更 ...

  6. jackson的readTree有坑

    {"}] readTree认为上面的字符是json,坑啊 alibaba的fastjson 无论JSONObject.parseObject还是JSONObject.parseObject ...

  7. 一、Gulp

    开发和部署前端项目: 在开发Web应用中为加速客户端资源响应(js和css),减少对js和css的请求,通过bundles来实现. 在ASP.NET5中放弃该特性,被其他类似的组件所代替.比如使用Gu ...

  8. jQuery实现网页放大镜功能

    京东等电商网站中可以对商品进行放大观察,本文要实现的就是模仿这个放大镜功能,大致效果如下图所示: 简要说明实现思路: 1.原图窗口与放大窗口插入的是同一个图片,不过原图窗口的图片要适当缩小,放大窗口图 ...

  9. jquery 选项卡切换

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  10. dosbox下载并配置BC3.1及环境变量的方法

    https://www.tuicool.com/articles/v2A3mm--Win8下用DOSBox编写汇编语言 http://www.dosbox.com/ http://www.masm32 ...