【项目总结:波士顿东大校友会】使用freemaker实现前台页面静态化

首先将原先接受action返回结果的index.jsp分割为3个部分,top.jsp,body.jsp,bottom.jsp,以便分别通过freemaker模板生成各个部分,并进行include。

本文以生成 body.jsp为例,讲解整个流程。

第一步、将原先网站首页主体的动态body.jsp转换为body.ftl:

转换结果如下:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<#macro indexTopicList indexTopic titleSize showDate=true hasH=false hasDt=true showDot=true df="MM/dd" divId="" hrefClz="">
	<div ${(divId=="")?string("","id='${divId}'")}>
		<#if hasH>
			<#nested/>
		</#if>
		<dl>
			<#if hasDt>
				<dt><#nested/></dt>
			</#if>
			<#list indexTopic.topics as topic>
				<dd>
					<a title="${topic.title}" href="topic/${topic.id}" ${(hrefClz=="")?string("","class='${hrefClz}'")}>
						<#if showDate>[${(topic.publishDate)?string("${df}")}]</#if>
						<#if topic.title?length gt titleSize>
							${topic.title[0..titleSize]}<#if showDot>...</#if>
						<#else>
							${topic.title}
						</#if>
					</a>
				</dd>
			</#list>
		</dl>
	</div>
</#macro>
<div id="content">
	<div id="content_con">
		<div id="xiaoxun"></div>
		<div id="notice_rollpic">
			<@indexTopicList indexTopic=ts["1"] titleSize=12 divId="notice" hrefClz="index_link">
				<span><a href="channel/${ts["1"].cid}" class="index_title_href">${ts["1"].cname}</a></span>
			</@indexTopicList>
			<div id="rollpic">
				<div id="rollCaption"><span></span></div>
				<div id="rollPager"></div>
				<#list pics as pic>
					<a href="${pic.linkUrl}" title="${pic.title}"><img src="<%=request.getContextPath()%>/resources/indexPic/${pic.newName}" border="0"/></a>
				</#list>
			</div>
		</div>
		<div id="split_line"></div>
		<div id="xwgk_xxgk">
			<@indexTopicList indexTopic=ts["2"] hasH=true hasDt=false titleSize=37 divId="xwgk" hrefClz="index_link">
				<h3><a href="channel/${ts["2"].cid}" class="index_title_href">${ts["2"].cname}</a></h3>
				<div id="xwgk_bg"></div>
			</@indexTopicList>
			<div id="xxgk">
				<h3><a href="channel/7" class="index_title_href">学校概况</a></h3>
				<div id="xxgk_bg"></div>
				${xxgk.summary[0..360]}
			</div>
		</div>
		<div id="hdjx_jyky">
			<@indexTopicList indexTopic=ts["3"] titleSize=31 divId="hdjx" hrefClz="index_link">
				<span class="t_title">${ts["3"].cname}</span><span class="more"><a href="channel/${ts['3'].cid}">更多</a></span>
			</@indexTopicList>

			<@indexTopicList indexTopic=ts["4"] titleSize=31 divId="jyky" hrefClz="index_link">
				<span class="t_title">${ts["4"].cname}</span><span class="more"><a href="channel/${ts['4'].cid}">更多</a></span>
			</@indexTopicList>
		</div>
		<div id="chief_keyword">
			<div>
				<#list keywords as kw>
					<span class="keyword" href="keyword/${kw.name}">${kw.name}</span>
				</#list>
			</div>
		</div>
	</div>
</div>

将body.ftl等模板文件,放在项目的classpath的resources文件夹中,以便后续调用。

步骤二、写模板转静态jsp的接口和实现,如下:

package org.konghao.cms.service;

public interface IIndexService {
	public void generateTop();
	public void generateBottom();
	public void generateBody();
}

实现:将静态jsp生成到指定路径。

package org.konghao.cms.service;

import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Properties;

import javax.inject.Inject;

import org.directwebremoting.ui.servlet.BaseUtilHandler;
import org.konghao.basic.model.SystemContext;
import org.konghao.basic.util.FreemarkerUtil;
import org.konghao.basic.util.PropertiesUtil;
import org.konghao.cms.model.BaseInfo;
import org.konghao.cms.model.Channel;
import org.konghao.cms.model.ChannelType;
import org.konghao.cms.model.IndexTopic;
import org.konghao.cms.model.Topic;
import org.konghao.cms.web.BaseInfoUtil;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service("indexService")
public class IndexService implements IIndexService {

	private String outPath;
	private FreemarkerUtil util;

	@Autowired(required=true)
	public IndexService(String ftlPath, String outPath) {
		super();
		if(util==null) {
			this.outPath = outPath;
			util = FreemarkerUtil.getInstance(ftlPath);
		}
	}

	private IChannelService channelService;
	private ITopicService topicService;
	private IIndexPicService indexPicService;
	private IKeywordService keyworkService;

	public IKeywordService getKeyworkService() {
		return keyworkService;
	}

	@Inject
	public void setKeyworkService(IKeywordService keyworkService) {
		this.keyworkService = keyworkService;
	}
	public IIndexPicService getIndexPicService() {
		return indexPicService;
	}
	@Inject
	public void setIndexPicService(IIndexPicService indexPicService) {
		this.indexPicService = indexPicService;
	}

	public ITopicService getTopicService() {
		return topicService;
	}

	@Inject
	public void setTopicService(ITopicService topicService) {
		this.topicService = topicService;
	}
	public IChannelService getChannelService() {
		return channelService;
	}
	@Inject
	public void setChannelService(IChannelService channelService) {
		this.channelService = channelService;
	}

	@Override
	public void generateTop() {
		System.out.println("=============重新生成了顶部信息====================");
		List<Channel> cs = channelService.listTopNavChannel();
		Map<String,Object> root = new HashMap<String,Object>();
		root.put("navs", cs);
		root.put("baseInfo", BaseInfoUtil.getInstacne().read());
		String outfile = SystemContext.getRealPath()+outPath+"/top.jsp";
		util.fprint(root, "/top.ftl", outfile);
	}

	@Override
	public void generateBottom() {
		System.out.println("=============重新生成了底部信息====================");
		Map<String,Object> root = new HashMap<String,Object>();
		root.put("baseInfo", BaseInfoUtil.getInstacne().read());
		String outfile = SystemContext.getRealPath()+outPath+"/bottom.jsp";
		util.fprint(root, "/bottom.ftl", outfile);
	}

	@Override
	public void generateBody() {
		System.out.println("=========重新生成首页的内容信息==============");
		//1、获取所有的首页栏目
		List<Channel> cs = channelService.listAllIndexChannel(ChannelType.TOPIC_LIST);
		//2、根据首页栏目创建相应的IndexTopic对象
		//加载indexChannel.properties
		Properties prop = PropertiesUtil.getInstance().load("indexChannel");
		Map<String,IndexTopic> topics = new HashMap<String, IndexTopic>();
		for(Channel c:cs) {
			int cid = c.getId();
			String[] xs = prop.getProperty(cid+"").split("_");
			String order = xs[0];
			int num = Integer.parseInt(xs[1]);
			IndexTopic it = new IndexTopic();
			it.setCid(cid);
			it.setCname(c.getName());
			List<Topic> tops = topicService.listTopicByChannelAndNumber(cid, num);
//			System.out.println(cid+"--"+tops);
			it.setTopics(tops);
			topics.put(order, it);
		}
		String outfile = SystemContext.getRealPath()+outPath+"/body.jsp";
		//3、更新首页图片
		BaseInfo bi = BaseInfoUtil.getInstacne().read();
		int picnum = bi.getIndexPicNumber();
		Map<String,Object> root = new HashMap<String,Object>();
		root.put("ts", topics);
		root.put("pics", indexPicService.listIndexPicByNum(picnum));
		root.put("keywords", keyworkService.getMaxTimesKeyword(12));
		root.put("xxgk", topicService.loadLastedTopicByColumn(7));
		util.fprint(root, "/body.ftl", outfile);
	}

}

生成的新的静态body.jsp片段如下:

<div id="content">
	<div id="content_con">
		<div id="xiaoxun"></div>
		<div id="notice_rollpic">
	<div id='notice'>
		<dl>
				<dt>
					<span><a href="channel/10" class="index_title_href">校园快讯</a></span>
				</dt>
				<dd>
					<a title="校园快讯4" href="topic/28" class='index_link'>
						[10/21]
							校园快讯4
					</a>
				</dd>
				<dd>
					<a title="校园快讯测试3" href="topic/37" class='index_link'>
						[10/21]
							校园快讯测试3
					</a>
				</dd>
				<dd>
					<a title="校园快讯测试2" href="topic/21" class='index_link'>
						[10/21]
							校园快讯测试2
					</a>
				</dd>
				<dd>
					<a title="校园快讯测试1" href="topic/9" class='index_link'>
						[10/21]
							校园快讯测试1
					</a>
				</dd>
				<dd>
					<a title="校园快讯测试5" href="topic/33" class='index_link'>
						[10/21]
							校园快讯测试5
					</a>
				</dd>
				<dd>
					<a title="文章测试2" href="topic/18" class='index_link'>
						[10/21]
							文章测试2
					</a>
				</dd>
				<dd>
					<a title="测试文章1" href="topic/14" class='index_link'>
						[10/21]
							测试文章1
					</a>
				</dd>
				<dd>
					<a title="测试图片" href="topic/3" class='index_link'>
						[10/21]
							测试图片
					</a>
				</dd>
		</dl>
	</div>

然后分别生成top.jsp,bottom.jsp。

步骤三、将新生成的静态body.jsp,top.jsp,bottom.jsp按照原先index.jsp的分割顺序include到index.jsp首页jsp中。

片段如下:

index.jsp

<body>
<jsp:include page="/jsp/template/top.jsp"/>
<jsp:include page="/jsp/template/body.jsp"/>
<jsp:include page="/jsp/template/bottom.jsp"/>
</body>

总结:

在后台,每次更新新闻内容以后,就可以通过静态生成功能按钮调用静态生成Service。而用户访问首页每次刷新的时候也不必再去通过Control中去取数据库内容了。

而是直接访问生成的静态页面,静态页面中没有action的返回结果。速度大大提高!

时间: 2024-11-08 09:18:21

【项目总结:波士顿东大校友会】使用freemaker实现前台页面静态化的相关文章

[项目构建 九]babasport 页面静态化技术Freemarker技术的介绍及使用实例.

一.FreeMarker简介 1.动态网页和静态网页差异 在进入主题之前我先介绍一下什么是动态网页,动态网页是指跟静态网页相对应的一种网页编程技术.静态网页,随着HTML代码的生成,页面的内容和显示效 果就不会再发生变化(除非你修改页面代码).而动态网页则不然,页面代码虽然没有发生变化,但是显示的内容却是可以随着时间.环境或者数据库操作的结果而 发生相应的变化.简而言之,动态网页是基本的HTML语法规范与java.VB.VC等高级程序设计语言.数据库编程等多种技术的融合,以实现对网站内容 和风格

【项目总结:波士顿东大校友会】CMS栏目个性化设置

开发流程完整实现: 1.实体(entity.model) (截取代码省略setter.getter) /** * 类描述:系统栏目实体 * 创建人:周磊 * 创建时间:2013-8-30 下午03:58:50 */ public class ChannelEntity { /** * 初始化信息 */ public static final String ROOT_NAME = "网站系统栏目"; public static final int ROOT_ID = 0; /** *栏目

11(maven+SSH)网上商城项目实战之Freemarker 页面静态化

FreeMarker是一个模板引擎,一个基于模板生成文本输出的通用工具,使用纯Java编写 l         FreeMarker被设计用来生成HTML Web页面,特别是基于MVC模式的应用程序 l         虽然FreeMarker具有一些编程的能力,但通常由Java程序准备要显示的数据,由FreeMarker生成页面,通过模板显示准备的数据(如下图) 模板 + 数据模型 = 输出 l         FreeMarker不是一个Web应用框架,而适合作为Web应用框架一个组件 l 

java自适应响应式 企业网站源码 SSM freemaker生成静态化 手机 平板 PC springmvc

java 企业网站源码 前后台都有 静态模版引擎, 代码生成器大大提高开发效率 前台: 支持两套模版, 可以在后台切换 系统介绍: 1.网站后台采用主流的 SSM 框架 jsp JSTL,网站后台采用freemaker静态化模版引擎生成html 2.因为是生成的html,所以访问速度快,轻便,对服务器负担小 3.网站前端采用主流的响应式布局,同一页面同时支持PC.平板.手机(三合一)浏览器访问 4.springmvc +spring4.2.5+ mybaits3.3  SSM 普通java we

项目部署到tomcat6.0启动成功后访问页面报500错误解决方法

如题:项目部署到tomcat6.0启动成功后访问页面报500错误解决方法,很奇葩,启动的时候没有任何问题,但输入访问地址后报500,去年国庆放假前夕,为这个问题伤神了半天最后解决了,今天又碰到了,乍一看摸不着头,后面仔细回想了下,迅速解决了问题. 原因:项目里面的jar和tomcat里面lib里面的jar重复了. 解决方法: 1.要么更换tomcat7或之后的版本,之后的版本就不会出现这个问题. 2.去部署之后的tomcat的webapps\项目名\WEB-INF\lib 里面删掉jsp-api

佩特来项目经验小集合(1)___js获取前一页面url中传来的值

页面跳转代码: src="AddCLFFour.aspx?ID=<%= Request.QueryString["ID"].ToString() %>"> ,通过" Request.QueryString["ID"].ToString()" 向AddCLFFour传参数ID,在AddCLFFour页面如何获取页面传过来的ID值呢? 下面提供三种方法,简单介绍如何实现js获取前一页面传来的值 1.最简单的方法 

springmvc 项目完整示例08 前台页面以及知识点总结

至此已经基本测试成功了,我们稍作完善,让它成为一个更加完整的项目 我们现在重新规划下逻辑 两个页面 一个登录页面 一个欢迎页面 登陆页面输入账号密码,登陆成功的话,跳转登陆成功 欢迎页面 并且,更新用户登录信息以及记录登录日志 login.jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ t

20155326《网络对抗》免考项目——深入恶意代码之生成恶意代码的动静态结合分析

20155326<网络对抗>免考项目--深入恶意代码之生成恶意代码的动静态结合分析 在前两篇博客中,我分别学习了利用静态分析工具和动态分析功具对恶意代码进行分析,在这篇博客中,我将之前学到的知识结合起来,对恶意代码示例进行更深层次的动静态分析. 并且,我学习了使用IDA PRO和OllyDbg对恶意代码进行进一步细化的动态分析,查看恶意代码中主要函数之间的关系以及函数之间的参数,以此来搞清楚恶意代码在运行后对计算机进行了哪些操作. IDA Pro介绍 IDA Pro交互式反汇编器专业版(Int

拷贝项目后,总是报404找不到页面,但配置没问题

哎!之前也做部署过文件的映射,但是忽然又遇到了问题又想不到了. 发生的前提为: 我之前在eclipse下创建了一个springmvc的项目,然后将此项目拷贝了下,然后重命名了,但是其中的一些配置文件也拷贝进去了(主要是项目里的.settings目录,但是里面的原项目名没有被改掉,从而出现新项目部署后,请求总是报404找不到页面) 原因是 tomcat 中的文件 server.xml <Context docBase="BankSimulateapp" path="/Ba