基于WampServer的學(xué)生網(wǎng)上選課系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

摘 要： 學(xué)生在線選課系統(tǒng)對(duì)于學(xué)校的決策者和管理者來說是至關(guān)重要的。針對(duì)選課系統(tǒng)的特點(diǎn)及其應(yīng)用需求，采用基于WampServer的集成開發(fā)環(huán)境，開發(fā)出一套集數(shù)據(jù)查詢、數(shù)據(jù)交換和數(shù)據(jù)維護(hù)等功能的網(wǎng)上模擬選課系統(tǒng)。

關(guān)鍵詞： B/S結(jié)構(gòu)； 選課系統(tǒng)； PHP技術(shù)； 動(dòng)態(tài)web應(yīng)用； WampServer

中圖分類號(hào)：TP319 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2017）07-93-05

Design and implementation of student online course selection system based on WampServer

Li Lei

（Zhejiang Changzheng Vocational and Technical College， Department of Computer and Information Technology， Hangzhou， Zhejiang 310023， China）

Abstract： Student online course selection system is critical for school decision makers and managers. In view of the characteristics and application requirements of the course selection system， an online simulation course selection system based on WampServer is developed， which includes the functions of data inquiry， data exchange and data maintenance.

Key words： B/S structure； course selection system； PHP technology； dynamic web application； WampServer

0 引言

分布式辦公和移動(dòng)辦公越來越普及，學(xué)生選課系統(tǒng)的網(wǎng)絡(luò)化、信息化、人性化及科學(xué)化已經(jīng)普及到各個(gè)高校的教務(wù)教學(xué)管理模式里。WampServer是一款集Apach服務(wù)器、PHP解釋器和MySQL數(shù)據(jù)庫的整合軟件包，這款集成環(huán)境軟件非常適合初學(xué)者使用。本文對(duì)使用AMP（Apache+MySQL+PHP）架構(gòu)出的基于wampServer的學(xué)生網(wǎng)上選課模擬系統(tǒng)進(jìn)行設(shè)計(jì)和實(shí)現(xiàn)。

1 PHP的運(yùn)行機(jī)制及原理

1.1 PHP的核心架構(gòu)

系統(tǒng)采用windows7作為開發(fā)平臺(tái)，WampServer服務(wù)器是Apache作為Web服務(wù)器，MYSQL作為后臺(tái)數(shù)據(jù)庫，用PHP這種開源腳本語言實(shí)現(xiàn)后臺(tái)數(shù)據(jù)庫與服務(wù)器的連接。PHP總共有三個(gè)模塊：內(nèi)核、Zend引擎、擴(kuò)展層。其核心架構(gòu)圖1所示。

[Application

（apache， thttpd， cli， etc.）][SAPI

（see Chap 23）][

][PHP API

（streams， output， etc.）

（see Chap 22）][PHP＼&][Extensions

（mysql， standard library， etc.）

（see Chap 22）][Zend Extension API

（see Chap 23）][Zend API＼&][Zend Engine＼&] [Modular Code]

圖1 PHP四層核心架構(gòu)

從圖1可以看出PHP從下到上是一個(gè)4層體系：Zend引擎、Extensions、Sapi、上層應(yīng)用。其中Zend引擎是PHP的核心；一些內(nèi)置函數(shù)、標(biāo)準(zhǔn)庫等都是通過extension來實(shí)現(xiàn)的；Sapi是服務(wù)端應(yīng)用編程接口，它可以通過一系列鉤子函數(shù)，使PHP可以和外圍交互數(shù)據(jù)；上層應(yīng)用就是編寫的PHP程序。其實(shí)PHP的4層體系可以形象的理解為PHP是一輛車，那么車的框架就是PHP本身，Zend是車的引擎（發(fā)動(dòng)機(jī)），Ext下面的各種組件就是車的輪子，Sapi可以看做是公路，車可以跑在不同類型的公路上，而一次PHP程序的執(zhí)行就是汽車跑在公路上。因此，我們需要：性能優(yōu)異的引擎+合適的車輪+正確的跑道。

1.2 PHP的執(zhí)行流程

PHP實(shí)現(xiàn)了一個(gè)典型的動(dòng)態(tài)語言執(zhí)行過程：一段代碼先經(jīng)過詞法解析、語法解析等階段后，源程序會(huì)被翻譯成一個(gè)個(gè)指令（opcodes），然后ZEND虛擬機(jī)順次執(zhí)行這些指令完成操作。PHP本身是用C實(shí)現(xiàn)的，因此最終調(diào)用的也都是C的函數(shù)，實(shí)際上，PHP可看做是一個(gè)C開發(fā)的軟件，其執(zhí)行流程如圖2所示。

PHP的執(zhí)行的核心是翻譯出來的一條一條指令，也即Opcode。Opcode是PHP程序執(zhí)行的最基本單位。一個(gè)opcode由兩個(gè)參數(shù)（op1，op2）、返回值和處理函數(shù)組成。PHP程序最終被翻譯為一組opcode處理函數(shù)的順序執(zhí)行。

2 學(xué)生網(wǎng)上選課系統(tǒng)架構(gòu)

“學(xué)生網(wǎng)上選課系統(tǒng)”是建立在B/S結(jié)構(gòu)的動(dòng)態(tài)Web應(yīng)用。其功能從用戶角度分兩個(gè)層面。

⑴ 學(xué)生：通過客戶端瀏覽器登錄到系統(tǒng)，瀏覽課程、查詢課程和查看課程的詳細(xì)信息，并按志愿順序預(yù)選自己想要選修的課程，也可顯示自己已經(jīng)預(yù)選的課程。

⑵ 教學(xué)秘書：通過客戶端瀏覽器登錄到系統(tǒng)，對(duì)課程進(jìn)行管理（添加課程、修改課程、刪除課程、查詢課程）、瀏覽課程和查看課程的詳細(xì)信息等[2]。除此之外，還需按照學(xué)校的規(guī)模和條件，以及學(xué)生集中選課的時(shí)間，選定服務(wù)器、相應(yīng)的軟硬件和網(wǎng)絡(luò)設(shè)施。

本系統(tǒng)是建立在教務(wù)部門對(duì)系統(tǒng)的描述和需求上的開發(fā)，針對(duì)系統(tǒng)的需求功能描述，學(xué)生/教師必須經(jīng)過登錄才能使用系統(tǒng)，其系統(tǒng)功能模塊圖如圖3所示。

3 學(xué)生網(wǎng)上選課系統(tǒng)功能設(shè)計(jì)

3.1 數(shù)據(jù)庫設(shè)計(jì)

數(shù)據(jù)庫是按數(shù)據(jù)結(jié)構(gòu)來組織、存儲(chǔ)和管理數(shù)據(jù)的倉庫。對(duì)于一個(gè)給定的應(yīng)用環(huán)境，構(gòu)造最優(yōu)的數(shù)據(jù)庫模式，建立數(shù)據(jù)庫及其應(yīng)用系統(tǒng)，使之能夠有效地存儲(chǔ)數(shù)據(jù)，滿足各種用戶的應(yīng)用需求（信息要求和處理要求）。在分層DFD中，數(shù)據(jù)存儲(chǔ)一般僅屬于某一層或某幾層。利用數(shù)據(jù)庫流圖DFD，來建立學(xué)生網(wǎng)上選課系統(tǒng)需求的過程模型，它的每一層次都代表了系統(tǒng)的一個(gè)抽象水平。本文只列出學(xué)生網(wǎng)上選課系統(tǒng)數(shù)據(jù)流圖一層分解圖，即管理登錄如圖4所示，在登陸管理進(jìn)行判斷后，發(fā)送學(xué)生/教師登陸信息的其中一種。根據(jù)用戶身份信息的不同，進(jìn)入不同的管理界面，相應(yīng)的操作功能及權(quán)限都有所不同。

3.2 用戶界面設(shè)計(jì)

學(xué)生網(wǎng)上選課系統(tǒng)功能的實(shí)現(xiàn)往往必須借助頁面來實(shí)現(xiàn)，這里所說的頁面是廣義的頁面，把運(yùn)行在服務(wù)器端的程序處理文件也包含在內(nèi)。實(shí)現(xiàn)客戶向服務(wù)器提交請(qǐng)求，服務(wù)器向用戶提供一個(gè)頁面A，用戶對(duì)此頁面處理后，提交給服務(wù)器；服務(wù)器收到提交的數(shù)據(jù)后，調(diào)用程序處理文件B，再把服務(wù)器執(zhí)行的結(jié)果以網(wǎng)頁C的形式顯現(xiàn)在客戶面前。這個(gè)過程就可以用“頁面A→頁面B→頁面C”的方式進(jìn)行描述。

在功能模塊內(nèi)部，首頁登錄頁面文件之間的設(shè)計(jì)關(guān)系如圖5所示，同時(shí)也方便程序員按照系統(tǒng)和模塊設(shè)計(jì)去實(shí)現(xiàn)各個(gè)模塊的代碼[3]。

4 學(xué)生網(wǎng)上選課系統(tǒng)關(guān)鍵技術(shù)

4.1 登錄驗(yàn)證碼技術(shù)

在開發(fā)學(xué)生網(wǎng)上選課系統(tǒng)的時(shí)候，應(yīng)當(dāng)考慮到系統(tǒng)的安全性，為了防止非法用戶采取窮舉法在線攻擊，應(yīng)當(dāng)在登錄模塊中采用驗(yàn)證碼手段。該模塊主要設(shè)計(jì)思想：用圖片格式顯示隨機(jī)碼[4]，即在服務(wù)端通過程序帶有干擾因素的圖片；在服務(wù)器端準(zhǔn)備好幾張背景圖片，這些圖片的格式、顏色、花紋等干擾方式各不相同，每次隨機(jī)抽取其中一幅作為背景，這樣就加大了通過工具來解讀圖片上字符的難度，在一定程度上提高安全性。本系統(tǒng)利用圖像函數(shù)產(chǎn)生一個(gè)4位隨機(jī)數(shù)的圖像驗(yàn)證碼，其程序?qū)崿F(xiàn)代碼如下：

<？php

for（$i=0；$i<4；$i++） {

$num.=rand（0，9）； } //生成一個(gè)4位隨機(jī)數(shù)

$im=imagecreate（100，30）； //創(chuàng)建一個(gè)100*30的圖像

$blue=ImageColorAllocate（$im，0，0，255）； //圖像的背景色

$white=ImageColorAllocate（$im，255，255，255）；

//此顏色用于插入文字的顏色

imagestring（$im，5，30，6，$num，$white）；

//將4位隨機(jī)數(shù)寫入圖像中

header（'content-type：image/gif'）； //設(shè)定輸出圖像文件類型

imagegif（$im）； //輸出圖像？>

4.2 數(shù)據(jù)庫連接技術(shù)

PHP內(nèi)置了大量操作MYSQL數(shù)據(jù)庫的函數(shù)來與其交互。在訪問數(shù)據(jù)庫之前首先需要與服務(wù)器建立連接。在一個(gè)數(shù)據(jù)庫服務(wù)器中通常有多個(gè)數(shù)據(jù)庫，在連接成功后，帶需要選擇數(shù)據(jù)庫，之后就可以數(shù)據(jù)庫中的數(shù)據(jù)進(jìn)行增加、刪除、修改、查詢等操作了。本系統(tǒng)所創(chuàng)立的數(shù)據(jù)庫db_xsxk的服務(wù)器連接的代碼如下：

<？php

$DB_HOST="localhost"； //本地服務(wù)器

$DB_LOGIN="root"； //MYSQL登錄賬戶

$DB_PASSWORD=""； ////MYSQL登錄密碼

$DB_NAME=" db_xsxk"； //連接的數(shù)據(jù)庫名稱

$conn=mysql_connect（$DB_HOST， $DB_LOGIN，

$DB_PASSWORD）； //建立和數(shù)據(jù)庫服務(wù)器連接

mysql_select_db（$DB_NAME）； //選擇數(shù)據(jù)庫

mysql_query（"SET NAMES UTF8"）； //設(shè)定數(shù)據(jù)庫編碼

？>

5 學(xué)生網(wǎng)上選課系統(tǒng)功能實(shí)現(xiàn)

為展示學(xué)生網(wǎng)上選課系統(tǒng)學(xué)生端和教師端的典型操作和編程范例，我們選擇頁面布局、學(xué)生/教師登錄驗(yàn)證、學(xué)生端和教師端等四個(gè)典型操作來說明。

5.1 頁面布局設(shè)計(jì)

在學(xué)生網(wǎng)上選課系統(tǒng)頁面樣式制作時(shí)采用CSS技術(shù)，可以有效地對(duì)頁面的布局、字體、顏色、背景和其他效果實(shí)現(xiàn)更加精確的控制，可以使html文件內(nèi)碼更精簡，樣式通常保存在外部的.css文件中，并且只需修正一個(gè)CSS文件，便可同時(shí)更新眾多的網(wǎng)頁版面外觀及格式，主流瀏覽器均支持層疊樣式表。學(xué)生網(wǎng)上選課系統(tǒng)的版面布局采用“T”形結(jié)構(gòu)布局，下方左面為主菜單，右面顯示內(nèi)容的布局，頁面結(jié)構(gòu)清晰，主次分明，是最容易上手的布局方法，其運(yùn)行效果如圖6所示。

body {

margin：0 auto； width：1024px； font：12px/1.6 "宋體"；

color：#000000； }

#left {

width：200px；float：left； margin-left：120px；margin-top：10px；padding-bottom：35px；margin-bottom：10px； }

#left h3 {

background-color：#628e37；text-align：center；color：#000000； }

#left ul li {

background：url（images/houtai3.gif） bottom no-repeat；

width：150px； margin：5px 10px 0px 30px； font-weight：

bold；color： #000000； }

#footer {

clear：both； width：900px；text-align：center；margin-top：

20px；height：40px；padding-top：8px；

margin-left：120px； }

5.2 學(xué)生/教師登錄驗(yàn)證

學(xué)生/教師端登錄過程主要涉及到驗(yàn)證和跳轉(zhuǎn)。驗(yàn)證過程是輸入學(xué)生/教師的賬戶和密碼傳入底層數(shù)據(jù)庫，由WampServer服務(wù)器自動(dòng)去mysql數(shù)據(jù)庫中進(jìn)行身份驗(yàn)證。依據(jù)不同的驗(yàn)證結(jié)果，轉(zhuǎn)入不同的功能頁面。典型的用戶登錄和驗(yàn)證代碼：

$role=$_POST[role]； //從服務(wù)器中采集到的登錄身份

$username=$_POST[username]；

//從服務(wù)器中采集到的登錄賬戶

$userpwd=$_POST[userpwd]；

//從服務(wù)器中采集到的登錄密碼

if （$role=="teacher"） {

$ChkLogin="SELECT*FROM teacher WHERE TeaNo

='$username' and Pwd='$userpwd'"； //執(zhí)行身份驗(yàn)證

} else {

$ChkLogin="SELECT*FROM student WHERE StuNo

='$username' and Pwd='$userpwd'"； //執(zhí)行身份驗(yàn)證

}

//如果驗(yàn)證通過，進(jìn)入各自不同的角色功能頁面：

if （$role=="teacher"） {

header（"Location：tea/ShowCourse.php"）；

} else {

header（"Location：stu/ShowCourse.php"）；

}

5.3 學(xué)生端主界面設(shè)計(jì)

學(xué)生登錄該系統(tǒng)后，就可以進(jìn)入學(xué)生瀏覽課程的主頁面。該頁面中提供了查詢可選課程、瀏覽已選課程、退出系統(tǒng)的鏈接。學(xué)生可以點(diǎn)擊課程編碼鏈接查看課程細(xì)節(jié)并完成選課，也可以根據(jù)查詢條件，對(duì)系部已經(jīng)開設(shè)的可選課程進(jìn)行查詢并選課。選課頁面設(shè)定了學(xué)生可選課程的最高數(shù)量，當(dāng)超過選課數(shù)量，提示退出或刪除課程后重新選課。

<？php

$StuNo=$_POST[StuNo]；

$ShowDetail_sql="SELECT*FROM stucou WHERE

StuNo='$StuNo'"；

$ShowDetailResult=db_query（$ShowDetail_sql）；

if（db_num_rows（$ShowDetailResult）<3） {

$insertCourse="insert into stucou（StuNo， CouNo，

WillOrder， State）VALUES（'$StuNo'，'$CouNo'，

$WillOrder，'報(bào)名'）"；

$insertCourse_Result=db_query（$insertCourse）；

if（$insertCourse_Result） {

echo"選擇課程成功"； }

else { echo"選擇課程失敗，請(qǐng)重新選擇＼"； }

} else { echo"最多可選三門，已經(jīng)超限，請(qǐng)先刪除已選課程

再選擇"； }

？>

5.4 教師端主界面設(shè)計(jì)

教師管理課程主頁面將所有課程信息通過表格分頁顯示出來，通過點(diǎn)擊課程編碼鏈接可以查看課程細(xì)節(jié)，通過點(diǎn)擊“修改”或“刪除”鏈接，可以實(shí)現(xiàn)對(duì)本系教學(xué)秘書開課信息修改或刪除（自動(dòng)刪除對(duì)應(yīng)的課程圖片）操作，同時(shí)該頁面提供了查詢本系部開設(shè)的課程信息，實(shí)現(xiàn)自動(dòng)獲取課程編號(hào)添加課程信息的功能。

$CouNo=strval（intval（$row['CouNo']）+1）；

5.5 結(jié)果與分析

本系統(tǒng)軟件開發(fā)環(huán)境：Window7、WampServer的集成開發(fā)環(huán)境（Apache+MySql+PHP）、IE瀏覽器/谷歌瀏覽器；系統(tǒng)對(duì)硬件環(huán)境沒有特殊的要求。本系統(tǒng)作為我院PHP動(dòng)態(tài)網(wǎng)站設(shè)計(jì)課程的創(chuàng)新創(chuàng)業(yè)實(shí)踐教學(xué)項(xiàng)目，經(jīng)過一段時(shí)間的試運(yùn)行，總結(jié)如下：

⑴ 本系統(tǒng)只需通過PC客戶端的瀏覽器運(yùn)行，采用B/S模式，解決了跨平臺(tái)運(yùn)行的問題；

⑵ 本系統(tǒng)主界面設(shè)計(jì)人機(jī)交互友好，整潔，給人一目了然的感覺；

⑶ 本系統(tǒng)功能實(shí)現(xiàn)完善，學(xué)生端選課模塊設(shè)計(jì)更加人性化，提供了搜索可選課程的功能，可以查看課程的基本信息，教務(wù)部門設(shè)定學(xué)生的選課數(shù)量；

⑷ 系統(tǒng)內(nèi)的鏈接實(shí)現(xiàn)相應(yīng)的功能。

雖然系統(tǒng)運(yùn)行效果良好，但從可利用性角度看，還需增加“教務(wù)部門”的權(quán)限和功能，對(duì)學(xué)生端的選課情況和教師端開課信息進(jìn)行綜合性管理。

6 結(jié)束語

本文討論了基于WampServer的學(xué)生網(wǎng)上選課系統(tǒng)開發(fā)，給出了學(xué)生網(wǎng)上選課系統(tǒng)的結(jié)構(gòu)圖，介紹了PHP的核心框架和程序執(zhí)行流程，并給出了典型的編程案例。學(xué)生網(wǎng)上選課系統(tǒng)教師端和學(xué)生管理功能完善，并且提供了核心源碼供開發(fā)者使用，基本滿足類似Web系統(tǒng)開發(fā)的需求。此外，本文研究的學(xué)生選課系統(tǒng)作為我院學(xué)生創(chuàng)新創(chuàng)業(yè)實(shí)踐共享項(xiàng)目運(yùn)用于PHP動(dòng)態(tài)網(wǎng)站設(shè)計(jì)課程的教學(xué)活動(dòng)中。實(shí)踐表明，該系統(tǒng)基本滿足設(shè)計(jì)需求，并取得了良好的教學(xué)效果。

參考文獻(xiàn)（References）：

[1] 李蕾.基于VDI技術(shù)的開放式教學(xué)平臺(tái)搭建研究[J].現(xiàn)代商

貿(mào)工業(yè)，2014.26（15）：170-173

[2] 李蕾.高校編程類課程云端仿真實(shí)驗(yàn)教學(xué)平臺(tái)創(chuàng)新設(shè)計(jì)與應(yīng)

用研究[J].軟件導(dǎo)，2016.15（8）：210-212

[3] 劉秋菊.Web編程技術(shù)—PHP+MQL動(dòng)態(tài)網(wǎng)頁設(shè)計(jì)[M].北京

師范大學(xué)出版社，2015.

[4] 王彥輝.PHP+MySQL動(dòng)態(tài)網(wǎng)頁技術(shù)教程[M].東軟電子出版

社，2013.

[5] 數(shù)通暢聯(lián).PHP的運(yùn)行機(jī)制與原理（底層）[EB/OL]. http：//

www.jb51.net/article/74907.htm.