基于JavaWeb的無紙化實驗系統的設計與實現

陳玲玲 付可 張博聞

摘? 要：隨著高校教育信息化系統建設的日益完善以及互聯網技術的快速發展，教育行業的技術手段和載體發生了革命性的變化。該設計利用Web、Java、以及SQL等技術設計一個無紙化實驗報告系統。該系統包括學生端和教師端，學生端是指學生對實驗指導書的閱讀和實驗報告的填寫，教師端是指教師對學生實驗報告的審批。該系統可以解決收發麻煩、不易保存、批改審閱費時費力和實驗報告篇幅限制等問題。

關鍵詞：無紙化;Web;Java;MySQL

中圖分類號：TP311? ? ? ? ? ? ? ? ? 文獻標識碼：A文章編號：2096-4706（2021）19-0040-04

Design and Implementation of Paperless Experiment System Based on JavaWeb

CHEN Lingling， FU Ke， ZHANG Bowen

（School of Information and Control Engineering， Jilin Institute of Chemical Technology， Jilin? 132022， China）

Abstract： With the increasing improvement of the construction of educational informatization system in Colleges and universities and the rapid development of internet technology， the technical means and carrier of education industry have undergone revolutionary changes. This design uses Web， Java， SQL and other technologies to design a paperless experimental report system. The system includes student side and teacher side. The student side is for students to read experimental instructions and fill in experimental reports， and the teacher side is for teachers to approve students experimental reports. This system can solve the problems of trouble in sending and receiving， difficult to save， time-consuming and laborious correction and review， and length limitation of experimental report and so on.

Keywords： paperless; Web; Java; MySQL

0? 引? 言

當下是一個網絡信息時代，傳統的實驗指導書與實驗報告冊與電子文檔相比會顯得格外的笨重與煩瑣[1]，而且老師對實驗報告冊的收發以及學生對相關實驗內容的撰寫也會面臨著諸多的問題，例如：實驗報告冊收發麻煩、不易保存、老師對實驗報告冊的審閱批改費時費力;而且實驗報告冊的篇幅有限，可能會影響到學生對相關實驗圖形的繪畫，進而會影響到相關實驗結論的準確性[2];同時學生的字跡很大程度上會影響到自己的實驗成績，這就有些違背實驗課程的目的[3-7]。

在這個全球都受疫情影響的特殊時期，我國各大高校均采取線上授課的方式，采用這種方式可以保證正常的教學進度以及師生的健康。但是該種授課方式也存在一定的弊端，例如：與課程相關的實驗做不了;學生對相關內容的理解與線下授課相比也會大打折扣;將違背工科教學理論與實際相結合的理念?，F階段，如何研發出一種既可以保證師生安全又可以保證教學質量的教學方式成為一大難題。

1? 系統功能需求分析

本文將上述的難點考慮在內設計了一個無紙化實驗報告系統。通過該系統學生可以克服字跡以及紙張篇幅帶來的影響，老師可以通過電腦進行在線審閱和批改，而且數據化的實驗報告儲存與查閱也更加方便。該系統不但可以最大化的保證教學質量和師生安全，而且還可以在保證實驗報告篇幅不受限的同時大大的節省成本。該系統由登錄、學生管理、教師審批管理、學生提交管理、教師打回管理五個模塊組成。

1.1? 登錄模塊

本系統中的登錄模塊是學生和教師登錄系統的合并。

1.2? 學生實驗報告管理此模塊

包含了教師的審閱功能和學生實驗報告的填寫功能。對于學生來說，首先學生需要通過驗證賬戶和密碼，然后對實驗指導書進行閱讀。閱讀完成之后進行實驗，最后進行實驗報告的撰寫。因此學生對數據庫的訪問權限有兩個：實驗指導書和實驗報告。但其只擁有一個寫入權限即對實驗報告所對應的數據庫的撰寫。

1.3? 教師審批管理模塊

此模塊主要是實現的是教師審閱功能。教師需要首先需要登錄系統，通過班級、實驗和學號選擇某個同學的實驗報告進行審批。教師有對學生的實驗報告冊有審批的權限，審批的權限并不是更改實驗報告冊，而是用學號和實驗代碼在一個新的數據庫進行存儲，而且教師有將學生的實驗報告打回的權限。

1.4? 提交管理模塊

此模塊是在學生實驗報告管理模塊和教師審批管理模塊的基礎之上實現的，將已經填寫好的數據存入數據庫中進行保存時本模塊的執行過程。

1.5? 實驗報告打回管理

在學生填寫完實驗報告后，老師審批不合格的報告被將會執行本模塊。本模塊設計了一個打回按鈕，當教師審閱時發現嚴重的問題后，點擊此按鈕可以將此份實驗報告打回對應學號的學生讓其進行重新填寫。普通紙質版的實驗報告很難重新填寫，打回后可以通過學生端進行重新填寫后再次進行審批。這也是本系統的亮點之一。

通過這五個模塊之間的相互作用可以完成上述的全部功能。本系統中的登錄模塊事實上是兩個系統的合并，其中有兩個數據庫支持登錄功能，在登錄頁面中有學生登錄和教師登錄的選項，分別由兩個獨立系統的支持。功能需求的總體流程如圖1所示。

2? 具體實現

2.1? 登錄頁面

登錄界面是所有用戶的登錄該系統的唯一入口。在用戶名輸入框和密碼輸入框下方有個單選框，其不但是所有用戶登錄該系統的系統模塊，而且還是決定用戶名和密碼驗證的數據庫。該界面是所有用戶的登入系統的唯一入口。所有用戶登錄時，系統的前端模塊會運用簡單的EL表達式進行賬戶和密碼的認證以及篩選。由于學生的學號和教師的教職工號均是由數字組成，因此如果輸入的數據是非純數字組合，例如：‘a123.123/43等，這樣會導致前端代碼中EL的表達式不成立，因此無須再通過后臺代碼和數據庫進行驗證。這樣做的目的是為了提高程序的執行效率。如果用戶選擇學生端進行登陸時，輸入的賬戶和密碼需要與要事先建立表中的student數據表進行驗證。如果驗證失敗會有彈窗提示用戶名或密碼錯誤，用戶剛剛輸入的用戶名和密碼將會被清空。如果沒有出現上述情況則證明驗證成功，驗證成功后跳轉到相應的頁面。

2.2? 無紙化實驗報告系統學生端-主頁面

無紙化實驗報告系統學生端的功能的設計不但是本文的研究重點，同時也是本文最大的亮點。在本次設計過程中碰到的最大難點是如何實現實驗報告中的圖形、圖表和圖像的繪制以及保存。在本模塊的編寫中將應用大量的前端技術以及較大的數據庫設計，在此基礎上可以為圖形、圖表和圖像的繪制、展示和保存提供足夠的支持。而且為本模塊提供數據保存的數據庫在設計上要遵循精度高且容量大的原則，這樣可以讓學生在填寫實驗報告時盡可能避免甚至杜絕實驗報告篇幅不足的問題。同時也要對頁面的排版進行合理的設計，要使頁面看起來更加的簡潔和合理，以此來方便后臺代碼的書寫、數據的分類儲存和教師的審閱。切記一定要將數據進行合理的分類和儲存，這樣不但可以節省登錄驗證的時間，還可以方便所有用戶對相關資料的查詢。圖2展示的是無紙化實驗報告系統學生端界面。

2.3? 無紙化實驗報告系統學生端-實驗指導書

在設計無紙化實驗報告系統實驗指導書頁面時，通過對div塊元素進行合理的嵌套，以及相應屬性的設定，可使得無紙化試驗系統頁面看起來大方簡，如圖3所示。通過將紙質版實驗指導書原版移植到網頁上，在此基礎上可使實驗指導書的費用大大降低。在節省大量紙張的同時，還使得實驗指導書看起來更加直觀。通過鼠標點擊右側滑塊進行上下拖動實現瀏覽，這樣省去了紙質版實驗指導書的翻頁過程。而且頁面支持自定義位置，在做實驗期間都會遇到相關實驗的參考資料跨頁的問題，在做實驗時需要反復地翻看，本設計的自定義位置可以很好地解決這個問題，用戶可以根據自己的需求自定義不同的頁面。實驗指導書中包含大量的專業圖像，如何把這些圖片完美的頁面中體現出來時另一個難點。本系統中采用圖片的方式進行相應的顯示。首先將實驗指導書的圖形進行重新繪制，然后以.png格式代替傳統的.jpg格式插入頁面中。這樣使得圖形的顯示符合整體系統的主題色調，而且系統看起來也更加美觀。本系統為符合實驗報告的設計需求，特別引入了Mathjax即Web數學公式渲染器，以此支持頁面公式的顯示和制作。

2.4? 教師端-主頁面

如圖4所示，進入的是教師端的頁面，進入該頁面之前也需要用戶通過登錄模塊選擇教師登錄后進行賬號密碼驗證。教師端的主頁面結構與學生端主頁面結構相似，左側是抽屜式導航欄、右側是實驗室對老師和學生的相關規定。教師端與學生端不同之處是左側的抽屜式導航欄的分類方法不同。本設計考慮到一位教師將會帶相同專業的多個班級，所以首先我們需要對相同的專業進行班級的分類。本次設計針對的是電子信息工程專業的兩個班級。

2.5? 教師端-學生列表

在進行班級分類之后，由于學校的實驗課程會緊跟著課程的進度一個一個地進行，所以需要對實驗再次劃分，對實驗課程進行劃分之后可以很大程度上節省老師查閱資料的時間。學生列表中包含實驗編號、學生學號、預習報告分數、實驗分數和狀態這五個部分。在學生列表中默認以學生學號升序排列。實驗編號支持最高支持九位數字的自定義設置，前四代表年份、接下來兩位月份、后兩位代表日期、最后一位代表上午下午，上午用‘0下午用‘1表示。此種表示方法有效的記錄了實驗日期。狀態欄中有三種狀態分別為：已審批、未審批和未提交，并給不同的狀態設計了不同的顏色進行區分。學號所在的行表示的是該與學號對應學生的實驗情況。學生的學號在前端代碼中運用了標簽進行編寫，教師點擊學號可以通過超鏈接跳轉到該學號學生的實驗報告審批頁面。

2.6? 教師端-審批

教師通過點擊觸發學號附帶的超鏈接進入如圖5所示的頁面，界面中包含有打回按鈕和相關實驗分數輸入文本框。教師通過審閱學生端由學生提交的實驗報告冊，給予評定分數。如果實驗不合格教師可通過點擊打回按鈕，其將會觸發打回系統，將該學生的實驗報告冊進行打回重新填寫。本頁面同樣運用了chart圖表庫以及Mathjax數學公式渲染器進行實驗報告顯示支持。

3? 結? 論

無紙化實驗報告系統解決了虛擬實驗報告系統在使用中需要更換大量高成本實驗設備的弊端。在現有的實驗設備的基礎之上，實現了實驗報告以及實驗指導書的無紙化，將紙質版實驗指導書和實驗報告冊運用前端技術、Java和關系型數據庫等等互聯網技術實現無紙化。由于計算機和電信相關專業的實驗課程的特殊性，很多實驗都是運用電腦軟件進行實驗，如matlab等仿真軟件。這些軟件大多數對硬件設備的要求不是很高，一般的筆記本電腦都可以完美運行。所以應用這些軟件進行實驗的實驗課程結合無紙化實驗報告系統可以跟隨教學進度進行相應的實驗。這樣可以在保證師生安全的前提下最大化地保證了教學質量。

參考文獻：

[1] 羅彪，張宏濤.基于HTML5的移動互聯網應用發展趨勢 [J].信息與電腦（理論版），2018（10）：129-131.

[2] 丁莉，楊陽.網絡數據庫SQL Server 2012教程 [M].北京：人民郵電出版社，2015.

[3] 顧全.“JQuery+CSS3”技術在網頁交互式圖表中的運用與實現 [J].數字技術與應用，2016（11）：253-254.

[4] 姚云飛，杜洪波，梁建輝.基于SpringMVC框架畢業設計管理系統設計 [J].軟件，2018，39（1）：91-93.

[5] 徐亮亮.企業辦公自動化系統的設計與實現 [J].電子技術與軟件工程，2018（9）：125.

[6] 黃淼，張國平.基于Spring MVC的高校教務評教系統設計 [J].電子設計工程，2016，24（8）：23-26.

[7] 陳梅，蘇晨，高斐.HTML5在Web界面設計中的應用 [J].電腦知識與技術，2018，14（5）：214-215+217.

作者簡介：陳玲玲（1980—），女，漢族，吉林長春人，教授，博士，研究方向：認知無線電。