1. 项目背景与核心价值
常熟作为国家历史文化名城，拥有丰富的非物质文化遗产资源。随着数字化时代的到来，如何有效保护、传承和展示这些珍贵的非遗文化成为一个重要课题。这个基于SSM框架的毕设项目正是针对这一需求而设计开发的数字化管理平台。
我在实际开发过程中发现，非遗数字化管理面临几个核心痛点：资料分散难以集中管理、展示形式单一缺乏互动性、传承人信息更新不及时。这个系统通过前后端分离的架构，实现了非遗项目的分类管理、多媒体展示、传承人信息维护和用户互动等功能模块。
提示：选择SSM框架作为技术栈，主要考虑到其成熟稳定、学习成本适中，特别适合高校毕设项目的开发周期和技术要求。同时SSM的模块化设计也便于功能扩展和维护。
2. 系统架构与技术选型
2.1 整体架构设计
系统采用经典的MVC三层架构：
- 表示层：JSP+JSTL+EL表达式
- 业务逻辑层：Spring管理的Service组件
- 数据访问层：MyBatis实现的DAO接口
前端使用Bootstrap框架保证响应式布局，配合jQuery处理动态交互。后端采用Spring 5.x作为容器，整合Spring MVC和MyBatis 3.x，数据库选用MySQL 8.0。
2.2 SSM框架整合关键点
在整合过程中有几个需要特别注意的配置项：
- MyBatis-Spring整合配置：
xml复制<!-- 配置SqlSessionFactoryBean -->
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<property name="dataSource" ref="dataSource"/>
<property name="mapperLocations" value="classpath:mapper/*.xml"/>
<property name="typeAliasesPackage" value="com.changshu.heritage.model"/>
</bean>
<!-- 配置MapperScannerConfigurer -->
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="basePackage" value="com.changshu.heritage.dao"/>
</bean>
- Spring事务管理配置：
java复制@Configuration
@EnableTransactionManagement
public class TransactionConfig {
@Bean
public PlatformTransactionManager transactionManager(DataSource dataSource) {
return new DataSourceTransactionManager(dataSource);
}
}
- Spring MVC拦截器配置：
java复制public class AuthInterceptor implements HandlerInterceptor {
@Override
public boolean preHandle(HttpServletRequest request,
HttpServletResponse response,
Object handler) throws Exception {
// 登录验证逻辑
}
}
// 注册拦截器
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(new AuthInterceptor())
.addPathPatterns("/admin/**")
.excludePathPatterns("/admin/login");
}
3. 核心功能模块实现
3.1 非遗项目管理模块
该模块实现了非遗项目的CRUD操作和分类管理，核心难点在于多媒体内容的存储和展示。我的解决方案是：
- 文件上传采用Apache Commons FileUpload组件：
java复制@PostMapping("/upload")
public String upload(@RequestParam("file") MultipartFile file) {
if (!file.isEmpty()) {
String fileName = UUID.randomUUID() +
file.getOriginalFilename().substring(
file.getOriginalFilename().lastIndexOf("."));
File dest = new File(uploadPath + fileName);
file.transferTo(dest);
return fileName;
}
return null;
}
- 数据库设计采用主从表结构：
sql复制-- 主表
CREATE TABLE heritage_item (
id INT PRIMARY KEY AUTO_INCREMENT,
name VARCHAR(100) NOT NULL,
category_id INT,
description TEXT,
create_time DATETIME
);
-- 多媒体附表
CREATE TABLE heritage_media (
id INT PRIMARY KEY AUTO_INCREMENT,
item_id INT,
media_type ENUM('image','video','audio'),
url VARCHAR(255),
FOREIGN KEY (item_id) REFERENCES heritage_item(id)
);
3.2 传承人信息管理
考虑到传承人信息的敏感性和复杂性，我设计了详细的信息字段和关联关系：
java复制public class Inheritor {
private Integer id;
private String name;
private Integer gender;
private Date birthDate;
private String contact;
private String address;
private String skillDescription;
private List<HeritageItem> heritageItems; // 关联的非遗项目
}
在前端展示时，使用ECharts实现了传承人地域分布的可视化：
javascript复制// 初始化地图实例
var myChart = echarts.init(document.getElementById('map'));
// 加载常熟地理数据
$.get('json/changshu.json', function(geoJson) {
echarts.registerMap('changshu', geoJson);
// 配置项
var option = {
series: [{
type: 'map',
map: 'changshu',
data: inheritorData
}]
};
myChart.setOption(option);
});
4. 系统特色功能实现
4.1 三维虚拟展厅
为了增强展示效果，系统整合了Three.js实现3D虚拟展厅功能。核心实现步骤：
- 场景初始化：
javascript复制// 创建场景
const scene = new THREE.Scene();
// 添加相机
const camera = new THREE.PerspectiveCamera(75,
window.innerWidth/window.innerHeight, 0.1, 1000);
// 添加渲染器
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// 加载3D模型
const loader = new THREE.GLTFLoader();
loader.load('models/exhibition.glb', function(gltf) {
scene.add(gltf.scene);
});
- 交互控制实现：
javascript复制// 鼠标控制
const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.enableDamping = true;
controls.dampingFactor = 0.05;
function animate() {
requestAnimationFrame(animate);
controls.update();
renderer.render(scene, camera);
}
animate();
4.2 微信小程序端适配
考虑到移动端用户需求，系统还提供了微信小程序版本，主要技术点：
- 后端接口适配：
java复制@RestController
@RequestMapping("/api/wx")
public class WxController {
@GetMapping("/heritage/list")
public Result listHeritage(@RequestParam(required = false) Integer category) {
// 返回JSON格式数据
}
}
- 小程序端调用示例：
javascript复制wx.request({
url: 'https://yourdomain.com/api/wx/heritage/list',
success(res) {
this.setData({heritageList: res.data});
}
})
5. 部署与运维方案
5.1 生产环境部署
推荐使用以下部署方案：
- 服务器：CentOS 7.x
- Web容器：Tomcat 9.x
- 数据库：MySQL 8.0主从配置
- 文件存储：Nginx静态资源服务+阿里云OSS备份
部署关键步骤：
- 数据库初始化：
bash复制mysql -u root -p < init.sql
- Tomcat配置优化：
xml复制<!-- conf/server.xml -->
<Connector port="8080" protocol="HTTP/1.1"
connectionTimeout="20000"
maxThreads="500"
minSpareThreads="30"
acceptCount="100"
redirectPort="8443" />
- Nginx反向代理配置：
nginx复制server {
listen 80;
server_name heritage.changshu.gov.cn;
location / {
proxy_pass http://127.0.0.1:8080/heritage;
proxy_set_header Host $host;
}
location /static/ {
alias /data/heritage/static/;
expires 30d;
}
}
5.2 系统监控与维护
建议配置以下监控指标：
- 应用层：JVM内存使用、线程池状态、请求响应时间
- 数据库：连接数、慢查询、锁等待
- 服务器：CPU、内存、磁盘IO
可以使用Prometheus+Grafana搭建监控平台：
yaml复制# prometheus.yml 配置示例
scrape_configs:
- job_name: 'heritage'
metrics_path: '/actuator/prometheus'
static_configs:
- targets: ['localhost:8080']
6. 开发经验与避坑指南
在实际开发过程中，我总结了以下几个关键经验点：
- MyBatis结果映射问题：
当遇到复杂关联查询时，推荐使用<resultMap>的<collection>和<association>标签，而不是简单的自动映射。例如：
xml复制<resultMap id="heritageDetailMap" type="HeritageItem">
<id property="id" column="id"/>
<collection property="mediaList" ofType="HeritageMedia"
select="selectMediaByHeritageId" column="id"/>
</resultMap>
<select id="selectMediaByHeritageId" resultType="HeritageMedia">
SELECT * FROM heritage_media WHERE item_id = #{id}
</select>
- Spring事务失效场景：
- 同类方法调用（解决方法：使用AOP代理或拆分到不同类）
- 异常类型不匹配（确保抛出RuntimeException或配置rollbackFor）
- 非public方法（Spring默认只代理public方法）
- 性能优化建议：
- 使用Redis缓存热点数据：
java复制@Cacheable(value = "heritage", key = "#id")
public HeritageItem getById(Integer id) {
return heritageMapper.selectByPrimaryKey(id);
}
- 批量操作使用MyBatis的foreach标签：
xml复制<insert id="batchInsertMedia">
INSERT INTO heritage_media(item_id, media_type, url) VALUES
<foreach collection="list" item="media" separator=",">
(#{media.itemId}, #{media.mediaType}, #{media.url})
</foreach>
</insert>
- 跨域问题解决方案：
对于前后端分离的情况，推荐使用Spring提供的CORS支持：
java复制@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/api/**")
.allowedOrigins("*")
.allowedMethods("GET", "POST")
.maxAge(3600);
}
}
这个非遗数字化管理系统的开发让我深刻体会到，一个好的毕设项目不仅需要完整实现功能，更要考虑实际应用场景和用户体验。特别是在文化传承领域，技术应该服务于内容展示和文化传播的本质需求