基于MVC的图片管理系统设计与实现

基于MVC的图片管理系统设计与实现

卢亿

卢亿（河海大学）

摘要：本文将详细介绍实现一种基于MVC并结合FLASH、JDOM等多种技术来设计实现对图片进行有效管理的系统。本系统使得图片或图文的布局、显示不再复杂凌乱，给用户带来简单美观体验，同时“水印”及“下载图片”功能的定制可起到维护图片版权的作用。

关键词：MVC图片管理系统FLASH

0引言

随着网络技术迅速发展，人们通过网络浏览相关信息愈发方便，简单的罗列展示信息已经不能适应用户对复杂信息简洁具体、美观醒目体验需求。图片，作为一种生动形象的信息表现形式，在网页的信息展示和美观效果的追求中都起到的作用举足轻重。无论是专门的图片管理系统（网站）还是普通的主题阐述网页都涉及如何美观、简洁地对大量相关图片进行展示。传统图片显示形式存在很多缺陷，如图片可随意地被复制、下载和使用。

本文结合MVC多层设计模式开发速度快、易于维护测试和扩展等优点[2]及Flash应用在视图层（View）所带来的视觉体验的特性，来实现动态、简洁及美观的图片管理功能。XML技术可以作为实现这种结合纽带，大大减低了这两种技术依赖性，更好地实现各个层面开发的独立性。

1系统分析和设计

1.1架构流程分析

拥有创建相册并上传图片的权限角色可以创建相册并上传图片，系统把图片压缩处理生成小图并原始图片加上水印，然后把相册和图片的基本信息和关系存入数据库。

根据用户选择的相册，系统查找并呈现出该相册及其包含图片的信息，同时把这些图片及其压缩后的预览小图的地址都写入XML文件中；界面显示FLASH相册，其自动加载XML文件，读取其指向的图片，当用户点击供预览小图时，原始图片显现。

1.2类与对象的识别及实体关系分析：

系统涉及的对象包括：相册对象、图片对象、XML对象，（FLASH对象在FLASH开发中考虑）。在设计相册类、图片类，XML类时，本文将分别建立各自的实体类和对数据基本操作的类，如相册类（AlbumBean，AlbumDao）。

该系统核心的实体是相册和照片，他们之间是一对多的包含关系。

1.3数据库及界面设计：

数据库设计，按系统特性选择使用数据库，并根据识别的类与对象及实体关系设计数据表。

界面（包括FLASH界面）的设计要力求简单、美观和响应较快的特点。所有界面的风格应一致，具有相同含义的术语含义相同，且易于理解，而且拥有良好的直觉特征。

FLASH设计，是否提供下载图片的功能。

2技术分析

本系统采用J2EE架构技术、应用MVC模式，视图层采用JSP技术为主，使用JavaScript脚本语言进行验证和简单的显示控制，并结合FLASH技术进行美观布局。模型层，将对象和相应操作数据库的方法分别封装成JavaBean的形式。控制层则通过创建Servlet来进行请求和数据流转的控制。从而保证业务逻辑、数据逻辑、控制逻辑以及显示逻辑之间的相对独立性。

FLASH技术[3]：要通过利用FLASH技术，制作出外形动感、美观的相册，需要制作者有一定的美工技术和Flash制作经验。网络上有很多开源的很好的FLASH作品，进行必要的改动后同样可以使用，但这样可能往往与网站风格等方面缺乏统一性，而且也体现不出系统的个性、特性所在。

XML技术：XML（ExtensibleMarkupLanguage）即可扩展标记语言，是SGML(标准通用标记语言)。XML是Internet环境中跨平台的，依赖于内容的技术，是当前处理结构化文档信息的有力工具。

将上面介绍的主要技术有效结合，就成为该系统成功实现的关键。这里我引用了JDOM这个开源技术来作为搭建XML文档这个重要桥梁的技术工具。JDOM是一个开源项目，它基于树型结构，利用纯JAVA的技术对XML文档实现解析、生成、序列化以及多种操作。

3系统实现

系统实现，就以显示图片的核心模块来做具体的分析。

当用户点击index.jsp(列出相册的页面)中的某一相册封面，则页面就会向控制层的DoSthServlet.java提出请求（request），该Servlet提取request中的参数，继而调用操作类AlbumDao(对相册对象的数据库操作类)和PicDao(对图片对象的数据库操作类)分别依据对象类AlbumBean(相册实体类)、PicBean（图片实体类），查出对应相册的主题和文章内容并存入HttpRequest对象的属性中以供调用，并找到有哪些图片属于该相册（即查询出所有图片信息），DoSthServlet再调用XmlEditBean，取到并清空XML文档，再利用JDOM将上一步所查询出的所有图片的地址（根据图片名加上路径）、图片描述逐条逐条地写入Xml文档中，并输出该文档。最后，DoSthServlet给予response（相应），简单调转到last.jsp页面，该页面取到请求对象属性中关于相册的主题、文章的内容并将其显示，此时页面又自动加载FLASH文件，FLASH文件开始运行时就先加载指定的XML文档，此时FLASH就能定位到用户所要查看的图片了。

至此该系统的显示图片模块功基本实现。然而当用户多次点击相册查看图片会发现出现图片不是用户所点击相册中的，而是历史记录。这是因为客户端浏览器中缓存了XML文档，最新的XML文档就不会被FLASH加载到。解决的方法是在FLASH文件动作的代码中调用XML文档地址的后面加上随机函数作为参数。

参考文献：

[1]ElliotteRustyHarold.ProcessingXMLwithJava.AGuidetoSAX.DOM.JDOM.JAXP.andTrAX[M].AddisonWesley.2002.8.

[2]BudiKurniawan等.深入浅出Struts[M].北京.人民邮件出版社.2007.9.

[3]朱治国，缪亮，陈艳丽.FlashActionScript3.0编程技术教程[M].北京.清华大学出版社.2008.6.

[4]张怀彬，臧洁.基于MVC模式的合作医疗信息平台的设计与实现[J].辽宁大学学报.2008年01期.62-64.