页面静态化技术

什么叫页面静态化？
使用FreeMaker技术（全称FreeMarker Template Language (FTL)），它是一款模板引擎： 即一种基于模板（.ftl）和要改变的数据（Map对象或Java实体 ，但是List集合不行，但是它们可以放到Map里）
其实就是数据库中有很多条记录，它们的展示界面都差不多，就比如淘宝里的商品，只是信息不一样，但是展示页面都是一样的。然而每次用户访问时都要查询一次数据库，大量的访问增加了数据库的压力。
所以为了减轻数据库的压力，就每次在添加或者修改商品的时候，在对数据库数据改动之前，将对应数据放到模板中，每个商品都生成一个对应的html页面；到时候用户之间跳转访问

优点：减轻数据库压力、提高响应速度、提升用户体验
缺点：占用空间，一条数据就会有一个html

总结：以空间换时间

==========================================================
步骤一：导包：freemarker.jar
二：抽取成为工具

public class FreeMarkerUtils {

	public static String CreateFile(String path, String name, String suffix, Object data) {
		OutputStreamWriter out = null;
		try {
//			1.导入freemarker.jar
//			2.获取模板(Template)对象
//				获取Configuration对象 -- 为了获取模板对象
			Configuration config = new Configuration(Configuration.VERSION_2_3_28);
//				设置默认加载路径
			File file = new File(path);    // 参数1： String path
			config.setDirectoryForTemplateLoading(file);
//				设置默认编码
			config.setDefaultEncoding("utf-8");
//				获取模板
			Template template = config.getTemplate(name);         //参数2： String name
//			3.准备数据，就是传递进来的Data

//			4.template.process()生成静态资源                                                                                                                                                 //   参数4： String suffix
			String url = System.currentTimeMillis()+suffix;
			out = new OutputStreamWriter(new FileOutputStream(new File(file, url)), "UTF-8");
			//FileWriter out = new FileWriter(new File(file, "test.html"));
			template.process(data, out);
			
			return url;//返回url，是为了插入数据库里，之后前端展示
		} catch (Exception e) {
			e.printStackTrace();
		} finally {
			// 关流
			if(out != null) {
				try {
					out.close();
				} catch (IOException e) {
					e.printStackTrace();
				}
			}
		}
		return null;
	}
}

三：在增加，或者修改使用工具

@Override
	public void save(Article article, HttpServletRequest req) {
		// 生成模板
		String realPath = req.getServletContext().getRealPath("/static/template");
		File file2 = new File(realPath);
		// 如果不存在,则创建
		if(!file2.exists()){
			file2.mkdirs();
		}
		
		// name : 当前模板名字
		String url = FreeMarkerUtils.CreateFile(realPath, "article.ftl", ".html", article);
		
		article.setUrl(url);
		if(article.getId()==null) {//根据隐藏域Id是否有值
			// 添加
			mapper.add(article);
		}else {
			// 修改
			// 查询
			Article arc = mapper.findOne(article.getId());
			File file = new File(realPath,arc.getUrl());
			if(file.exists()){
				file.delete();
			}
			mapper.update(article);
		}	
	}

四、后台查询

@Override
	public Map<String, Object> findByCode() {
		
		Map<String, Object> map = new HashMap<String, Object>();
		// 应该有三个list,每个list放入 技术文章 行业新闻, 学科咨询
		// 技术文章
		List<Article> list1 = mapper.findByCode(BaseCode.TECHNOLOGY);
		
		// 行业新闻
		List<Article> list2 = mapper.findByCode(BaseCode.INDUSTRY);
		
		// 学科咨询
		List<Article> list3 = mapper.findByCode(BaseCode.SUBJECT);
		
		map.put(BaseCode.TECHNOLOGY, list1);
		map.put(BaseCode.INDUSTRY, list2);
		map.put(BaseCode.SUBJECT, list3);
		return map;
	}

五、前台展示

$(function() {
	$.ajax({
		type: "post",
		url: "/home/article/findAll",
		dataType: "json",
		success: function(msg){
			// 获取技术文章的所有信息
			var technology = msg.technology;
			$.each(technology,function(i,n){//i表示下标，n表示遍历对象
				$("#technology").append('<a target="_blank" href="/static/template/'+n.url+'"><li class="flex-box"><div class="ellipsis-line" title="'+n.title+'"></div><div class="date">'+n.createDate+'</div></li></a>');
			});
			
			// 获取行业新闻的所有信息
			var industry = msg.industry;
			$.each(industry,function(i,n){
				$("#industry").append('<a target="_blank" href="/static/template/'+n.url+'"><li class="flex-box"><div class="ellipsis-line" title="'+n.title+'"></div><div class="date">'+n.createDate+'</div></li></a>');
			});
			
			// 获取学科咨询的所有信息
			var subject = msg.subject;
			$.each(subject,function(i,n){
				$("#subject").append('<a target="_blank" href="/static/template/'+n.url+'"><li class="flex-box"><div class="ellipsis-line" title="'+n.title+'"></div><div class="date">'+n.createDate+'</div></li></a>');
			});
		}
	});
})