Dreamweaver+access制作一個(gè)簡(jiǎn)單的asp新聞發(fā)布系統(tǒng).doc

用Dreamweaver+Acess制作一個(gè)簡(jiǎn)單的asp新聞發(fā)布系統(tǒng)相關(guān)軟件準(zhǔn)備在進(jìn)行具體制作之前要做什么準(zhǔn)備工作呢？ 首先必須要有一個(gè)合適的動(dòng)態(tài)網(wǎng)頁(yè)開發(fā)環(huán)境，如果是windows98操作系統(tǒng)，則必須要安裝windows98中PWS也既個(gè)人web服務(wù)器。這個(gè)東東在win98安裝光盤中的add_ons目錄下可以找到。(前面寫的這段早過(guò)時(shí)了，現(xiàn)在誰(shuí)還用win98呢？嘿嘿)如果您使用的win2000/2003/winxp操作系統(tǒng)的話那就更方便了。只需要安裝IIS(internet信息服務(wù)器，也稱web服務(wù)器)就可以了，如果您的系統(tǒng)還沒(méi)有安裝，那么，在“控制面板”中“添加刪除程序”中“windows組件”里面給裝上就行了。當(dāng)然要制作網(wǎng)頁(yè)還必須要安裝時(shí)下最流行最專業(yè)的網(wǎng)頁(yè)制作軟件DreamweaverMX(2004)，還要安裝Microsoft Offce2000或以上版本，因?yàn)槲覀円美锩娴臄?shù)據(jù)庫(kù)軟件ACCESS來(lái)作為動(dòng)態(tài)內(nèi)容源,安裝了office2000,里面就包含了Access數(shù)據(jù)庫(kù)軟件。本人使用的電腦配置是windows2000 professonal+acess2000系統(tǒng)，所以要用這個(gè)環(huán)境來(lái)給大家作介紹了。設(shè)置IIS 以上條件具備之后，我們還沒(méi)有構(gòu)建了一個(gè)正確的網(wǎng)頁(yè)開發(fā)環(huán)境，實(shí)際上這里最重要的是我們要確定我們安裝的web服務(wù)器（如win2000/xp以上為IIS）IIS是否已經(jīng)正確啟動(dòng)了。如何確定呢？我們可以啟動(dòng)IE瀏覽器,在地址欄中輸入“http:/localhost/”或“/”或“http:/計(jì)算機(jī)名/”看看能不能打開默認(rèn)的網(wǎng)頁(yè)，如過(guò)能打開IIS默認(rèn)的網(wǎng)頁(yè)，則說(shuō)明IIS已經(jīng)正常啟動(dòng)了，這時(shí)就可以用來(lái)測(cè)試asp動(dòng)態(tài)網(wǎng)頁(yè)了。 為了更好的進(jìn)行測(cè)試，我們也可以打開IIS管理器對(duì)IIS進(jìn)行具體設(shè)置。打開 控制面板-管理工具-internet信息服務(wù)器 這樣就打開了IIS管理器。如圖圖1 我們可以對(duì)“默認(rèn)WEB站點(diǎn)”的主目錄進(jìn)行更改。主目錄是什么？想詳細(xì)知道IIS的詳細(xì)設(shè)置的話，可以看相關(guān)專業(yè)書籍哦。我們這里要講求“速成”，我們可以理解為，主目錄就是我們要存放代測(cè)試的動(dòng)態(tài)網(wǎng)頁(yè)的地方。其默認(rèn)的路徑為“C:Inetpubwwwroot”如果你想更改主目錄也非常簡(jiǎn)單：選中“默認(rèn)web站點(diǎn)”-右擊-選擇“屬性”在彈出的窗口中選擇“主目錄”選項(xiàng)卡，這樣就可以給該為任意的磁盤分區(qū)或目錄了，當(dāng)然是越方便越好了，本人的電腦，主目錄被我改成了“f:webtest”如下圖所示：所以大家會(huì)發(fā)現(xiàn)接下來(lái)我們?cè)诰唧w制作的時(shí)候把網(wǎng)頁(yè)文件都放在了此目錄下，要注意哦:)-數(shù)據(jù)庫(kù)與測(cè)試站點(diǎn)的建立分析實(shí)現(xiàn)所要實(shí)現(xiàn)功能首先我們要明確，一個(gè)新聞發(fā)布系統(tǒng)所能實(shí)現(xiàn)的最基本的功能：1、一般在網(wǎng)站的首頁(yè)有新聞的標(biāo)題列表（news_list.asp）2、通過(guò)顯示的新聞標(biāo)題可以看到新聞的內(nèi)容(news_detail.asp)3、有一個(gè)管理員登陸的入口（login.asp）4、添加新聞的頁(yè)面（news_add.asp）5、編輯新聞的列表的頁(yè)面（news_edit.asp）6、修改并更新新聞的頁(yè)面（news_update.asp）7、此外還有新聞修改和刪除成功的頁(yè)面（news_del_ok.asp，news_update_ok.asp）從上面的分析可以看出，我們只要制作10個(gè)左右的頁(yè)面就可以實(shí)現(xiàn)動(dòng)態(tài)發(fā)布新聞的功能了。我們就圍繞著這些具體功能開工吧：），到這里應(yīng)該不會(huì)暈的吧，剛開始哦:)數(shù)據(jù)庫(kù)的建立動(dòng)態(tài)網(wǎng)站中的內(nèi)容一般源自數(shù)據(jù)庫(kù)，如SQL Server 數(shù)據(jù)庫(kù) 甚至是小型的Access數(shù)據(jù)庫(kù)，呵呵，對(duì)于剛接觸動(dòng)態(tài)網(wǎng)頁(yè)制作的菜鳥來(lái)說(shuō)，還是Access數(shù)據(jù)庫(kù)比較容易上手，而且實(shí)用一點(diǎn)，所以我們制作的新聞系統(tǒng)是基于Access數(shù)據(jù)庫(kù)的。我們可以用Access2000創(chuàng)建一個(gè)數(shù)據(jù)庫(kù)文件,并命名為“newstest.mdb”。如圖1-1圖1-1用“使用數(shù)據(jù)庫(kù)創(chuàng)建表”在newstest.mdb中創(chuàng)建一個(gè)存儲(chǔ)新聞信息的表，保存名為“news”，具體字段內(nèi)容如下圖,圖1-2具體字段及內(nèi)容輸入完畢后，選擇“視圖”菜單中的“數(shù)據(jù)表視圖”隨便輸入幾條記錄，方便接下來(lái)測(cè)試新聞?dòng)?。如圖1-2-2：圖1-2-2創(chuàng)建一個(gè)存儲(chǔ)用戶名和帳號(hào)的表，保存名為“mypass”。表中的字段具體內(nèi)容如圖1-3所示，在表中輸入一個(gè)用來(lái)測(cè)試用的帳號(hào)和密碼。本例中，Username字段為“admin”,Password字段為“admin”。即表中保存的張?zhí)柮兔艽a都是“admin”.如圖1-3-3所示。圖1-3圖1-3-3 注意：其中表中“說(shuō)明”列括號(hào)中的文字說(shuō)明，特別是括號(hào)中的，是對(duì)每個(gè)字段的必要設(shè)置，如：圖1-2中“news_adddate”字段的默認(rèn)值一定要填“Now()”不然就不能同步取得加入新聞的時(shí)間。測(cè)試站點(diǎn)的建立 接下來(lái)，打開DreamweaverMX2004,選擇“站點(diǎn)”-“管理站點(diǎn)”-“新建.”-“站點(diǎn)”在彈出的對(duì)話框中先設(shè)置“基本”選項(xiàng)卡，設(shè)置如下圖所示，重點(diǎn)都用線標(biāo)上了:)圖1-4 在“是否使用服務(wù)器技術(shù)”一欄，一定要選擇“是，我想使用服務(wù)器技術(shù)”，“ASP VBScript”注意：為了方便測(cè)試，文件的位置一定要在IIS的主目錄，即“F:webtest”目錄，這里測(cè)試站點(diǎn)的名稱為“newstest”圖1-5圖1-6 在上圖中，測(cè)試URL的地址中輸入“http:/localhost/newstest/”，然后再點(diǎn)擊“測(cè)試URL”按鈕，如果顯示“URL前綴測(cè)試已成功”對(duì)話框，表明該項(xiàng)設(shè)置成功。當(dāng)“基本”選項(xiàng)卡的這幾個(gè)地方設(shè)置完成后，不要馬上點(diǎn)“完成”按鈕，最好還要對(duì)高級(jí)選項(xiàng)卡的幾處進(jìn)行修改：在“本地信息”里面的“本地根文件夾”和“默認(rèn)圖象文件夾”都設(shè)置相同的路徑。如圖所示：圖1-7 在“遠(yuǎn)程信息”里面主要設(shè)置如下圖所示：圖1-8在“測(cè)試服務(wù)器”中，要設(shè)置“服務(wù)器模型”，“訪問(wèn)”，“測(cè)試服務(wù)器文件夾”，具體設(shè)置如下圖：圖1-9 經(jīng)過(guò)以上的設(shè)置，新聞發(fā)布系統(tǒng)的測(cè)試站點(diǎn)就建立完成了。是不是覺(jué)得很煩，其實(shí)只要靜下心來(lái)，把上面介紹的步驟都按照要求做完，就可以了。三、DreamweaverMX2004中數(shù)據(jù)庫(kù)的連接 我們要制作動(dòng)態(tài)網(wǎng)頁(yè)，首先必須要把數(shù)據(jù)庫(kù)（Access）和網(wǎng)頁(yè)聯(lián)系起來(lái)，使我們?cè)诰W(wǎng)頁(yè)上很容易調(diào)用數(shù)據(jù)庫(kù)中的內(nèi)容，并顯示在網(wǎng)頁(yè)上。這在Dreamweaver中就很容易實(shí)現(xiàn)的。而且方法有多種，為了讓大家不暈，我在這里只介紹一種很實(shí)用用的數(shù)據(jù)庫(kù)連接的方法，“字符串連接法”，這是一般支持asp的個(gè)人主頁(yè)空見(jiàn)所用的數(shù)據(jù)庫(kù)連接方法。具體方法如下：?jiǎn)?dòng)Dreamweaver軟件，打開我們?cè)谏厦嫘陆ǖ摹皀ewstest”站點(diǎn)，并在站點(diǎn)內(nèi)創(chuàng)建第一個(gè)asp網(wǎng)頁(yè)文件，并打開。 你可以這樣創(chuàng)建新的asp頁(yè)(圖1-10)：圖1-10也可以這樣創(chuàng)建(圖1-11)：圖1-11當(dāng)我們創(chuàng)建并打開了news_list.asp文件后，就可以進(jìn)行數(shù)據(jù)庫(kù)的連接了。選擇“窗口菜單”-“數(shù)據(jù)庫(kù)”，打開數(shù)據(jù)庫(kù)面板，選擇“自定義連接字符串”在彈出的“自定義連接字符串”對(duì)話框中，連接名稱框中輸入“mynews”,在連接字符串框中輸入如下字符串“Driver=Microsoft Access Driver (*.mdb);DBQ=&Server.MapPath(/newstest/newstest.mdb)”注意一定不要輸錯(cuò)。其中/newstest/newstest.mdb是數(shù)據(jù)庫(kù)在站點(diǎn)中的路徑。在下面的“Dreamweaver 應(yīng)連接”選項(xiàng)中選擇“使用測(cè)試服務(wù)器上的驅(qū)動(dòng)程序”。輸入完成后，點(diǎn)擊旁邊的“測(cè)試”按鈕，如果彈出“成功連接腳本”對(duì)話框則數(shù)據(jù)庫(kù)連接成功了。如果出錯(cuò)那就要檢查以下剛才輸入的字符串是否正確了:)。具體選項(xiàng)如圖1-12所示：圖1-12四、新聞列表頁(yè)的制作-news_list.sp接下來(lái)我們便可以對(duì)具體的頁(yè)面進(jìn)行制作了。按照前面分析的，我們首先來(lái)制作news_list.asp頁(yè)。這里注重是向讓大家介紹具體的方法，所以頁(yè)面的美觀就不作考慮了。我們按照一般網(wǎng)頁(yè)中的最新新聞欄目來(lái)進(jìn)行制作，制作的具體頁(yè)面樣式，如圖1-13:圖1-13我們要實(shí)現(xiàn)把數(shù)據(jù)庫(kù)“news”表中的新聞標(biāo)題顯示在news_list.asp頁(yè)面上應(yīng)該怎么辦呢？選擇“窗口”菜單中“綁定”調(diào)出“綁定面板”創(chuàng)建一個(gè)名為“rsnews”的記錄集，具體設(shè)置如圖1-14所示：圖1-14在“綁定”面板中所動(dòng)分別拖動(dòng)“news_subject”和“news_adddate”字段到表格相應(yīng)位置。如圖1-15所示：圖1-15 完成后，保存并預(yù)覽網(wǎng)頁(yè)，這里有兩種方法，一種是按“F12”在Dreamweaver中直接預(yù)覽網(wǎng)頁(yè)，另一種是在IE的地址欄中輸入“http:/localhost/newstest/news_list.asp”。得到的效果如圖1-16：圖1-16我們發(fā)現(xiàn)，成功從Access數(shù)據(jù)庫(kù)中調(diào)用了一條新聞標(biāo)題。呵呵。體驗(yàn)到制作動(dòng)態(tài)網(wǎng)頁(yè)的快樂(lè)了吧？但是我們要將多條新聞顯示出來(lái)該怎么辦呢？接下來(lái)就搞定它！選中剛加入記錄集的表格行， 打開“服務(wù)器行為”面板，單擊“+”號(hào)，選擇“重復(fù)記錄集”。從彈出的對(duì)話框中可以指定需要重復(fù)記錄的記錄集和需要重復(fù)記錄的條數(shù)，具體如圖1-17所示：圖1-17保存后，預(yù)覽，效果如圖1-18：圖1-18五、新聞內(nèi)容頁(yè)的制作-news_detail.asp 為了要使我們點(diǎn)擊新聞列表頁(yè)(news_list.asp)中的新聞標(biāo)題能夠看到新聞內(nèi)容，我們必須制作顯示新聞內(nèi)容的網(wǎng)頁(yè)news_detail.asp。頁(yè)面樣式如圖1-19:圖1-19接下來(lái)拷貝news_list.asp頁(yè)面上“綁定”面板中的“rsnews”記錄集（在“+”上點(diǎn)擊鼠標(biāo)右鍵）,粘貼到news_detail.asp頁(yè)中的“綁定”面板上，雙擊記錄，對(duì)拷貝過(guò)來(lái)的記錄集稍作修改，具體如圖1-20所示：圖1-20 接下來(lái)把“綁定”面板上的各記錄拖到內(nèi)容頁(yè)（news_detail.asp）的相應(yīng)位置。如圖1-21所示：圖1-21 此時(shí)，內(nèi)容頁(yè)制作完成。這時(shí)要實(shí)現(xiàn)訪問(wèn)內(nèi)容頁(yè)還需要對(duì)news_list.asp頁(yè)的新聞標(biāo)題制作超級(jí)鏈接，但這與我們?cè)谥谱黛o態(tài)頁(yè)面的時(shí)候有點(diǎn)不同。我們選中news_list.asp頁(yè)表格中的“renews.news_subject”，然后在“服務(wù)器行為”面板上選擇“轉(zhuǎn)到詳細(xì)頁(yè)”具體設(shè)置如圖1-22,圖1-22完成設(shè)置后，保存，預(yù)覽，呵呵，可以看了內(nèi)容了吧。效果如圖1-23六、實(shí)現(xiàn)如何在網(wǎng)頁(yè)上添加新聞 如果大家跟這我的教程一起做到現(xiàn)在，我們說(shuō)，新聞發(fā)布系統(tǒng)的最基本功能已經(jīng)完成。但是，怎樣實(shí)現(xiàn)在網(wǎng)頁(yè)上動(dòng)態(tài)添加新聞到數(shù)據(jù)庫(kù)中呢?，F(xiàn)在就是要解決這個(gè)問(wèn)題了！我們一般要通過(guò)表單來(lái)實(shí)現(xiàn)新聞的添加。具體要添加什么項(xiàng)目要視數(shù)據(jù)庫(kù)中字段的不同而有所不同。新件一個(gè)news_add.asp的網(wǎng)頁(yè)，并且插入一個(gè)表單，各個(gè)文本域最好的名稱最好和數(shù)據(jù)庫(kù)中相應(yīng)的字段名稱相同。如：新聞標(biāo)題文本域我們命名為“news_subject”。見(jiàn)圖1-24圖1-24 其他同理。這里最好還要建立一個(gè)頁(yè)面用來(lái)表示新聞添加成功的提示頁(yè)addok.asp,寫上諸如“添加成功”的字樣，最好還做兩個(gè)超連接，如果“繼續(xù)添加“則鏈接到news_add.asp頁(yè)，如果”退出“則鏈到news_list.asp頁(yè)。選中整個(gè)表單，調(diào)用“服務(wù)器行為面板”中的“插入記錄”在彈出的面板中，各種選擇如圖1-25所示：圖1-25 設(shè)置完成后，保存頁(yè)面。立即按F12預(yù)覽，或在IE中輸入“http:/localhost/newstest/news_add.asp”就可以進(jìn)行新聞的添加了。七、編輯、修改、刪除新聞頁(yè)的制作我們的新聞發(fā)布系統(tǒng)已經(jīng)可以添加新聞了，下面我們繼續(xù)完成其他功能的制作。我們不僅要能添加新聞還要能夠修改和刪除新聞。所以我們要新建名為news_edit.asp的網(wǎng)頁(yè)文件，用于方便選擇需要修改和刪除的網(wǎng)頁(yè)。需要建立一個(gè)名為news_del_ok.asp的文件用于刪除新聞。建立一個(gè)名為news_update.asp的文件用于修改新聞內(nèi)容。同時(shí)還需要一個(gè)表明完成修改的過(guò)渡頁(yè)news_update_ok.asp。對(duì)于news_edit.asp頁(yè)，同樣先要要拷貝news_list.asp頁(yè)“綁定”面板上的記錄集“rsnews”按照制作news_list.asp頁(yè)的方法制作出如下樣式的頁(yè)面， 見(jiàn)圖1-26。注意這時(shí)把“重復(fù)記錄”中的值10該為20，這樣當(dāng)新聞比較多的時(shí)候可以可以顯示更多條的新聞。在表格的下放插入一個(gè)記錄集導(dǎo)航條，當(dāng)頁(yè)面中的內(nèi)容超過(guò)“重復(fù)記錄”中所規(guī)定的時(shí)，可以分頁(yè)顯示新聞內(nèi)容。方法是：選擇“插入”菜單-“ 應(yīng)用程序?qū)ο蟆?“記錄集分頁(yè)”-“記錄集導(dǎo)航條”。圖1-26 對(duì)于news_del_ok.asp頁(yè)，我們要在這頁(yè)里面放一些相關(guān)語(yǔ)句來(lái)實(shí)現(xiàn)刪除新聞的功能。首先在頁(yè)面的中間位置寫上“刪除成功”字樣。然后在“綁定”面板上選擇“命令（存儲(chǔ)過(guò)程）”在彈出的對(duì)話框進(jìn)行如下相關(guān)設(shè)置。具體按照?qǐng)D1-27所示就可以了。圖1-27對(duì)于news_update.asp我們可以復(fù)制news_add.asp頁(yè)，并拷貝newsdetail頁(yè)中的“rsnews”記錄集，同時(shí)刪除news_add.asp頁(yè)中所設(shè)置的“插入記錄”動(dòng)態(tài)服務(wù)器行為。記錄集中的“news_subject”,“news_faburen”,“news_content”分別綁定到news_update.asp頁(yè)表單的各文本域中。綁定方法如圖1-28所示.先選中需要做綁定的文本域，選擇“綁定”面板中需要綁定的字段，點(diǎn)擊面板右下方的“綁定”按鈕即可。圖1-28新建news_update_ok.asp頁(yè)，并在頁(yè)的中間位置寫上“更新成功”等字樣，作為更新成功的提示頁(yè)面。選擇news_update.asp頁(yè)中的整個(gè)表單，對(duì)其應(yīng)用“服務(wù)器行為”面板中的“更新記錄”。如圖1-29所示。圖1-29 接著應(yīng)用一下“記錄集分頁(yè)”里面的“移至特定記錄”。上面的各個(gè)頁(yè)面建立完成之后，為了讓各個(gè)頁(yè)面起作用，還需要對(duì)news_edit.asp頁(yè)中的“del”和“edit”字符應(yīng)用“服務(wù)器行為”面板中的“轉(zhuǎn)到詳細(xì)頁(yè)”注意選擇正確的網(wǎng)頁(yè)文件哦:)圖1-30八、新聞后臺(tái)登陸頁(yè)面的制作與頁(yè)面保護(hù) 前面的制作都會(huì)吧，一個(gè)新聞發(fā)布系統(tǒng)是越來(lái)越完善了?，F(xiàn)在我們需要做一個(gè)網(wǎng)站登陸入口頁(yè)(login.asp)，用于管理員同過(guò)帳好和密碼登陸news_list.asp頁(yè)對(duì)新聞進(jìn)行管理。建立一個(gè)表單，其中帳號(hào)名所在的文本域命名為“user”,密碼所在的文本域命名為:“Password”。選中整個(gè)表單，對(duì)其應(yīng)用“服務(wù)器行為”面板中“用戶身份驗(yàn)證”中“登陸用戶”。圖1-31。圖1-31 在彈出的對(duì)話框中選擇用戶帳號(hào)和密碼所在的表“mypass”,當(dāng)在login.asp頁(yè)中輸入的帳號(hào)和密碼與“mypass”表中的相同時(shí)，登陸到指定的頁(yè)面，我們這里應(yīng)指定news_edit.asp為登陸成功頁(yè)，當(dāng)然應(yīng)該在這頁(yè)里面加上“添加新聞頁(yè)的連接，以方便登陸成功后添加新聞。具體設(shè)置見(jiàn)圖1-32。圖1-32設(shè)置完成后,保存網(wǎng)頁(yè)按f12預(yù)覽