使用 SpringSource Slices 实现可插拔样式

工程 | Andy Wilkinson | 2009年7月10日 | ...

自从我们宣布 SpringSource Slices 以来,许多用户和客户都询问如何使用 Slices 来实现其网站样式和品牌的插件化。在本博客中,我将演示使用 Slices 实现这一目标的简易性。

可插拔样式

我有一个标准的 war 文件,名为 styled.host.war,其中包含一个非常简单的 index.html 页面。
<html>
	<head>
		<title>SpringSource Slices Pluggable Styling Demonstration</title>
		<link rel="StyleSheet" href="styles/main.css" type="text/css" />
	</head>
	<body>
		<div class="header">
			<div class="title">SpringSource Slices</div>
			<div class="subtitle">Pluggable Styling Demonstration</div>
		</div>
	</body>
</html>

如您所见,它正在查找名为 styles/main.css 的 CSS 文件。如果没有 slice,则此文件不存在。将 war 部署到 dm Server 显示页面没有样式。

cp styled.host.war ~/springsource-dm-server-2.0.0.CI-B297/pickup/
[2009-07-10 15:20:46.183] fs-watcher <SPDE0048I> Processing 'CREATED' event for file 'styled.host.war'.
[2009-07-10 15:20:46.525] fs-watcher <SPDE0010I> Deployment of 'styled.host' version '1.0.0' completed.
[2009-07-10 15:20:46.539] Thread-19  <SPWE0000I> Starting web bundle '/styling'.
[2009-07-10 15:20:46.965] Thread-19  <SPWE0001I> Started web bundle '/styling'.
Unstyled index page

可以通过部署一个 Slice 来轻松为页面设置样式,该 Slice 指定 styled host war 为其主机并提供所需的样式表。

cp plain.style.slice.war ~/springsource-dm-server-2.0.0.CI-B297/pickup/
[2009-07-10 15:28:30.699] fs-watcher <SPDE0048I> Processing 'CREATED' event for file 'plain.style.slice.war'.
[2009-07-10 15:28:30.789] fs-watcher <SPDE0010I> Deployment of 'plain.style.slice' version '1.0.0' completed.

现在,如果我们查看页面,由于 Slice 提供的样式,其外观已更改。

Index page with the plain style applied

请注意,无需重新部署或更改 Host war 文件,Host 只在部署 Slice 时获取新的样式。同样,如果我们现在取消部署样式 Slice,Host 将恢复到我们之前看到的无样式外观。或者,我们可以更进一步,删除此样式 Slice 并部署另一个 Slice 来更改样式,同样无需重新部署或更改 Host。

rm ~/springsource-dm-server-2.0.0.CI-B297/pickup/plain.style.slice.war
cp green.style.slice.war ~/springsource-dm-server-2.0.0.CI-B297/pickup/
[2009-07-10 15:34:48.948] fs-watcher <SPDE0048I> Processing 'DELETED' event for file 'plain.style.slice.war'.
[2009-07-10 15:34:49.038] fs-watcher <SPDE0012I> Undeployment of 'plain.style.slice' version '1.0.0' completed.
[2009-07-10 15:36:01.064] fs-watcher <SPDE0048I> Processing 'CREATED' event for file 'green.style.slice.war'.
[2009-07-10 15:36:01.146] fs-watcher <SPDE0010I> Deployment of 'green.style.slice' version '1.0.0' completed.
Index page with the green style applied

它是如何工作的?

利用 Slices 的此功能非常简单。

主机

主要主机在其 web.xml 文件中将 Slices 的 SliceHostFilter 映射到 /*。
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
			
    <filter>
        <filter-name>host-filter</filter-name>
        <filter-class>com.springsource.osgi.slices.core.SliceHostFilter</filter-class>    	
    </filter>

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

此过滤器将把路径与任何主机 Slice 匹配的任何请求路由到匹配的 Slice。如果找不到匹配的 Slice,则请求将简单地传递给主机。

如我们在上面的 index.html 文件中看到的,主机正在查找 /styles 目录中的所有样式,但实际上并没有提供此内容。

样式 Slice

每个样式 Slice 也非常简单。在其 MANIFEST.MF 文件中,它们使用 Slice-Host 标头指定其主机,并使用 Slice-ContextPath 标头指定 /styles 的上下文路径。
Manifest-Version: 1.0
Bundle-SymbolicName: green.style.slice
Bundle-Version: 1.0
Bundle-ManifestVersion: 2
Bundle-Name: Styling Slice
Slice-Host: styled.host;version="[1.0, 2.0)"
Slice-ContextPath: /styles

这里的关键是配置的 /styles 上下文路径与主机查找其样式的位置匹配。这意味着,当部署 Slice 时,主机中的过滤器将把对 /styles 的请求路由到 Slice。剩下的就是让样式 slice 包含为主机设置样式所需的所有资源。在本例中,它是主机在其 index.html 中引用的 main.css 文件,以及从 CSS 引用的图像。

The content of the green styling slice

了解更多

我在上面使用的 war 文件的源代码可在 Slices Git 存储库的 samples/pluggable-styling 目录中找到 (git://git.springsource.org/slices/slices.git)。此外,请查看 Rob 的公告博客,其中包含有关如何构建 Slices 并将其安装到 dm Server 的详细信息。

获取 Spring 新闻通讯

通过 Spring 新闻通讯保持联系

订阅

领先一步

VMware 提供培训和认证,以加速您的进步。

了解更多

获得支持

Tanzu Spring在一个简单的订阅中提供对 OpenJDK™、Spring 和 Apache Tomcat® 的支持和二进制文件。

了解更多

即将举行的活动

查看 Spring 社区中所有即将举行的活动。

查看全部