Javashop模板解析机制
模板解析机制
Javashop页面的显示由Javashop模板引擎解析，模板解析机制包含两个部分：请求URL-模板文件应射和模板解析显示。
目录[隐藏]
|
URL-模板文件映射
每一次页面显示都会对应一次请求，一个请求就会对应一个URL，如：/test.html，
那么我们的模板解析就由这个URL开始，这个URL可能会对应我们的一个模板文件，如：test.html。
首先我们要建立这种URL和模板文件的对应关系(也就是建立了一个HTTP请求和模板文件的对应关系)，也可以称为URL-模板文件应射，通过如下步骤建立URL-模板文件应射：
用开发者角色（什么是开发者角色？）登录后台:点击开发者->工具->URL映射
点击新增按钮：
如上图所示url和模板文件分别输入/test.html
点击保存新增一条记录，这样我们便建立了一个由/test.html的url至/test.html模板文件的映射
建立模板文件
首先我们要确认我们当前模板所在的目录，登录后台，点击页面设置-》主题管理-》前台主题：
由上图圈红部分可以看出当前模板目录为default，即/themes/default (“/”代表Javashop部署到web服务器的根目录)，
我们在此目录中建立一个模板文件，名为test.html，并键入“hello world!”，起动web容器（如tomcat），
访问http://ip:端口号/虚拟目录/test.html，效果如下图：
模板解析引擎根据 http://localhost:8081/test.html
找到当前模板/themes/default/test.html，并显示出此文件的内容。
挂件使用说明
widgets.xml配置
经过上述章节的讲解，我们学习到如何显示一个模板的内容，将下来我们将了解到如何展示网店的数据，如商品、商品分类等，展示这些数据需要借助“挂件”。
我们将一个页面划分为一块块的“挂件区域”，如下图所示：
挂件的作用就是在模板的相应位置输出一段HTML，这样，Javashop的一个页面就是由多个挂件HTML片段组合而成的。
接下来我们具体讲解如何使用一个挂件，首先我们在widgets.xml中定义在一模板文件中要含有哪些挂件，
- widgets.xml的位置
我们以“商品列表挂件”为例来讲解，“商品列表挂件”的作用是输入我们指定的几个商品信息，如下图所示：
他的挂件ID是goods_list ，假设在我们的test.html中只有这一个挂件，那么widgets.xml中的配置为：
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<widgets>
<page id="/test.html"> <!-- 声明模板文件节点 -->
<widget id="cat1_goods"> <!--定义挂件的id，这个id将会在模板文件中使用 -->
<type>goods_list</type> <!--对应挂件id，这里使用“商品列表挂件” -->
<term>{catid:'1'}</term> <!-- 指定显示分类id为1下面的商品-->
<setting>{type:'default'}</setting> <!--指定为默认配置-->
</widget>
</page>
</widgets>
上述挂件配置中type必须指定为挂件的ID其它参数和具体的挂件相关，可参考“商品列表挂件”。
接下来在模板文件test.html中输入” ${widget_cat1_goods}”其中标红的部分为在widgets.xml中定义的挂件id，重新访问test.html，效果图如下：
自定义挂件页面
上图内容为挂件默认的HTML结构，因为没有使用样式看起来比较丑陋，下面我们介绍如何自定义这个挂件的HTML结构，
通过指定挂件的 custom_page和folder 参数我们可以让挂件输入自定义的HTML，如：
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<widgets>
<page id="/test.html">
<widget id="cat1_goods">
<type>goods_list</type>
<term>{catid:'1'}</term>
<setting>{type:'default'}</setting>
<custom_page>cat1_goods</custom_page><!--指定挂件页面名称，扩展名默认为.html-->
<folder>widget_html</folder> <!-- 指定挂件页面所在目录 -->
</widget>
</page>
</widgets>
这样我们必须建立/themes/default/widget_html目录， 并在目录中建立cat1_goods.html文件，在文件中键入：“这是自定义挂件的内容”，
重新访问test.html，效果如下：
如果出现乱码，请确认建立的挂件页面文件格式是否为UTF-8。
使用挂件变量
上述章节的讲解，我们可以实现自定义挂件的HTML，接下来我们通过挂件变量来输出的商品、分类等网店数据。
每个挂件能够输出什么数据、使用哪些变量都是相关挂件定义的，需要参考相应的挂件说明.
挂件页面使用Freemark解析的，所以使用Freemarker语法。点击这里查看Freemarker教程
商品列表挂件可以使用的变量是名为“goodsList”的商品列表变量，
此列表中每一行是一个商品数据，详细请参考“商品列表挂件说明”，我们可以通过如下的代码来循环输出商品信息：
<div>
<ul>
<#list goodsList as goods>
<li>名称:${goods.name}--价格：${goods.price}</li>
</#list>
</ul>
</div>
重新访问/test.html效果图下：
挂件通用参数说明
挂件的通用参数是指：适用于任何挂件的参数。
在上述章节中我们已经使用了两个挂件的通用参数：
- folder
- custom_page
还有一些其它的通用挂件参数，请点击这里查看详细说明
特殊页面说明
在javashop模板解析机制中存在几个特殊的页面分别为：共用页面、默认页面、会员中心页面。
共用页面
共用页面在widgets.xml中体现为id为common的page节点，在执行任何页面时都会执行此节点配置的挂件
通过这样的机制可以使现一些公用页头、页尾共用信息的解析显示，如SEO信息、购物车条、会员信息条等。
- 示例
<page id="common"> <widget id="header"> <type>header</type> </widget> <widget id="member_bar"> <type>member_login_bar</type> <custom_page>login_bar</custom_page> <folder>member</folder> </widget> </page>
如上代码所示，在访问任何页面时都会执行common节点中声明的header挂件和member_bar挂件，相应的也可以在任何页面使用挂件输出的html或变量。
注意：实际上不存在common这个模板页面。 一般地，我们会单独声明一个header.html，并在此页面中输出我们需要的共用挂件html,并在其它页面通过include指令包含此页面，这样使我们模板看起来更加清晰，也更易于维护。
默认页面
在我们的网站中，会有大量简单的、页面结构相同的页面，如为每个页面去制作模板会变得冗余而重复。
所以我们规定了一个id为"/default.html"的特殊页面节点，他看起来像下面这个样子：
- 示例
<page id="/default.html">
<widget id="goodscat">
<type>goods_cat</type>
<folder>common</folder>
<custom_page>goodscat</custom_page>
</widget>
<widget id="/logout.html">
<type>member_logout</type>
</widget>
<widget id="/memberemailcheck.html">
<type>member_email_check</type>
</widget>
<widget id="/findpassword.html">
<type>member_findpassword</type>
<folder>member</folder>
<custom_page>find_password</custom_page>
</widget>
<widget id="/modifypassword.html">
<type>find_modify_password</type>
<folder>member</folder>
<custom_page>modify_password</custom_page>
</widget>
</page>
这个节点中的挂件配置特殊地方是每个挂件的id是一个url（准确的说是一个url正则表达式，如可以是article-(\d).html）
上述配置我们应该建立如下的URL映射：
即：这些url统一映射到/default.html这个模板。
这样在访问某个url时，如：/findpassword.html，会解析/default.html这个节点中的id="/findpassword.html"的挂件
那么我们在/default.html该如何输出挂件的html呢？使用固定标记：${widget_main}，如我们的default.html代码示例 ：
<div id="goods_cat_wrapper">
${widget_goodscat} <!--输出商品分类挂件内容 -->
</div>
<div id="content_wrapper">
${widget_main} <!--输出相应挂件的内容 -->
</div>
如上述代码所示，${widget_main}会输出findpassword挂件的内容，同时id为goodscat的挂件也会被解析，所以可以通过${widget_goodscat}输出相应的html。
其它以"/"开头的不会被解析，id以"/"开头的挂件同时只会解析一个，即匹配了url的那个。
会员中心页面
还有一个特殊的页面是会员中心页面，和默认页面类似的，他负责显示所有会员中心的页面，因为会员中心页面的结构也是非常类似的。
- 示例：
<page id="/member.html"> <widget id="/member_index.html"> <type>member_index</type> <folder>member</folder> <custom_page>index</custom_page> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_order.html"> <type>member_order</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_orderdetail_(\d+).html"> <type>member_orderdetail</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_favorite.html"> <type>member_favorite</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_gnotify.html"> <type>member_gnotify</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_info.html"> <type>member_info</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_address.html"> <type>member_address</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_pointhistory.html"> <type>member_pointhistory</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_security.html"> <type>member_security</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_comments.html"> <type>member_comments</type> <mustbelogin>yes</mustbelogin> </widget> <widget id="/member_ask.html"> <type>member_ask</type> <mustbelogin>yes</mustbelogin> </widget> </page>
相应的我们的URL都要映射给/member.html这个模板，并且在member.html模板中通过${widget_main}来输出匹配URL的挂件HTML。 一般地，member.html中的内容像如下这样：
<div id="menu_wrapper">
<#include member/menu.html /> <!--包含会员中心菜单 -->
</div>
<div id=:"content_wrapper">
${widget_main} <!--输出相应挂件的内容 -->
</div>
异步请求特殊URL说明
对于Ajax方式的请求，javashop提供了两种方式的URL支持。
- /widget?type=挂件id&ajax=yes&其它参数
- /url?widgetid=挂件id&ajax=yes&其它参数
两种方式分别用于json式的数据及html式的ajax请求。
返回Json式 Ajax URL调用
/widget
- 参数type
此参数为必须，传递要调用的挂件id（beanid）
- ajax
此参数为必须，传递值为yes
返回HTML式 Ajax URL调用
正常映射的url
- 参数widgetid
此参数为必须，传递的值为：在widgets.xml中声名的挂件id
- ajax
此参数为必须，传递值为yes
- 说明
以如下配置为例：
<page id="/test.html">
<widget id="cart">
<type>shop_cart</type>
<action name="getTotal">cart_total</action >
<folder>cart</folder>
</widget>
</page>
cart_total.html的内容为：
<div>
<li>商品费用:${goodsprice}</li>
<li>配送费用:${shipprice}</li>
</div>
则可以通过如下url请求得到异步请求的html片断： /test.html?widgetid=cart&ajax=yes&action=getTotal 返回html为：
<div> <li>商品费用:￥90。00</li> <li>配送费用:￥5.00</li> </div>
widgets_default.xml说明
自Javashop3之后，在Javashop中默认存在着一个 widgets_default.xml，它为我们提供了默认的挂件配置
优先级
widgets.xml的配置优先级高于widgets_default.xml，如： 两个配置文件某个节点中分别声明了不同的挂件配置(一个page节点，分别声明了两个不同配置的挂件，挂件的id相同，但配置不同)
- widgets_default.xml中存在下面的配置
<page id="common"> <widget id="header"> <type>header</type> </widget> </page>
- 在widgets.xml中同样存在下面的配置
<page id="common">
<widget id="header">
<type>header</type>
<custom_page>header_common</custom_page>
<folder>common</folder>
</widget>
</page>
两者都配置了关于page为common，挂件id为header的配置。上面widegets.xml中有不同的配置。
那么这段配置将以widgets.xml中为准，即如果存在相同配置，则用widgets.xml中的配置覆盖了widgets_default.xml的配置。
配置的合并
分为两种情况：
-
- 某个节点中分别声明了不同的挂件配置(一个page节点，分别声明了两个挂件，挂件的id不同)
- 分别配置了不同的page节点(分别存在多个不同的page节点)
下面分别加以说明：
示例1
-
- widgets_default.xml中存在下面的配置
<page id="common"> <widget id="header"> <type>header</type> </widget> </page>
- 在widgets.xml中也存在id为common的page节点
但它声明了id为member_bar的另外一个挂件配置:
<page id="common">
<widget id="member_bar">
<type>member_bar</type>
<custom_page>member_bar</custom_page>
<folder>common</folder>
</widget>
</page>
那么javashop会将两个配置合并，合并后后的效果为：
<page id="common">
<widget id="header">
<type>header</type>
</widget>
<widget id="member_bar">
<type>member_bar</type>
<custom_page>member_bar</custom_page>
<folder>common</folder>
</widget>
</page>
示例2
-
- widgets_default.xml中存在下面的配置
<page id="common"> <widget id="header"> <type>header</type> </widget> </page>
- 在widgets.xml中声明了另外page节点的配置，如：
<page id="/cart.html">
<widget id="cart">
<type>shop_cart</type>
<custom_page>cart</custom_page>
<folder>cart</folder>
</widget>
</page>
那么javashop会将两个配置合并，合并后后的效果为：
<page id="common">
<widget id="header">
<type>header</type>
</widget>
</page>
<page id="/cart.html">
<widget id="cart">
<type>shop_cart</type>
<custom_page>cart</custom_page>
<folder>cart</folder>
</widget>
</page>
widgets_default.xml的位置
widgets_default.xml位于/themes/widgets_default.xml，点击这里查看他的详细配置
强烈建议不要直接修改widgets_default.xml文件