在線筆記與交流平臺設計與實現(xiàn)

鹿德源 楊蕾 王浩震

摘? 要：隨著辦公無紙化和信息化的演進，傳統(tǒng)手寫筆記、文檔的記錄方式逐漸被移動存儲和在線記錄方式所取代。文章設計一種基于B/S架構的在線筆記與交流平臺，將筆記記錄、文檔管理、個人云盤、在線交流集成在同一個系統(tǒng)內。用戶可通過終端瀏覽器隨時進行使用，簡化了筆記、文檔記錄和管理的流程，并且能夠進行筆記的檢索和相關內容的討論。該平臺設計完成度高，具有可用性強、操作簡單等特點，可隨時投入實際應用。

關鍵詞：SpringBoot；Vue；在線筆記；交流平臺

中圖分類號：TP311? 文獻標識碼：A? 文章編號：2096-4706（2023）09-0022-04

Abstract： With the evolution of paperless office and informatization， the traditional way of recording of handwritten notes and documents has gradually been replaced by mobile storage and online recording. This paper designs an online note and communication platform based on B/S architecture， which integrates note recording， document management， personal cloud disk and online communication into one system. Users can use it at any time through the terminal browser， which simplifies the process of note-making， document recording and management， and can retrieve notes and discuss relevant contents. The platform has high design completion， strong usability， simple operation and other characteristics， and can be put into practical application at any time.

Keywords： SpringBoot; Vue; online note; communication platform

0? 引? 言

筆記的記錄作為日常生活和學習中的一個重要環(huán)節(jié)，其記錄情況與管理方式關乎人們工作和學習的效率[1，2]。隨著信息時代的到來以及辦公無紙化的推進，傳統(tǒng)的手工記錄筆記或將文檔存儲于個人PC或U盤上已經不能滿足諸多遠程辦公場景的需要。相較于傳統(tǒng)的筆記記錄管理方法，使用云平臺進行筆記記錄和文檔存儲更加便捷。此外現(xiàn)存在的筆記記錄平臺均不提供交流的平臺，這限制了信息的流通，所以需要開發(fā)低成本，同時兼具筆記記錄管理與交流的在線筆記記錄與交流系統(tǒng)，使用戶隨時能夠進行筆記記錄與交流。

1? 系統(tǒng)概述

在線筆記與交流平臺面向的主要用戶是在校學生和IT從業(yè)者，旨在為他們提供一個能夠隨時進行筆記記錄和交流的平臺。該平臺通過使用在線Web平臺進行筆記記錄的方式取代傳統(tǒng)的紙質手寫或PC離線編輯的方式，此外提供一個筆記分享交流的平臺用于平臺內用戶的交流。

1.1? 系統(tǒng)工作原理

在線筆記與交流平臺采用B/S架構和MVC模式開發(fā)。B/S架構將系統(tǒng)功能實現(xiàn)的核心部分封裝過后集中到Web服務器上，簡化了系統(tǒng)的開發(fā)、維護和使用，使用戶隨時可通過瀏覽器遠程訪問系統(tǒng)[3，4]。系統(tǒng)的工作原理圖如圖1所示。

MVC模式全稱為模型-視圖-控制器模式，在線筆記與交流平臺采用MVC的設計模型，在MVC模式下系統(tǒng)各個層級之間的分工明確[5]。在MVC模式下系統(tǒng)的不同接口與功能實現(xiàn)類之間的耦合度降低，同時采用MVC模式有利于系統(tǒng)后期的更新與維護。MVC設計模式的結構如圖2所示。

1.2? 系統(tǒng)結構功能設計

系統(tǒng)的角色主要分為系統(tǒng)管理員和普通用戶。其中普通用戶在登錄平臺后，可實現(xiàn)實時的筆記編輯、查看、修改、分享以及交流，此外平臺還提供個人用戶網盤，用戶可隨時進行文件的上傳和下載。系統(tǒng)管理員主要是對系統(tǒng)的運行情況進行監(jiān)測，通過查看平臺的各項數(shù)據(jù)，實時了解平臺的運行情況，其中包括已注冊用戶量、新增筆記數(shù)量、系統(tǒng)網盤空間使用情況、筆記的分享審核、用戶舉報審核、發(fā)布系統(tǒng)公告等功能。在線筆記與交流平臺的系統(tǒng)結構圖如圖3所示。

1.3? 系統(tǒng)的工作流程

在線筆記與交流平臺的系統(tǒng)功能包括普通用戶對筆記的相關操作、平臺管理員對系統(tǒng)的相關操作，具體功能如下。

1.3.1? 權限登錄功能

系統(tǒng)設計之初考慮為系統(tǒng)用戶劃分不同權限，不同權限用戶通過登錄操作實現(xiàn)個人權限的驗證，登錄到個人所屬權限的操作界面。主要包括平臺管理員能夠登錄進入平臺的管理操作界面，普通用戶能夠登錄進入筆記記錄查看分享等相關操作的界面。

1.3.2? 個人信息管理

用戶登錄系統(tǒng)后可對自己的賬戶信息（賬戶密碼）以及個人的相關信息（個人昵稱、用戶郵箱、頭像、個人簡介等）進行管理，用于平臺內用戶信息展示，分享時的分享者信息（僅展示用戶昵稱和頭像）展示。

1.3.3? 用戶筆記的相關操作

系統(tǒng)普通用戶登錄系統(tǒng)后可進行對筆記的相關操作，其中包括用戶新增筆記、修改筆記、刪除筆記、筆記目錄管理、搜索筆記等功能。其中新增筆記首先需要新建筆記文件，輸入筆記名稱，編輯筆記內容，填寫筆記標簽（筆記標簽為選填項）；修改筆記就是對已有的筆記內容進行更新操作；筆記目錄管理就是對用戶賬號下的文件或筆記目錄進行新增、刪除、修改名稱等操作；搜索筆記即用戶可在平臺內通過關鍵詞對已公開的筆記進行搜索的操作。

1.3.4? 用戶個人云盤管理

系統(tǒng)的普通用戶登錄系統(tǒng)后可對個人云盤進行相關操作，用戶可在系統(tǒng)內進行文件的上傳和下載、文件的實時在線預覽、文件的分享等。

1.3.5? 系統(tǒng)后臺管理

平臺管理員在成功登錄系統(tǒng)后臺后，在系統(tǒng)的后臺對其模塊進行相關的管理操作，包括網站內容管理、筆記管理、用戶管理、云盤管理、系統(tǒng)消息發(fā)布等。

具體的系統(tǒng)工作流程圖如圖4所示。

2? 系統(tǒng)設計

2.1? 系統(tǒng)數(shù)據(jù)庫設計

數(shù)據(jù)庫概念模型是在系統(tǒng)設計之初進行數(shù)據(jù)庫設計時，將系統(tǒng)內的事物實體進行抽象化，形成數(shù)據(jù)庫的初始數(shù)據(jù)模型。

在線筆記與交流平臺的實體類包括系統(tǒng)用戶實體類、筆記實體類、筆記附件實體類、筆記目錄實體類、回收站實體類、系統(tǒng)日志實體類、用戶權限實體類、系統(tǒng)消息實體類、云盤目錄實體類、用戶云盤實體類、用戶黑名單實體類等，實體類屬性如下：

用戶實體類：用戶ID、手機號碼、昵稱、郵箱、性別、郵編、創(chuàng)建時間等屬性。

筆記實體類：筆記ID、筆記標題、用戶ID、目錄ID、是否公開、分享鏈接、點贊數(shù)量、創(chuàng)建時間、修改時間等屬性。

筆記附件實體類：用戶ID、附件名稱、筆記ID、附件存儲路徑、創(chuàng)建時間等屬性。

筆記目錄實體類：目錄ID、目錄名稱、用戶ID、創(chuàng)建時間等屬性。

回收站實體類：筆記ID、筆記名稱、用戶ID、回收時間等屬性。

系統(tǒng)日志實體類：用戶ID、操作內容、用戶IP、操作時間、請求方式等屬性。

用戶權限實體類：用戶ID、賬號密碼、權限類型、創(chuàng)建時間、權限ID等屬性。

系統(tǒng)消息實體類：消息ID、消息類型、消息名稱、消息內容、發(fā)送人ID、接收人ID、消息狀態(tài)、創(chuàng)建時間等屬性。

云盤目錄實體類：云盤目錄ID、用戶ID、目錄名稱、創(chuàng)建時間、修改時間等屬性。

用戶云盤實體類：文件ID、用戶ID、文件名稱、文件大小、創(chuàng)建時間等屬性。

用戶黑名單實體類：黑名單ID、用戶ID、原因、創(chuàng)建時間、截止時間等屬性。

系統(tǒng)內設計user（平臺用戶）、pan_dir（云盤目錄）、role（用戶權限）、article_recycle（筆記回收站）、article_dir（筆記目錄）、user_pan（用戶云盤）、user_blacklist（用戶黑名單）、notify（系統(tǒng)消息）、article（筆記）、article_afftix（筆記附件）、log（系統(tǒng)日志）11個實體表。

2.2? 系統(tǒng)開發(fā)工具與運行環(huán)境

前端使用Vue框架，開發(fā)工具為HBuilder；后端使用Java語言、SpringBoot框架[6-8]，開發(fā)工具為IDEA；數(shù)據(jù)庫采用MySQL，數(shù)據(jù)庫開發(fā)工具為Navicat。

系統(tǒng)環(huán)境為CentOS 7.2，Web服務器選用Tomcat，版本控制器為Git，持續(xù)化部署工具為Docker+Jenkins。

3? 系統(tǒng)功能實現(xiàn)

3.1? 登錄注冊功能實現(xiàn)

用戶進入系統(tǒng)后會首先進入登錄界面，用戶通過輸入手機號及密碼進行登錄操作，若未注冊可點擊注冊，此外系統(tǒng)提供QQ和GitHub賬號關聯(lián)登錄。

3.2? 管理員功能實現(xiàn)

管理員主界面如圖5所示。當用戶進行系統(tǒng)登錄時，系統(tǒng)對用戶的權限進行判斷，若為管理員權限則成功登錄系統(tǒng)并進入管理員主界面。

在管理員主界面的用戶統(tǒng)計中可瀏覽系統(tǒng)用戶的總注冊量、用戶的性別分布情況、日均注冊人數(shù)等信息。在文章分享量統(tǒng)計中可查看平臺內公開的筆記數(shù)量總數(shù)以及每日分享筆記的數(shù)量。在用戶登錄統(tǒng)計中能夠詳細地查看每日登錄系統(tǒng)的人數(shù)以及每個用戶每日登錄系統(tǒng)的次數(shù)。在網盤使用情況中能夠查看系統(tǒng)內網盤的剩余容量以及用戶已使用網盤容量的分布情況。以上的各種數(shù)據(jù)均能以折線圖、柱狀圖、餅狀圖以及文本的形式進行展示并可供下載。系統(tǒng)管理員界面左側導航欄的網站信息包括查看用戶詳細信息、登錄詳細信息、筆記分享詳細信息等功能；筆記管理包括筆記分享審核、筆記日志查看等功能；用戶管理包括查看系統(tǒng)用戶列表、黑名單管理、查看用戶詳細日志等功能；網盤管理包括查看系統(tǒng)網盤信息、網盤詳細日志等功能；消息管理包括推送系統(tǒng)消息、查看系統(tǒng)消息詳細日志等功能；系統(tǒng)管理包括系統(tǒng)設置、查看系統(tǒng)日志、注銷當前登錄等功能。

為了保證平臺良好的運營環(huán)境，平臺內的用戶若在平臺交流中發(fā)現(xiàn)有違規(guī)信息或違規(guī)評論均可在平臺中對違規(guī)用戶進行舉報，由管理員在登錄后查看舉報信息，核實后對用戶進行不同時限的封禁。用戶黑名單管理界面如圖6所示。

3.3? 普通用戶功能實現(xiàn)

當用戶進行系統(tǒng)登錄時，系統(tǒng)對用戶的權限進行判斷，若為普通用戶權限則成功登錄系統(tǒng)并進入筆記編輯界面，如圖7所示。用戶可以進行筆記編輯操作，包括標題填寫、筆記標簽、筆記內容編輯、筆記附件添加，查看筆記分享以及筆記導出等功能。對于已存在的筆記文件，用戶可對其進行重命名、位置移動、刪除等操作。此外，為了防止文件被誤刪，系統(tǒng)提供回收站功能，文件進入回收站后系統(tǒng)會自動保留30天。在主頁上方導航欄中搜索可對筆記進行搜索，點擊用戶名后可選擇對個人信息進行編輯，查看站內信息和公告。用戶名右側的數(shù)字標識代表用戶在交流平臺內的未讀消息數(shù)量。

在點擊用戶網盤后，用戶可進入個人網盤主界面，如圖8所示。網盤主界面內顯示網盤內的全部文件并以進度條的形式顯示用戶的網盤容量。用戶可在網盤內創(chuàng)建文件夾，上傳下載文件，搜索文件，并且支持在線查看文件以及刪除文件。

4? 結? 論

本文提出一種在線筆記與交流平臺的解決方案，通過權限的劃分將整個平臺的使用者劃分為平臺管理員和普通使用者兩類，不同權限用戶通過登錄所屬賬號進入所屬使用界面。在普通用戶方面，在用戶主頁新增目錄或筆記并進行內容上的編輯，用戶可隨時在個人網盤內進行文件的上傳和下載，選擇將筆記進行公開，參與筆記的討論以及站內的私信聊天。在系統(tǒng)管理方面，系統(tǒng)通過對日常用戶操作信息的收集，在平臺管理員界面以圖表的形式進行數(shù)據(jù)可視化顯示。在對用戶的管理上，設置了用戶封禁功能、舉報審核功能等保證系統(tǒng)的正常運營。在線筆記與交流平臺能夠很好地取代傳統(tǒng)的筆記記錄方式，極大地簡化了筆記記錄的流程，提供一個可隨時進行交流的平臺，能夠在一定程度上提升工作效率。

參考文獻：

[1] 劉波.基于私有云的在線學習交流平臺的設計與實現(xiàn) [J].電子產品世界，2023，30（2）：70-75.

[2] 林榮杭，劉小英.基于Flutter的云筆記系統(tǒng) [J].信息技術與信息化，2021（10）：41-43+46.

[3] 張?zhí)K穎.基于云存儲的校園教學資源在線交流平臺設計 [J].信息與電腦：理論版，2022，34（11）：125-127.

[4] 賀竑睿，周兵，林宏.基于C++跨平臺的云筆記設計與實現(xiàn) [J].無線互聯(lián)科技，2022，19（16）：109-111.

[5] 韋雪文.基于Spring Boot+Vue的爐況評價系統(tǒng)的設計與實現(xiàn) [J].電腦知識與技術，2022，18（35）：43-45+49.

[6] 辜萍萍，鄭宇輝.基于Spring Boot+Vue技術的漂書隊管理信息系統(tǒng)開發(fā) [J].數(shù)字技術與應用，2023，41（1）：165-167.

[7] GU R J. A Lightweight Experimental Platform for Big Data Based on Docker Containers [EB/OL].[2023-02-12].https：//www.researchgate.net/publication/338424161_A_Lightweight_Experimental_Platform_for_Big_Data_Based_on_Docker_Containers.

[8] UPADHYAYA B，Mcgill M M. Dynamic Data Visualization for CSEdResearch.org using Tableau and MySQL [EB/OL].[2023-02-15].https：//dl.acm.org/doi/abs/10.1145/3328778.3372710.

作者簡介：鹿德源（1998—），男，漢族，河南信陽人，碩士研究生在讀，主要研究方向：計算機視覺、深度學習；楊蕾（1979—），女，回族，河南洛陽人，教授，博士，主要研究方向：圖像處理、計算機視覺；王浩震（1997—），男，漢族，河南鶴壁人，碩士研究生在讀，主要研究方向：計算機視覺、深度學習。