基于MEVN 技術(shù)棧的計算機等級考試系統(tǒng)設(shè)計與實現(xiàn)

摘要：隨著計算機技術(shù)的不斷發(fā)展，傳統(tǒng)的計算機等級考試系統(tǒng)面臨著安全性、靈活性和用戶體驗等方面的挑戰(zhàn)。為解決這些問題，文章基于MEVN（MongoDB、Express、Vue.js、Node.js） 技術(shù)棧，構(gòu)建一個現(xiàn)代化的Web考試系統(tǒng)。通過MEVN技術(shù)棧的各個組成部分，完成系統(tǒng)的需求與功能設(shè)計，數(shù)據(jù)庫設(shè)計使用MongoDB，后端采用Node.js和Express.js，前端使用Vue.js進(jìn)行開發(fā)。系統(tǒng)實踐階段包括開發(fā)環(huán)境的搭建、數(shù)據(jù)庫的建立與管理、后端服務(wù)的實現(xiàn)以及前端界面的設(shè)計與實現(xiàn)。系統(tǒng)整體經(jīng)過測試與調(diào)優(yōu)，其性能和用戶體驗達(dá)到最佳水平。在系統(tǒng)的實際應(yīng)用中，對其性能、用戶體驗以及與傳統(tǒng)系統(tǒng)的對比情況，基于MEVN技術(shù)棧的計算機等級考試系統(tǒng)在安全性、靈活性和用戶體驗方面均取得了顯著的改進(jìn)。

關(guān)鍵詞：計算機等級考試；MEVN 架構(gòu)；Web 應(yīng)用系統(tǒng)

中圖分類號：TP311 文獻(xiàn)標(biāo)識碼：A

文章編號：1009-3044（2024）17-0062-03 開放科學(xué)（資源服務(wù)）標(biāo)識碼（OSID） ：

0 引言

隨著計算機技術(shù)的飛速發(fā)展，計算機等級考試成為評估個體計算機技能水平的重要方式，傳統(tǒng)的考試系統(tǒng)面臨著一系列問題，如安全性、靈活性和用戶體驗等方面的挑戰(zhàn)。本研究旨在通過應(yīng)用MEVN技術(shù)棧構(gòu)建一種現(xiàn)代化的計算機等級考試系統(tǒng)，以解決傳統(tǒng)系統(tǒng)的安裝部署復(fù)雜，靈活性欠佳等問題[1]。本文將介紹系統(tǒng)的設(shè)計與實踐，并評估其性能和用戶體驗，從而為計算機等級考試系統(tǒng)的未來發(fā)展提供有益的經(jīng)驗和啟示。

1 計算機等級考試系統(tǒng)的現(xiàn)狀與設(shè)計思路

1.1 計算機等級考試系統(tǒng)的發(fā)展現(xiàn)狀

計算機等級考試系統(tǒng)的發(fā)展經(jīng)歷了從傳統(tǒng)紙質(zhì)考試到現(xiàn)代化計算機化考試的演變。早期的計算機等級考試主要依賴于紙質(zhì)試卷和離線評估，受限于時間和空間的局限性。隨著計算機技術(shù)的普及，計算機等級考試系統(tǒng)逐漸轉(zhuǎn)向了計算機化考試，允許考生在線完成考試，并通過計算機實時評估和反饋成績。這一轉(zhuǎn)變使得考試更加靈活、高效，并為考生提供了更加公正的評價機制。傳統(tǒng)的C/S架構(gòu)設(shè)計[2]的計算機等級考試系統(tǒng)仍然存在一些問題，如安裝部署復(fù)雜、對操作系統(tǒng)平臺和第三方數(shù)據(jù)庫軟件版本要求嚴(yán)格，整體構(gòu)建使用度低、試題靈活性以及用戶體驗方面的不足。這些問題催生了對于新型考試系統(tǒng)的需求，引領(lǐng)了基于現(xiàn)代技術(shù)棧構(gòu)建計算機等級考試系統(tǒng)的研究和實踐。

1.2 MEVN 技術(shù)棧的概述與應(yīng)用領(lǐng)域

MEVN 技術(shù)棧是一組包括MongoDB、Express.js、Vue.js和Node.js的現(xiàn)代化Web開發(fā)技術(shù)，被廣泛應(yīng)用于構(gòu)建高性能、可擴展的Web應(yīng)用程序。這一技術(shù)棧的獨特之處在于它的全棧性質(zhì)，涵蓋了前后端開發(fā)的所有環(huán)節(jié)，從數(shù)據(jù)庫到服務(wù)器再到用戶界面的實現(xiàn)。

MongoDB： 作為MEVN技術(shù)棧的首個成員，Mon?goDB是一款NoSQL數(shù)據(jù)庫，以其靈活的數(shù)據(jù)模型和橫向可擴展性而聞名。在計算機等級考試系統(tǒng)中，MongoDB的使用可以提供高效的數(shù)據(jù)存儲和管理，適應(yīng)考試系統(tǒng)動態(tài)變化的數(shù)據(jù)需求。

Express.js： Express.js是一款基于Node.js的Web 應(yīng)用框架，提供了簡單而靈活的方式來構(gòu)建Web服務(wù)器。在計算機等級考試系統(tǒng)中，Express.js可以用于處理后端業(yè)務(wù)邏輯，實現(xiàn)安全的數(shù)據(jù)傳輸和服務(wù)器端的應(yīng)用邏輯，如圖1所示。

Vue.js： Vue.js是一款流行的JavaScript前端框架，專注于構(gòu)建用戶界面。其簡潔的API和響應(yīng)式數(shù)據(jù)綁定使得前端開發(fā)更加便捷。在考試系統(tǒng)中，Vue.js 的運用有助于實現(xiàn)直觀、友好的用戶界面，提升用戶體驗。

Node.js： 作為MEVN技術(shù)棧的最后一環(huán)，Node.js 是一個基于Chrome V8引擎的JavaScript運行環(huán)境，適用于構(gòu)建高度可伸縮的網(wǎng)絡(luò)應(yīng)用。在計算機等級考試系統(tǒng)中，Node.js可用于搭建高性能的服務(wù)器，支持系統(tǒng)的快速響應(yīng)和并發(fā)處理。

MEVN技術(shù)棧以其全面性和協(xié)同工作的優(yōu)勢，在構(gòu)建計算機等級考試系統(tǒng)方面展現(xiàn)了強大的應(yīng)用潛力。本文將深入探討如何將這一技術(shù)棧應(yīng)用于實際系統(tǒng)設(shè)計與實踐中。

2 系統(tǒng)設(shè)計

2.1 系統(tǒng)需求與功能設(shè)計

計算機等級考試系統(tǒng)主要包括前端頁面、后端服務(wù)和數(shù)據(jù)庫三個部分[3]。前端頁面通過Vue.js實現(xiàn)，提供用戶界面和交互功能；后端服務(wù)通過Express.js 和Node.js實現(xiàn)，處理用戶請求和數(shù)據(jù)傳輸，數(shù)據(jù)庫采用MongoDB存儲用戶信息和考試數(shù)據(jù)。關(guān)鍵的需求和功能包括，如圖2所示。

用戶管理：能夠注冊、登錄和管理用戶信息，確保安全的身份驗證和授權(quán)機制。

題庫管理：管理考試題目，包括增加、修改、刪除題目，以及分類和標(biāo)簽功能[4]。

考試管理：提供靈活的考試安排功能，包括考試時間、地點、考試科目等。

成績管理：提供考試成績查詢和解析，考生答題文件瀏覽和回溯等功能[5]。

監(jiān)控管理：開考后，系統(tǒng)能夠?qū)崟r監(jiān)控考生的答題情況，包括考試中斷后的二次登錄，重新選題生成試卷等。

安全管理：實現(xiàn)數(shù)據(jù)的安全存儲、傳輸和備份處理，防范可能的安全威脅。

2.2 系統(tǒng)數(shù)據(jù)庫設(shè)計

MongoDB作為NoSQL數(shù)據(jù)庫，其文檔型數(shù)據(jù)庫模型使得在系統(tǒng)中存儲和管理數(shù)據(jù)變得更加靈活，數(shù)據(jù)庫設(shè)計包括：

用戶集合： 存儲管理員信息、用戶信息，包括用戶名、密碼（加密存儲）、個人信息等。

題目集合： 包含考試題目的信息，如題目內(nèi)容、答案、難度等。

考試排期集合：包括考試計劃、考場和考場信息、監(jiān)考員信息、各個考場考生數(shù)量等。

考試記錄集合：記錄每次考試的詳細(xì)信息，包括考生登錄次數(shù)、考試時間等。

成績集合：包含考試成績詳細(xì)信息、得分明細(xì)、考生答題信息等。

安全維護(hù)集合：包含安全管理信息，如限制頻繁登錄次數(shù)、數(shù)據(jù)定期備份計劃等。

2.3 系統(tǒng)后端設(shè)計

后端設(shè)計采用Node.js和Express.js協(xié)同工作，處理HTTPS 請求、業(yè)務(wù)邏輯和數(shù)據(jù)庫交互，后端設(shè)計包括：

路由管理：使用Express.js的路由功能，定義不同HTTPS請求的處理邏輯，如用戶注冊、登錄、獲取題目等。

控制管理：使用Node.js完成各業(yè)務(wù)邏輯功能，如考試安排處理、成績分析處理、試卷生成等。

中間件：實現(xiàn)身份驗證、數(shù)據(jù)校驗、日志記錄等中間件，確保系統(tǒng)的穩(wěn)定性和安全性。

數(shù)據(jù)庫連接：利用Node.js 的MongoDB 驅(qū)動，與MongoDB建立連接，進(jìn)行數(shù)據(jù)的讀寫操作。

2.4 系統(tǒng)前端設(shè)計

在前端設(shè)計中，Vue.js負(fù)責(zé)構(gòu)建用戶界面，使用戶能夠方便地與系統(tǒng)交互。前端設(shè)計包括：

組件設(shè)計：利用Vue.js的組件化特性，構(gòu)建可復(fù)用的UI組件，如題目展示、考試界面等。

狀態(tài)管理：使用Vue.js的狀態(tài)管理機制，實現(xiàn)前端狀態(tài)的管理，確保用戶交互的實時性。

用戶交互：利用Vue.js的指令和事件處理機制，實現(xiàn)用戶界面的交互功能，如點擊、輸入等。

3 系統(tǒng)實踐

3.1 開發(fā)環(huán)境的搭建

搭建MEVN技術(shù)棧開發(fā)的環(huán)境，安裝好以下工具和組件：

Node.js 和npm：安裝Node.js 作為后端運行時環(huán)境，并隨之安裝npm用于包管理。

MongoDB：安裝MongoDB數(shù)據(jù)庫，確保能夠通過命令行或圖形用戶界面進(jìn)行數(shù)據(jù)庫的基本操作。

Vue CLI：安裝Vue CLI 用于創(chuàng)建和管理Vue.js 項目。

代碼編輯器：選擇Visual Studio Code 用于編寫、調(diào)試前端和后端代碼。

3.2 數(shù)據(jù)庫的建立與管理

使用MongoDB 創(chuàng)建數(shù)據(jù)庫，并設(shè)計合適的集合（表）來存儲用戶信息、題目數(shù)據(jù)、考試記錄等。確保數(shù)據(jù)庫的連接配置正確，以便后端服務(wù)可以與數(shù)據(jù)庫進(jìn)行交互?？紤]數(shù)據(jù)庫的索引、數(shù)據(jù)備份和安全性等方面，進(jìn)行必要的管理工作[6]。

// MongoDB連接配置

const mongoose = require（′mongoose′）;

mongoose. connect（′mongodb：//localhost： 27017/ex?amSystem′， { useNewUrlParser： true， useUnifiedTopol?ogy： true }）;

3.3 后端服務(wù)的實現(xiàn)

使用Node.js和Express.js創(chuàng)建后端服務(wù)，實現(xiàn)系統(tǒng)的業(yè)務(wù)邏輯、路由管理和中間件?？紤]用戶身份驗證、數(shù)據(jù)校驗、異常處理等關(guān)鍵功能。建立RESTfulAPI，通過Mongoose庫連接MongoDB數(shù)據(jù)庫，使前端能夠與后端進(jìn)行有效的數(shù)據(jù)交互。

// Express.js路由和中間件

const express = require（′express′）;

const router = express.Router（）;

// 用戶注冊

router.post（′/register′， UserController.register）;

// 獲取題目列表

router.get（′/questions′， QuestionController.getQues?tions）;

// 示例：身份驗證中間件

const authenticate = （req， res， next） => {

// 在此進(jìn)行用戶身份驗證邏輯

next（）;

};

// 應(yīng)用身份驗證中間件

router.use（authenticate）;

3.4 前端界面的設(shè)計與實現(xiàn)

前端頁面采用Vue.js框架搭建，使用Vue Router 進(jìn)行路由管理，Vuex 進(jìn)行狀態(tài)管理， axios 庫進(jìn)行HTTPS請求。頁面設(shè)計保持簡潔清晰，包括登錄頁面、注冊頁面、考試科目選擇頁面、考試頁面、成績查詢頁面等。

<！-- Vue.js組件 -->

<template>

<div>

<QuestionList ：questions="questions" />

<ExamForm @submit="submitExam" />

</div>

</template>

<script>

import QuestionList from ′./QuestionList.vue′;

import ExamForm from ′./ExamForm.vue′;

export default {

data（） {

return {

questions： []，

};

}，

methods： {

submitExam（answers） {

// 處理考試提交邏輯

}，

}，

};

</script>

3.5 系統(tǒng)整體的測試與調(diào)優(yōu)

在系統(tǒng)實踐的最后階段，進(jìn)行系統(tǒng)整體的測試和性能調(diào)優(yōu)。

單元測試： 針對后端服務(wù)和前端組件編寫單元測試，確保每個部分的功能正常運行。

集成測試： 測試系統(tǒng)的不同部分之間的集成，保證它們能夠協(xié)同工作。

性能測試： 使用工具對系統(tǒng)進(jìn)行性能測試，發(fā)現(xiàn)潛在的瓶頸和性能問題，進(jìn)行必要的優(yōu)化。

用戶體驗測試： 邀請用戶參與測試，收集反饋，優(yōu)化前端界面和用戶交互。

系統(tǒng)測試完成后，根據(jù)測試結(jié)果進(jìn)行調(diào)優(yōu)，改進(jìn)系統(tǒng)的性能、安全性和用戶體驗。

4 結(jié)束語

本文通過基于MEVN技術(shù)棧的計算機等級考試系統(tǒng)設(shè)計并實踐，搭建了開發(fā)環(huán)境，建立了數(shù)據(jù)庫，實現(xiàn)了后端服務(wù)和前端界面，驗證了MEVN技術(shù)棧在計算機等級考試系統(tǒng)中的可行性和優(yōu)越性。MEVN技術(shù)棧為計算機等級考試系統(tǒng)的現(xiàn)代化提供了一種全面而強大的解決方案，推動計算機等級考試系統(tǒng)向更加先進(jìn)、安全、靈活的方向發(fā)展。

參考文獻(xiàn)：

[1] 謝雪嬌，唐慧，陳洞天.基于MEVN軟件架構(gòu)的健康調(diào)查問卷系統(tǒng)開發(fā)實踐[J].中國衛(wèi)生信息管理雜，2020，17（5）：661-665.

[2] 洪波.計算機等級考試管理系統(tǒng)的開發(fā)與應(yīng)用分析[J].中國新通信，2021，23（11）：116-117.

[3] 陳志華，趙霞，韓佳佳，等.全國計算機等級考試訓(xùn)練平臺的建設(shè)與開發(fā)[J].甘肅科技，2019，35（5）：12-14.

[4] 高敏.基于Python的計算機等級考試查詢系統(tǒng)[J].中國新通信，2021，23（3）：113-114.

[5] 孫蕾.基于.net的計算機等級考試輔助學(xué)習(xí)系統(tǒng)設(shè)計研究[J].計算機產(chǎn)品與流通，2017（11）：217.

[6] 涂小琴，高毅.基于Android的題庫系統(tǒng)設(shè)計與實現(xiàn)：以計算機MS Office二級考試為例[J].軟件導(dǎo)刊，2018，17（4）：101-103.

【通聯(lián)編輯：朱寶貴】

基金項目：廣西高校中青年教師科研基礎(chǔ)能力提升項目（2024KY2034）