基于SSM框架的圖片信息管理系統

蔣昌兵

摘要：進入數字化時代，日常工作中產生了大量的多媒體圖片數據，為了高效存儲和使用，設計了一個基于Java語言開發后端為SSM（Spring+SpringMVC+MyBatis）框架的圖片信息管理系統，集圖片采集、分析、存儲、管理于一體。系統通過基礎數據采集、圖片數據管理和數據流轉追溯最終實現圖片資源整合、資源共享、資源流轉追溯的閉合管理，打破數據孤島使圖片資源能夠更好地進行整合與共享，降低圖片管理難度，提升信息化管理水平。

關鍵詞：圖片管理；SSM框架；軟件工程；系統實現

一、前言

當前我國正從互聯網時代進入數字化時代，各行各業信息化與數字化建設如火如荼，教學、培訓、科研、會議、活動等業務會產生大量的多媒體數據，其中圖片數據居多。因歸口部門不同，這些數據都是各自保存管理，久而久之形成了數據孤島，不利于資源整合、資源共享，隨著時間的推移給后期進行數據利用造成了極大的不便[1]。研發圖片信息管理系統對海量圖片數據實現存儲、分類、查詢、添加特征碼和圖片轉碼等功能，能對工作中產生的圖片數據管理起到關鍵性作用[2]。因此建設一套能有效處理多媒體數據資源的圖片信息管理系統對實現內部信息化與數字化建設發展具有重要意義。

二、系統分析

（一）需求分析

本系統是一款B/S架構的圖片信息管理系統，系統支持用戶注冊、登錄、修改密碼、注銷和權限管理等基本功能。使用者根據分配的權限對圖片進行管理，可為圖片添加標題、類型和備注等信息。系統支持圖片信息的增刪改查，校驗圖片格式，可以按上傳日期、標題、標簽等進行排序。所有的用戶信息和圖片信息都存儲在MySQL數據庫中，以實現數據的持久化。考慮到用戶可能會在不同的設備上使用系統，因此系統的用戶界面應采用成熟的前端頁面框架設計，以適應不同的屏幕尺寸。

（二）關鍵技術介紹

本系統使用Java語言開發，前端采用EasyUI框架，后端采用SSM框架，是經典的MVC開發模式。視圖層與邏輯層結構分離實現低耦合，符合當前計算機信息系統開發理念，也適合軟件研發人員的編碼習慣，常用于企業級Web應用開發。本系統使用MySQL數據庫系統對圖片信息進行持久化進而實現對圖片的增刪改查。通過對業務量的分析可以對MySQL數據庫進行針對性的設置，選擇適合的存儲引擎實現數據的高效存儲，做主從部署從而實現讀寫分離提高讀寫速度。EasyUI在樣式上已經適配各類瀏覽器，研發過程中無需再考慮頁面兼容性，其支持響應式設計，可以適應不同的屏幕尺寸，因此非常適合用來創建圖片信息管理系統的用戶界面。SSM框架主要負責系統中業務邏輯處理，使系統中的各模塊形成弱關聯，遵循軟件開發的“高內聚低耦合”思想。MVC設計模式使系統的結構層次清晰，不會出現HTML代碼、JS代碼、Java代碼都混合在一個頁面，冗余代碼大量減少代碼可讀性增強。

（三）可行性分析

1.技術可行性

JDK1.8環境、EasyUI前端框架、SSM框架和MySQL數據庫是當前Web應用開發的主流開發技術和開發環境。用戶能在任何遵循GPL協議下使用EasyUI前端框架；JDK1.8是商業免費版本；SSM框架是免費的開源框架，擁有成熟的社區和用戶群；MySQL Community Server社區版本開源免費且使用群體大。采用以上技術無商業風險且市面上有大量的信息管理系統成熟案例，因此本系統在技術上具備可行性。

2.操作可行性

本系統基于B/S架構開發易于部署和維護，移植性強，可根據使用需求跨平臺部署，可以在不同的硬件服務器與網絡操作系統上運行，系統升級只需要考慮服務器端進而降低了總體維護成本[3]。通信采用標準的HTTP/HTTPS協議，具有良好的可擴展性。使用者只需打開瀏覽器就可以進行相應操作，因此本系統在操作上具備可行性。

三、系統開發技術

（一）前端技術

本系統前端頁面使用一種基于jQuery的用戶界面庫EasyUI來進行頁面信息的展示，是一款幫助開發者更容易地構建Web應用程序的前端用戶界面插件開發庫。EasyUI提供了一套完整的用戶界面組件，包括窗口、對話框、表單、布局、菜單、工具欄、樹形控件、數據表格等。它同時支持Angular、Vue、jQuery等技術棧進行開發，并且提供了非常豐富的組件，通過由具體需求進行自由組合使用，構造出的頁面應用可以支持兼容多種瀏覽器。EasyUI的特點：簡單易用，提供了豐富的API，組件都是基于HTML、CSS和JavaScript實現的，可以很容易地嵌入任何Web頁面中，方便對組件進行定制和擴展；功能豐富，提供了一套完整的用戶界面組件，可以滿足大部分Web應用程序的需求；主題定制，EasyUI支持主題定制，可以輕松地更改應用程序的外觀和風格；支持國際化，可以根據用戶的語言偏好自動切換界面的顯示語言；兼容性好，兼容所有主流的Web瀏覽器，包括IE6+、Firefox3+、Safari3+、Chrome和Opera9+。

（二）后端技術

本系統后端采用Spring、Spring MVC和MyBatis三個開源框架的組合，即SSM框架。這三個框架分別在企業級Java應用開發中解決了表現層、業務層和持久層的問題。Spring是一個開源的企業級Java應用框架，提供了一種簡單的方式來開發可測試和可重用的代碼。Spring的核心思想是控制反轉（IoC）和面向切面編程（AOP），可以用于構建各種類型的Java應用，包括Web應用、桌面應用和企業級應用。Spring MVC是Spring框架的一部分，是一個用于構建Web應用的模型－視圖－控制器（MVC）框架。Spring MVC提供了一種分離的方式來開發Web應用，使得開發者可以更容易地關注業務邏輯，而不是細節實現。MyBatis是一個優秀的持久層框架，它支持定制化SQL、存儲過程以及高級映射，消除了幾乎所有的JDBC代碼和參數的手動設置以及結果集的檢索。可以使用簡單的XML或注解進行配置和原始映射，將接口和Java的POJO（Plain Old Java Objects，普通Java對象）映射成數據庫中的記錄[4-5]。SSM框架的特點是：可以簡化Java Web開發，使開發者更專注于業務邏輯的實現；有強大的社區支持，有大量的文檔和教程，以及活躍的用戶和開發者社區；采用了MVC模式，有助于實現業務邏輯、數據和用戶界面的分離，提高了代碼的可維護性和重用性；提供了靈活的配置方式，可以根據項目的需要選擇適合的配置方式，例如XML配置或注解配置。

（三）數據庫技術

MySQL是世界上最流行的開源關系數據庫管理系統（RDBMS）。它是基于SQL（Structured Query Language，結構化查詢語言）的，SQL是用于管理和操縱數據庫的標準語言。MySQL的特點是：

1.開源

意味著任何人都可以使用和修改它的源代碼，使得技術得到了廣大開發者社區的強大支持，且在性能、穩定性和功能上都得到了持續的優化和改進。

2.在性能上進行了大量優化

可以處理大量數據并支持大并發用戶。在許多基準測試中，都表現出了優秀的性能。

3.易于安裝和使用

提供了大量的工具和庫，使得開發者可以很容易地創建和管理數據庫。此外，開發說明文檔非常完善，有大量的教程和示例可以幫助開發者快速上手。

4.提供了一套強大的安全機制

包括訪問控制、加密和SSL等，可以保護數據的安全。

5.跨平臺性能優秀

可以在各種操作系統上運行，包括Windows、Linux和Mac OS等。

6.支持各種存儲引擎

每種存儲引擎都有其特定的用途和優點，使得其可以應對各種不同的使用場景。

四、圖片信息管理系統設計

（一）整體技術路線

以實現圖片信息高效管理為目標，以采集的圖片資源數據為基礎，依據數據處理及使用流程邏輯進行資源構造與數據存儲，設計合理的圖片信息管理系統，最終實現圖片資源整合、資源共享、資源流轉追溯的閉合管理。整個圖片信息管理系統的技術路線如圖1所示。

（二）系統結構設計

根據系統需求分析設計了圖片信息管理系統整體業務邏輯，整個系統的功能模塊劃分如圖2所示，系統被劃分為系統用戶權限模塊、圖片信息采集模塊、圖片信息查詢模塊、圖片信息編輯模塊、圖片信息刪除模塊、圖片相冊管理模塊、圖片瀏覽下載模塊、圖片特征碼生成模塊、系統操作日志模塊共9個子模塊。

系統用戶權限模塊將登錄賬號的角色及對應的權限信息進行驗證，系統超級管理員會提前創建好用戶角色及配置好該角色訪問權限，系統進行驗證后將獲取的業務模塊渲染加載顯示。

圖片信息采集模塊由用戶自定義上傳采集與第三方接口采集組成。數據信息采集后按文件目錄保存并按預先定義好的數據結構將信息存入數據庫供系統其他模塊使用。

圖片信息查詢模塊、圖片信息編輯模塊、圖片信息刪除模塊由用戶根據使用需要對圖片進行相應的操作，目的是進一步優化圖片信息做好精細化管理。

圖片相冊管理模塊主要是將圖片信息按分類進行管理，不同分類創建相應圖片數據集。圖片數據集由圖片構成，可以實時進行創建、添加、刪除操作。相冊管理中的操作不會影響圖片信息數據。

圖片瀏覽下載模塊主要是預覽或下載經過系統采集模塊預定方式處理后的圖片信息。用戶打開操作頁面點擊需要瀏覽的圖片，該圖片ID通過數據庫讀取的數據結構信息從文件目錄中打開圖片文件并將其轉碼為base64，由于圖片采集保存的資源目錄是當前系統部署所在的服務器，因此在前端頁面利用data url（本地數據）的特性直接讀取圖片信息而不是通過訪問系統資源路徑的方式訪問，此舉提高了系統資源利用率、節省了系統內部開銷及帶寬，解決了超高清圖片加載時間過長的問題，應用在高清、大分辨率的圖片查看時有非常好的魯棒性。用戶在預覽圖片時有裁剪、尺寸修改等操作無需通過傳統的方式去訪問服務端提供的url獲取圖片，可以通過在頁面上使用data url的方式進行本地IO讀寫快速對圖片進行顯示，此方法極大地提升了用戶體驗。用戶還可以根據尺寸字典表中設定的參數進行不同分辨率的圖片下載，以滿足不同使用場景的需要。

圖片特征碼生成模塊主要是利用特定的算法生成具有特殊意義的編號或者是特定logo水印的圖文進行圖片信息內容的添加，最終合并生成含有全新信息的圖片供后續有關業務中使用。本模塊主要提供用戶自定義標識碼和隨機的水印信息，使圖片增強美觀性、實用性、安全性。在知識產權與隱私保護日益重視的當下，如果發生盜用、濫用等侵權情況可追蹤到圖片的來源，也用于保護數據傳播，真偽鑒別以及非法拷貝控制。

系統操作日志模塊主要提供系統使用者全流程的痕跡管理，根據操作時間、操作模塊、操作對象、操作具體內容等信息生成操作記錄進行數據庫存儲。

（三）系統架構設計

系統架構按結構邏輯自上往下為四個層級，如圖3所示。用戶層主要是系統的操作用戶為圖片數據采集員、圖片數據管理員、系統管理員。表現層也就是視圖層是進行人機交互的界面部分，包括系統中的基礎數據和業務數據。業務邏輯層主要是根據功能需求進行數據處理，主要負責業務流程的實現，按功能模塊劃分為兩個子系統，用戶信息權限子系統功能包括用戶信息、角色信息、部門信息、權限信息四個部分，圖片信息管理子系統功能包括數據采集、圖片管理、相冊管理、特征字典、瀏覽下載、外鏈分享、操作日志七個部分。數據庫層按數據類型分為用戶信息數據、 圖片信息數據、業務字典數據三部分。

（四）數據庫設計

系統的正常運行離不開數據庫系統，一個安全、穩定、可靠的數據庫對信息系統的運行起到至關重要的作用。本系統的數據庫選擇免費開源的MySQL，根據系統概要需求按系統權限業務模塊、圖片業務模塊進行了數據表設計，圖片信息管理系統數據庫結構如表1所示。

本系統數據表按數據類型劃分為以下兩個模塊：

1.系統權限模塊

本模塊中的主體表有用戶表、部門表、角色表、權限表，包含用戶姓名、所在部門、登錄賬號、所屬角色、模塊菜單的信息。用戶表與部門表可以實現操作人員基礎信息的管理。角色表與權限表可以分配使用功能菜單的數量，生成角色—菜單的映射關系。用戶表與角色表相關聯可以實現不同角色在系統中擁有哪些操作功能及系統使用級別。

2.圖片業務模塊

本模塊中主體表有圖片信息表、相冊表、圖片類型表、相冊類型表、圖片關聯表、特征碼字典表、水印字典表、尺寸字典表、圖片外鏈表、日志表，包含圖片基礎信息、相冊基礎信息、圖片配置信息、圖片分享信息、數據操作記錄信息。圖片表與相冊表關聯可以將圖片數據應用于一對多的業務場景。特征碼字典與水印字典表可以保存不同用戶需要的、經常反復使用的基礎數據或者是不同業務流程中需要用到的專用數據。圖片外鏈表可以按需求生成不同尺寸的圖片訪問地址供其他用戶在公網上進行瀏覽。日志表可以記錄所有用戶的使用情況，進行系統操作安全審計及數據使用追蹤溯源。

五、圖片信息管理系統實現

（一）系統用戶權限模塊實現

用戶登錄系統前按步驟注冊賬號或者由系統管理員統一分配賬號，在登錄頁面輸入用戶名和密碼，前端頁面進行一些簡單的判空、特殊字符的驗證，前端頁面校驗合法的數據進入后端程序的登錄方法中訪問數據庫進行下一步的核驗。登錄方法中將比對數據庫中的用戶名與密碼和傳入的是否一致，通過一致性驗證后獲得用戶名對應的角色信息，再通過角色信息獲取與之分配的權限信息，此處的權限信息包括用戶所能訪問的菜單、模塊、按鈕等。到此，整個登錄流程后端程序部分已處理完畢，前端頁面則根據獲取的權限信息進行頁面渲染，用戶進入系統主界面。

（二）圖片信息采集模塊實現

采集方式主要通過用戶登錄系統后打開專門的圖片上傳頁面進行。例如，采集手機、平板、數碼相機、個人PC機等多媒體設備上產生的圖片數據。用戶進入頁面后選中需要上傳的圖片，填寫一些圖片相關信息后即可上傳至系統。采集模塊會將上傳者信息、上傳時間、備注信息等進行記錄，采集的圖片會自動根據字典表中的參數去生成數據。例如，不同類型格式的圖片、不同分辨率大小的圖片、不同水印logo的圖片、預覽縮略圖等。對采集到的每張圖片，系統會生成唯一編號。

（三）圖片信息管理模塊實現

用戶進入對應的圖片信息管理頁面后可以按條件進行圖片資源的檢索，單個或批量對圖片信息進行編輯操作或刪除操作。用戶可以查看圖片的來源、所屬分類、相冊關聯情況，可以對圖片進行裁剪、生成特定大小縮略圖、動態生成外鏈、圖片停用等操作。

（四）圖片相冊管理模塊實現

用戶進入圖片相冊管理界面后首先創建一個相冊集，進行名稱、關鍵信息的填寫，相冊集的屬性可以是專題、會議、團建等活動，創建好相冊后選擇系統中的圖片添加到相冊上，也可以將其他相冊中圖片復制到新的相冊。相冊中可以進行圖片的增刪改查、是否公開分享等操作。相冊默認為誰創建誰擁有管理權限。

（五）圖片瀏覽下載模塊實現

用戶進入頁面后默認顯示所有采集的圖片信息。圖片數據按采集上傳時間倒序排列，可以選擇相冊模式瀏覽，相冊模式只顯示相冊相關聯的圖片信息。瀏覽頁面可以輸入采集人、采集時間、分辨率、標簽、備注等條件進行模糊檢索，在瀏覽圖片的同時可以進行放大、縮小、旋轉、裁剪等操作，點擊圖片下方“下載”按鈕可以進行圖片的本地保存。

（六）圖片特征碼生成模塊實現

用戶點擊圖片特征碼生成模塊會出現水印管理和標識碼管理兩個子菜單。進入標識碼管理頁面或水印管理頁面會按最新上傳時間倒序顯示圖片數據信息，頁面可以輸入關鍵字進行數據檢索。水印管理頁面點擊“上傳”按鈕可以將制作好的水印圖片進行上傳，選中某一條數據可以進行水印圖片的預覽并且進行增刪改操作。標識碼管理頁面中點擊“創建”按鈕會彈出標識碼生成窗口頁面，可以選擇隨機模式或自增模式生成純數字、純字母、字母數字符號混合的標識碼。兩個子菜單上的“合并”按鈕可以將水印圖像或生成的標識碼合并到選中的圖片上，合并時可以設置特征碼的大小、放置的位置，最終生成含有特征碼的圖片。

（七）系統操作日志模塊實現

系統管理員可以查看所有用戶的操作記錄，其他用戶只能查看自己的操作記錄。用戶進入頁面可以查看當前最新的操作日志數據，輸入用戶名后點擊檢索按鈕可以查看該用戶使用系統以來的所有操作信息，輸入開始時間和結束時間可以查詢該時間段內用戶的操作記錄，輸入操作類型可以查看用戶何時進行過這類操作，最后可以使用導出功能生成報表文件。

六、結語

SSM框架是當前主流的企業級信息系統開發首選技術，可以減少開發成本，提高開發效率。本系統在諸多圖片管理的場景中得到了很好的應用，也取得了較好的效果，表明本系統達到了設計之初的要求。系統在使用中也發現需要優化之處。例如，圖片進行預覽時缺乏各類風格濾鏡處理等，后期將進一步對系統進行更新迭代。

參考文獻

[1]張華一.基于B/S架構的圖片管理系統WEB前端關鍵技術的設計與實現[D].北京：北京郵電大學，2017.

[2]劉潤澤.圖片管理系統后臺設計與實現[D].北京：北京郵電大學，2017.

[3]劉偉，霍德尚，張效岳.植物圖像管理系統設計與實現[J].信息技術與信息化，2022（01）：12-15.

[4]唐軍，薛亞東，盧慧，等.基于GIS的自然保護區本底資源調查系統的設計與實現[J].計算機應用與軟件，2023，40（08）：1-6+12.

[5]潘顯民，歐戰祥，夏雅.仿生學下基于SSM的大學生學習資源共享系統設計[J].湘南學院學報，2023，44（05）：44-48.

基金項目：2023年湘潭市科技系統第二批大事要事保障項目“多媒體終端數字圖像處理技術研究與應用”（項目編號：GX-YB20231017）

作者單位：湘潭技師學院、湘潭科技職業學院

■ 責任編輯：王穎振、楊惠娟