页面静态化技术 |
您所在的位置：网站首页 › 静态网页技术主要包括哪些内容和方式 › 页面静态化技术 |
|
页面静态化
1动态页面：
通过执行asp、php、jsp和.net等程序生成客户端网页代码的网页。通常可以通过网站后台管理系统对网站的内容进行更新管理。发布新闻，发布公司产品，交流互动，博客，网上调查等，这都是动态网站的一些功能。也是我们常见的。 常见的扩展名有：.asp、php、jsp、cgi和aspx 等。 注意：动态页面的“动态”是网站与客户端用户互动的意思，而非网页上有动画的就是动态页面。 A．交互性好。 B．动态网页的信息都需要从数据库中读取，每打开一个一面就需要去获取一次数据库，如果访问人数很多，也就会对服务器增加很大的荷载，从而影响这个网站的运行速度。 2静态页面：最早的时候，网站内容是通过在主机空间中放置大量的静态网页实现的。为了方便对这些分散在不同目录的静态网页的管理，（一般是通过FTP)，象frontpage/dreamweaver这样软件甚至直接提供了向主页空间以FTP方式直接访问文件的功能。以静态网页为主的网站最大的困难在于对网页的管理，在这种框架里，网页框架和网页中的内容混杂在一起，很大程度地加大了内容管理的难度。为了减轻这种管理的成本，发展出了一系列的技术，甚至连css本身，原本也是针对这种乱七八糟的网页维护而设计的，目的就是把网页表达的框架和内容本身抽象分离出来。 A．静态网页的内容稳定，页面加载速度快。 B．静态网页的没有数据库支持，在网站制作和维护方面的工作量较大。 C．静态网页的交互性差，有很大的局限性。 3为什么需要动态页面静态化： 搜索引擎的优化尽管搜索机器人有点讨厌，各个网站不但不会再象从前一样把它封起来，反而热情无比地搞SEO，所谓的面向搜索引擎的优化，其中就包括访问地址的改写，令动态网页看上去是静态网页，以便更多更大量地被搜索引擎收录，从而最大限度地提高自已的内容被目标接收的机会。但是，在完全以动态技术开发的网站，转眼中要求变换成静态网页提供，同时，无论如何，动态网页的内容管理功能也是必须保留的；就如同一辆飞驶的奔驰忽然要求180度转弯，要付出的成本代价是非常大的，是否真的值得，也确实让人怀疑。 提高程序性能很多大型网站，进去的时候看它很复杂的页面，但是加载也没有耗费多长时间，除了其它必要原因以外，静态化也是其中必需考虑的技术之一。 先于用户获取资源或数据库数据进而通过静态化处理，生成静态页面，所有人都访问这一个静态页面，而静态化处理的页面本身的访问速度要较动态页面快很多倍，因此程序性能会有大大的提升。 静态化在页面上的体现为：访问速度加快，用户体验性明显提升；在后台体现为：访问脱离数据库，减轻了数据库访问压力。 4、FreeMarker原理 基于Java的开发包和类库的一种将模板和数据进行整合并输出文本的通用工具，FreeMarker实现页面静态化的原理是：将页面中所需要的样式写入到 FreeMarker模板文件中，然后将页面所需要的数据进行动态绑定并放入到Map中，然后通过FreeMarker的模板解析类process()方 法完成静态页面的生成。 模板 + 数据模型 = 输出, 注: 这里将省略freemarker的语法, 因为很多都是类似EL表达式的, 这里只提供几种情况的讲解, 其中包括: list, map, list和map混合 FMDemo.java: public class FMDemo { //Freemarker public static void main(String[] args) throws Exception { Configuration conf = new Configuration(); //模板+数据模型 = 输出 //ftl: freemarker template //第一步: 读取html模板 String dir = "C:\\workspace\\freemarker\\ftl\\"; conf.setDirectoryForTemplateLoading(new File(dir)); Template template = conf.getTemplate("freemarker.html"); //第二步: 加载数据模型 Map root = new HashMap(); root.put("world", "世界你好"); //List集合 List persons = new ArrayList(); persons.add("范冰冰"); persons.add("李冰冰"); persons.add("何炅"); root.put("persons", persons); //Map集合 Map map = new HashMap(); map.put("fbb", "范冰冰"); map.put("lbb", "李冰冰"); root.put("map", map); //list和map混合 List maps = new ArrayList(); Map pms1 = new HashMap(); pms1.put("id1", "范冰冰"); pms1.put("id2", "李冰冰"); Map pms2 = new HashMap(); pms2.put("id1", "曾志伟"); pms2.put("id2", "何炅"); maps.add(pms1); maps.add(pms2); root.put("maps", maps); Writer out = new FileWriter(new File(dir + "hello.html")); template.process(root, out); System.out.println("生成完成"); } }freemarker.html: 模板文件 Insert title here ${world} ${person}---红色 ${person}---绿色 ${map[key]} ${map.fbb}/${map.lbb} ${map[key]} ${map.id1}///${map.id2} 5、静态化页面在项目中的使用 当一个商品上架的时候, 通过发送消息来通知babasport-cms 来将对应的页面静态化. 在这里我们只写接收消息的方法, CustomMessageListener.java:接收MQ中的消息 public class CustomMessageListener implements MessageListener{ @Autowired private StaticPageService staticPageService; @Autowired private CMSService cmsService; @Override public void onMessage(Message message) { //先将接收到的消息强转为ActiveMQ类型的消息 //因为在消息发送方那边传递的是Text类型的消息对象, 所以需要转成ActiveMQTextMessage ActiveMQTextMessage amtm = (ActiveMQTextMessage)message; try { String id = amtm.getText(); System.out.println("CMS接收到的ID:"+id); Map root = new HashMap(); Product product = cmsService.selectProductById(Long.parseLong(id)); List skus = cmsService.selectSkuListByProductIdWithStock(Long.parseLong(id)); //去掉重复的颜色 Set colors = new HashSet(); for (Sku sku : skus) { colors.add(sku.getColor()); } root.put("colors", colors); root.put("product", product); root.put("skus", skus); staticPageService.index(root, id); } catch (JMSException e) { // TODO Auto-generated catch block e.printStackTrace(); } } }StaticPageServiceImpl.java: public class StaticPageServiceImpl implements StaticPageService, ServletContextAware{ //SpringMvc 管理 conf private Configuration conf; public void setFreeMarkerConfig(FreeMarkerConfig freeMarkerConfig) { this.conf = freeMarkerConfig.getConfiguration(); } //静态化页面的方法 public void index(Map root, String id){ //输出目录: 通过getPath方法获取的是绝对路径 String path = getPath("/html/product/" + id +".html"); File f = new File(path); File parentFile = f.getParentFile(); if(!parentFile.exists()){ parentFile.mkdirs(); } //spring中已经设置了模板路径: Writer out = null; try { //读 Template template = conf.getTemplate("product.html"); //设置输出的位置 //写 out = new OutputStreamWriter(new FileOutputStream(f), "UTF-8"); template.process(root, out); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); }finally { if (out != null) { try { out.close(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } } } } //获取webapp下的html文件夹所在的位置 //将相对路径转换为绝对路径 public String getPath(String path){ return servletContext.getRealPath(path); } private ServletContext servletContext; @Override public void setServletContext(ServletContext servletContext) { this.servletContext = servletContext; } }使用Spring管理Freemarker配置文件: 模板页面: product.html 中的改动: 引入其他页面: ${color.name }循环遍历imgUrls, 并且使用if…else 进行判断: |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
| CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |