加载瓷砖和弹簧的资源mvc

8

这是一个很好的问题，因为瓷砖的一个主要优点是它提供的关于构图的中心视图。如果这个集中化还可以包括CSS文件，那将是非常好的。

发生这种情况是可能的，这里是一个例子。这个例子使用了tiles3，但它适应tiles-2应该非常简单（第三个tile让你使用多种类型的表达式），你可以一步步地做到这一点。

另外请注意，我使用Struts2作为我的动作框架，这不是问题，但是因为我要使用一个工作示例，您将知道“OGNL：”前缀表达式意味着EL Struts2使用的将会是用过的。你也应该知道，如果你升级到Tiles-3，你还可以使用Spring EL，在表达式前加上“MVEL：”。

tiles.xml

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN" "http://tiles.apache.org/dtds/tiles-config_3_0.dtd"> 
<tiles-definitions> 
    <definition name="default" template="/WEB-INF/template/template.jsp"> 
     <put-list-attribute name="cssList" cascade="true"> 
      <add-attribute value="/style/cssreset-min.css" /> 
      <add-attribute value="/style/cssfonts-min.css" /> 
      <add-attribute value="/style/cssbase-min.css" /> 
      <add-attribute value="/style/grids-min.css" /> 
      <add-attribute value="/script/jquery-ui-1.8.24.custom/css/ui-lightness/jquery-ui-1.8.24.custom.css" /> 
      <add-attribute value="/style/style.css" /> 
     </put-list-attribute>  
     <put-list-attribute name="jsList" cascade="true"> 
      <add-attribute value="/script/jquery/1.8.1/jquery.min.js" /> 
      <add-attribute value="/script/jquery-ui-1.8.24.custom/js/jquery-ui-1.8.24.custom.min.js" /> 
      <add-attribute value="/script/jquery.sort.js" /> 
      <add-attribute value="/script/custom/jquery-serialize.js" /> 
     </put-list-attribute> 
     <put-attribute name="title" value="defaults-name" cascade="true" type="string"/> 
     <put-attribute name="head" value="/WEB-INF/template/head.jsp"/> 
     <put-attribute name="header" value="/WEB-INF/template/header.jsp"/> 
     <put-attribute name="body" value="/WEB-INF/template/body.jsp"/> 
     <put-attribute name="footer" value="/WEB-INF/template/footer.jsp"/> 
    </definition> 

    <definition name="REGEXP:\/recruiter#candidate-input\.(.*)" extends="default"> 
     <put-list-attribute name="cssList" cascade="true" inherit="true"> 
      <add-attribute value="/style/recruiter/candidate-input.css" /> 
     </put-list-attribute> 
     <put-list-attribute name="jsList" cascade="true" inherit="true"> 
      <add-attribute value="/script/widgets/resume/resume.js" /> 
     </put-list-attribute> 
     <put-attribute name="body" value="/WEB-INF/content/recruiter/candidate-input.jsp"/> 
    </definition> 

    <definition name="REGEXP:(.*)#(.*)" extends="default"> 
     <put-attribute name="title" cascade="true" expression="OGNL:@[email protected]().name"/> 
     <put-attribute name="body" value="/WEB-INF/content{1}/{2}"/> 
    </definition> 
</tiles-definitions>

/WEB-INF/template/template.jsp

<%@taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %> 
<%@taglib prefix="s" uri="/struts-tags"%> 
<%@page contentType="text/html" pageEncoding="UTF-8" %> 
<!DOCTYPE html> 
<html> 
    <tiles:insertAttribute name="head"/> 
    <body> 
     <%-- website header --%> 
     <div id="wrapper"> 
      <div id="content"> 
       <tiles:insertAttribute name="header"/> 
       <tiles:insertAttribute name="body"/> 
       <div class ="outer content"> 
        <tiles:insertAttribute name="footer"/> 
       </div> 
      </div> 
     </div> 
    </body> 
</html>

这是获得的CSS文件和JS文件列表到重要组成部分头部贴砖：

/WEB-INF/template/head.jsp

<%@taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%> 
<%@taglib prefix="s" uri="/struts-tags"%> 
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
<tiles:importAttribute name="cssList"/><tiles:importAttribute name="jsList"/> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
    <s:iterator value="#attr.cssList" var="cssValue"> 
     <link href="<s:url value="%{cssValue}"/>" rel="stylesheet" type="text/css"> 
    </s:iterator> 
    <s:iterator value="#attr.jsList" var="jsValue"> 
     <script src="<s:url value="%{jsValue}"/>"></script> 
    </s:iterator> 
    <title><tiles:insertAttribute name="title" defaultValue="no title"/></title> 
</head>

我想你可以找出其余的。对不起，关于最后一个块中的<s:iterator>标签，我不确定Spring的等价物，也不会倾向于测试它。但是，如果你把它翻译成春天，那么你自己在这里回答会很好。我很乐意投票。

来源

2013-05-19 20:42:25 Quaternion

+0

感谢这个详细的答案。所以要做到这一点的方法是从通配符中移除特殊页面并将其放入自己的定义中。我希望有一个瓷砖标签，我可以在身体中使用，将资源插入头部。 –

+1

由于效率原因，这不能存在。您会注意到大页面加载（连接速度很慢）数据正在流入页面。这样可以防止数据在服务器端缓存，节省资源。如果你想要你解释的交互类型，有两种选择：1）使用sitemesh（你为这个功能支付的内容被缓存）2）我正在考虑的东西：在瓦片顶部建立一个图层，将定义数据存储在数据库中。当定义被插入到数据库中时，您可以定义所有的依赖关系，当您拉取图块定义时... – Quaternion

+0

假设正文图块需要3个css文件，2个js文件，那么当从数据库中检索图块定义时，我们可以获取所有必需资源的列表。确实，瓷砖呈现自上而下，但如果我们可以在渲染开始之前获得所有必需的成分！我们可以通过效率组合（瓷砖）获得装饰者（SiteMesh）的好处。 – Quaternion

1

在调度员servlet.xml中提供的MVC静态资源映射如下：

<!-- static resource mapping for style sheets, etc. --> 
    <mvc:resources mapping="/styles/**" location="/WEB-INF/skins/" /> 
    <mvc:resources mapping="/scripts/**" location="/WEB-INF/scripts/" />

并在您的瓷砖，layout.jsp文件，你可以通过编写

<script type="text/javascript" src="${context}/scripts/jquery-1.7.js></script> 
<link rel="stylesheet" type="text/css" href="${context}/styles/css/superfish.css">

请参阅访问所有这些： mvc:resources

来源

2013-05-18 05:17:15

1

这就是我用Spring做的，其余的就像Quaternion发布的一样。

/WEB-INF/template/head.jsp

<tiles:importAttribute name="cssList"/> 
<tiles:importAttribute name="jsList"/> 
<head> 
    <c:forEach var="cssValue" items="${cssList}"> 
     <link type="text/css" rel="stylesheet" href="<c:url value="${cssValue}"/>" /> 
    </c:forEach> 

    <c:forEach var="jsValue" items="${jsList}"> 
     <script src="<c:url value="${jsValue}"/>"></script> 
    </c:forEach> 
</head>

而且不要忘记在每一页上指出，从权的定义tiles.xml

<tiles:insertDefinition name="definitionName"> 
    <tiles:putAttribute name="body"> 
     //content 
    </tiles:putAttribute> 
</tiles:insertDefinition>

来源

2015-06-11 17:41:12

加载瓷砖和弹簧的资源mvc

回答

相关问题