【導(dǎo)讀】院(系)級(jí)班：計(jì)算機(jī)與信息科學(xué)系2021級(jí)1班。課件之家精心整理資料--歡迎你的欣賞。論文主要介紹了本課題的開發(fā)背景，所要完成的功能和開發(fā)的過程。設(shè)計(jì)重點(diǎn)、設(shè)計(jì)思想、難點(diǎn)技術(shù)和解決方案；同時(shí)也論述了基于HTTP協(xié)議的Web瀏覽器。本課題是在深入理解HTTP協(xié)議的工作機(jī)理，系統(tǒng)掌握了TCP/UDP網(wǎng)絡(luò)通信協(xié)議及網(wǎng)。絡(luò)編程的基本方法，掌握了使用WindowsSocketsAPI和MFCSocket編程技術(shù)之后，采。用VisualC++作為開發(fā)工具來設(shè)計(jì)并實(shí)現(xiàn)一個(gè)Web瀏覽器，其功能主要包括：瀏覽器的界。面實(shí)現(xiàn);實(shí)現(xiàn)收藏菜單;顯示超文本;刪除相關(guān)歷史記錄;將應(yīng)用程序加入到時(shí)工具欄、禁止。彈出窗口、禁止瀏覽某些網(wǎng)站訪問Web頁，保存網(wǎng)頁，打印網(wǎng)頁，停止當(dāng)前訪問，刷新網(wǎng)。頁，查看源文件和Inter屬性等等。

　　

【正文】 以使應(yīng)用程序?qū)崿F(xiàn)基本的網(wǎng)頁瀏覽的操作操作，但僅限于基本的瀏覽功能。有了這樣的框架以 后，具體程序的開發(fā)就變得相對(duì)容易一些了。程序員可以不必過多的被復(fù)雜的底層協(xié)議的東西所困擾，專心處理 Web 層面上的東西，諸如如何和用戶交互。這樣開發(fā)出來的應(yīng)用程序才可以在應(yīng)用方面顯出優(yōu)勢(shì)來，比如可以使程序員更多的考慮如何使網(wǎng)頁的瀏覽更方便快捷，如何使應(yīng)用程序的運(yùn)行效率更高等等一些問題，這些問題的解決會(huì)使應(yīng)用程序更加完善。這種方法不失為一種比較好的方案。 （ 3）、第三種方法利用 SOCKET 編程加 VC 的 WinI API 編程實(shí)現(xiàn)。利用 SOCKET編程需要對(duì)低層的協(xié)議理解得非常透徹，對(duì) HTTP 協(xié)議的傳輸機(jī)制非 常清楚。雖然可以利用 WinI 來實(shí)現(xiàn)頁面的下載，雖然 WinI API 對(duì) WINSOCK 進(jìn)行了再封裝，屏蔽了里面的許多細(xì)節(jié)，但是還要求程序員對(duì)頁面的瀏覽進(jìn)行大量的處理工作，諸如對(duì)從服務(wù)器上得到的網(wǎng)頁源文件進(jìn)行處理，此處理包括網(wǎng)頁源文件的解析，圖像、文本、超鏈接的定位等等一些問題?？梢钥紤] 為每種資源寫一個(gè)類，例如 CHtml， Cgif， CJpg??每個(gè)類都有一個(gè)方法，就是 顯示自身，每個(gè)類有自己的線程負(fù)責(zé)下載。例如，如果發(fā)現(xiàn) HTML 頁面里有一個(gè) JPG 連接 , 就可以生成一個(gè) CJpg 的實(shí)例，在構(gòu)造函數(shù)里設(shè) 置好它的顯示坐標(biāo)，ULR 等屬性，然后調(diào)用 CJpg::Display()。這樣的應(yīng)用程序?qū)崿F(xiàn)起來很復(fù)雜，事實(shí)上，也沒有這樣實(shí)現(xiàn)的必要。故而，這種方法對(duì)我們來說也不是一個(gè)理想的選擇。 課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 綜上所述，使用 MFC 的 CHtmlView 類編程的方法是比較理想的選擇。以下的開發(fā)設(shè)計(jì)流程就是基于第二種方案的設(shè)計(jì)流程。 需求分析 隨著計(jì)算機(jī)技術(shù)的飛速發(fā)展，人們生活中的日常事務(wù)也逐步跟計(jì)算機(jī)、互聯(lián)網(wǎng)關(guān)聯(lián)起來，伴隨著這一現(xiàn)象而起來的也是軟件行業(yè)的日益繁榮，使得人們現(xiàn)在的工作日益輕松，日益快捷，日益方便，瀏覽器在互聯(lián)網(wǎng)的使用 中占有舉足輕重的地位。根據(jù)需求研究，得出一個(gè)較為完善的瀏覽器應(yīng)具備如下功能： 瀏覽功能 在 URL 框中輸入網(wǎng)址，敲回車鍵后，在顯示框中顯示網(wǎng)頁，并在 Cache 文件夾中按網(wǎng)站的組織結(jié)構(gòu)保存網(wǎng)頁。 前進(jìn)功能 在瀏覽器的設(shè)計(jì)與開發(fā)中，前進(jìn)是常用的一項(xiàng)功能。當(dāng)需要查看曾經(jīng)瀏覽過的，下一個(gè)網(wǎng)頁時(shí)，可以通過此功能，查看曾經(jīng)瀏覽過的下一個(gè)網(wǎng)頁。 當(dāng)用戶點(diǎn)擊后退按鈕時(shí)，顯示上一個(gè)頁面，并在 URL 框中顯示當(dāng)前網(wǎng)頁地址。 后退功能 在瀏覽器的設(shè)計(jì)與開發(fā)中，后退也同樣是一項(xiàng)常用的功能。當(dāng)需要查看前一個(gè)瀏覽過的網(wǎng)頁時(shí)，可以通過此功能 ，查看瀏覽過的前一個(gè)網(wǎng)頁。 當(dāng)用戶點(diǎn)擊前進(jìn)按鈕時(shí)，顯示下一個(gè)頁面，并在 URL 框中顯示當(dāng)前網(wǎng)頁地址。 刪除功能 在瀏覽器的設(shè)計(jì)與開發(fā)中，刪除也同樣是一項(xiàng)常用的功能。當(dāng)需要?jiǎng)h除正在打開的網(wǎng)頁時(shí)，可以通過此功能，刪除當(dāng)前正打開的網(wǎng)頁。 主頁功能 當(dāng)我們?cè)跒g覽網(wǎng)頁的時(shí)候，突然想轉(zhuǎn)回到主頁上，這時(shí)我們可以點(diǎn)擊表示主頁的功能鍵，返回到主頁。 刷新功能 在瀏覽器的設(shè)計(jì)與開發(fā)中，刷新也同樣是一項(xiàng)常用的功能。當(dāng)我們由于網(wǎng)速或者打開網(wǎng)頁失敗時(shí)，我們就用刷新鍵來重新打開此網(wǎng)頁。在 用戶點(diǎn)擊刷新按鈕時(shí)，重新顯示當(dāng)前頁 面，并在 Cache 文件夾中按網(wǎng)站的組織結(jié)構(gòu)保存網(wǎng)頁。 查看網(wǎng)頁源文件 此項(xiàng)功能可以實(shí)現(xiàn)查看網(wǎng)頁源文件 . 刪除歷史記錄 在瀏覽器的設(shè)計(jì)與開發(fā)中，刪除歷史記錄同樣是很重要的一項(xiàng)。這可以保護(hù)個(gè)人上網(wǎng)的隱私，提高上網(wǎng)的安全性。 收藏夾功能 在我們用瀏覽器進(jìn)行網(wǎng)頁瀏覽的時(shí)候，會(huì)遇到自己需要的值得收藏的網(wǎng)頁，這個(gè)時(shí)候課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 我們可以通過瀏覽器上的收藏夾功能來把網(wǎng)頁保存起來，等在下一次我們需要的時(shí)候，可以調(diào)出來瀏覽。 禁止 網(wǎng)頁 彈出廣告窗口 禁止 網(wǎng)頁 彈出廣告窗口的設(shè)計(jì)，可以阻止瀏覽網(wǎng)頁過程中的一些廣告 禁止瀏覽某些網(wǎng)站 網(wǎng) 絡(luò)上的資訊有好有壞，應(yīng)該采取措施，限制對(duì)某些網(wǎng)站的瀏覽。 將應(yīng)用程序加入到瀏覽器工具欄 許多網(wǎng)絡(luò)程序都喜歡把快捷方式鏈接在瀏覽器的工具欄上。實(shí)現(xiàn)這項(xiàng)功能有兩種方法，一種是使用組策略，另一種是使用注冊(cè)表。 禁止瀏覽器彈出的廣告窗口 禁止瀏覽器彈出廣告窗口的設(shè)計(jì)，可以阻止瀏覽網(wǎng)頁過程中的一些廣告。 根據(jù)上述功能需求，畫出系統(tǒng)頂層數(shù)據(jù)流圖如下： 圖 頂層數(shù)據(jù)流圖 系統(tǒng) 1 級(jí)數(shù)據(jù)流圖如下： 圖 1級(jí)數(shù)據(jù)流圖 數(shù)據(jù)字典 ： 統(tǒng)一資源定位符（ URL） ： 課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 URL = + Host 字段 + / + ScriptName 字段 + / + PathInfo 字段 + Query 字段 Host 字段 ： 標(biāo)識(shí) Web 服務(wù)器和 Web服務(wù)器應(yīng)用程序的主機(jī)名 ScriptName 字段 ： 指定 Web 服務(wù)器應(yīng)用程序 PathInfo 字段 ： 指出報(bào)文在 Web 服務(wù)器應(yīng)用程序內(nèi)的目標(biāo) Query 字段 ： 部分包含一組命名的數(shù)據(jù)。 例如： ~~~~~~~~~ ~~~~~~~~~ ~~~~~~ ~~~~~~~~~~~~~~~~~~ Host ScriptName PathInfo Query 課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 第 4 章 瀏覽器系統(tǒng)設(shè)計(jì) 與實(shí)現(xiàn) 瀏覽器 軟件體系結(jié)構(gòu) HTML 瀏覽器把純文本的 HTML 文件轉(zhuǎn)變成圖文混排、可理解性強(qiáng)的 WEB 頁面，極大地推動(dòng)了因特網(wǎng)的普及和發(fā)展。如今瀏覽器已經(jīng)發(fā)展成可支持多種語言的系統(tǒng)軟件，并成為眾多網(wǎng)絡(luò)應(yīng)用系統(tǒng)的支撐平臺(tái)。 如前幾章所述，本課題將用 Visual C++ 開發(fā)一個(gè)HTML 瀏覽器軟件，下面從系統(tǒng)分析的角度來討論軟件體系結(jié)構(gòu)。 模塊劃分 軟件系統(tǒng)功能模塊的劃分標(biāo)準(zhǔn)及模塊間的耦合關(guān)系是軟件體系結(jié)構(gòu)的具體表現(xiàn)。功能模塊劃分的合理性、接口的清晰性和體系結(jié)構(gòu)的可擴(kuò)展性是瀏覽器設(shè)計(jì)的關(guān)鍵。根據(jù)超文本傳輸協(xié)議 HTML的 規(guī)范，一次 WEB頁面瀏覽操作可分成數(shù)據(jù)獲取、 HTML文件解釋、 WEB頁面顯示和人機(jī)交互四個(gè)子過程。 瀏覽器 中的四大功能模塊通過全局變量實(shí)現(xiàn)模塊間的數(shù)據(jù)共享 ，其體系結(jié)構(gòu)圖如下： 圖 瀏覽器軟件體系結(jié)構(gòu)圖 模塊功能描述 數(shù)據(jù)通信模塊功能 數(shù)據(jù)通信模塊是瀏覽器體系結(jié)構(gòu)中的基礎(chǔ)模塊，它的主要功能是： HTTP連接，取回用戶指定的文件（ GET操作），或向目標(biāo)服務(wù)器發(fā)送用戶指定的數(shù)據(jù)（ POST 操作）； HTML文件存放到內(nèi)存中，并將數(shù)據(jù)塊首地址和文件長(zhǎng)度傳遞給 HTML 語言解釋模塊； 、聲音、影像、 Java二進(jìn)制代碼等資源文件，并將取得資源保存在臨時(shí)目錄中，然后向 WEB頁面顯示模塊發(fā)消息。 HTML語言解釋模塊功能 HTML語言是一種標(biāo)記性描述語言 ,HTML 文 件通過標(biāo)記及其屬性，將 WEB 頁面設(shè)計(jì)者的設(shè)計(jì)思想以純文本方式保存。 HTML語 Y言解釋模塊根據(jù) HTML文本， 還原 WEB頁面編輯者的設(shè)計(jì)意圖，其具體功能是：對(duì) HTML文本進(jìn)行詞法分析，將標(biāo)記、標(biāo)記的屬性、屬性值、數(shù)據(jù)內(nèi)容分離；語法分析，確定各個(gè)標(biāo)記的作用對(duì)象和作用范圍；語義分析，將數(shù)課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 據(jù)內(nèi)容轉(zhuǎn)變成內(nèi)存中的數(shù)據(jù)對(duì)象實(shí)例，形成顯示數(shù)據(jù)緩沖隊(duì)列。 WEB 頁畫顯示模塊功能 WEB 頁面顯示模塊的功能是：計(jì)算數(shù)據(jù)對(duì)象（特別是表格中的數(shù)據(jù)元素）的顯示位置；顯示文本、圖像、語音數(shù)據(jù)；調(diào)用 JVM(Java Virtual Machine)執(zhí)行 Java Applet 程序。 人 機(jī)交互模塊功能 人機(jī)交互模塊的功能是：接收用戶的輸入消息（鍵盤消息、鼠標(biāo)消息等）；正確處理消息，完成數(shù)據(jù)交互功能；獲得服務(wù)器網(wǎng)址，控制數(shù)據(jù)通信模塊通信；將程序內(nèi)部的出錯(cuò)信息以友好的形式提交給用戶 。 模塊間 的 接口 模塊之間接口的清晰性與合理性一定程度上決定了整個(gè)瀏覽器軟件的可靠性、健壯性和可實(shí)現(xiàn)性， 瀏覽器 通過消息機(jī)制和事件驅(qū)動(dòng)方式實(shí)現(xiàn)模塊之間的通信。以下介紹 瀏覽器體系結(jié)構(gòu)中模塊間的 5個(gè)接口。 數(shù)據(jù)通信模塊與 HTML語言解釋模塊間的接口 數(shù)據(jù)通信 模塊取回 HTML 文件后，先保存該文件內(nèi)容、存儲(chǔ)數(shù)據(jù)塊的首地址和文件長(zhǎng)度，然后向 HTML 語言解釋模塊發(fā)消息。 HTML 語言解釋模塊在該消息驅(qū)動(dòng)下，先訪問全局變量，然后解釋 HTML 文件。解釋模塊在解釋 HTML 文件過程中，如遇到 IMG、 A、 Applet之類的標(biāo)記，則新增一個(gè)數(shù)據(jù)通信線程去取資源文件。 數(shù)據(jù)通信模塊與 WEB頁面顯示模塊間的接口 本接口具有單向性，即只有數(shù)據(jù)通信模塊向 WEB 頁面顯示模塊發(fā)消息。多個(gè)數(shù)據(jù)通信線程在后臺(tái)并發(fā)執(zhí)行（每個(gè)線程負(fù)責(zé)取一個(gè)資源文件），當(dāng)某個(gè)線程取回資源數(shù)據(jù)，則向 WEB頁面 顯示模塊發(fā)消息，激活后者顯示已取回資源文件，然后本線程終止。 數(shù)據(jù)通信模塊與人機(jī)交互模塊間的接口 瀏覽器工作期間，人機(jī)交互模塊控制數(shù)據(jù)通信模塊的工作進(jìn)程。首先，數(shù)據(jù)通信模塊需從人機(jī)交互模塊獲得目標(biāo)服務(wù)器的 URL 地址；其次，用戶在 WEB 瀏覽過程中，點(diǎn)擊超鏈接，人機(jī)交互模塊先獲得超鏈地址，然后申請(qǐng)一個(gè)數(shù)據(jù)通信線程取目標(biāo)文件；最后，執(zhí)行查詢、申請(qǐng)等 POST 操作時(shí)，數(shù)據(jù)通信模塊負(fù)責(zé)將用戶數(shù)據(jù)發(fā)送到目標(biāo)服務(wù)器。 頁面顯示模塊與人機(jī)交互模塊間的接口 WEB 頁面顯示模塊與人機(jī)交互模塊的接口也具有單向性，當(dāng)用戶改變 窗口大?。ㄌ貏e是瀏覽器窗口的寬度）時(shí)， WEB 頁面顯示模塊須重新計(jì)算 WEB 頁面中數(shù)據(jù)對(duì)象的顯示位置；當(dāng)用戶點(diǎn)擊超鏈后 ,WEB 頁面顯示模塊要改變被點(diǎn)擊文本的顏色，重新顯示；用戶在 WEB 頁面中輸入信息時(shí)， WEB 頁面顯示模塊必須正確回顯輸入信息。 HTML 語言解釋模塊與 WEB 頁面顯示模塊間的接口 該接口在 5個(gè)接口中最為復(fù)雜，它直接反映了源 HTML 文件中的數(shù)據(jù)內(nèi)容解釋后以何種形式存在。為了降低接口復(fù)雜性， 本設(shè)計(jì)中 使用了面向?qū)ο蟮某绦蚍治雠c設(shè)計(jì)方法。 課件之家精心整理資料 歡迎你的欣賞 課件之家精心整理資料 歡迎你的欣賞 瀏覽器 系統(tǒng)設(shè)計(jì) 主框架的生成 最初通過 MFC 的應(yīng)用程序向?qū)?chuàng)建一個(gè)單文本文檔的系統(tǒng)的主框架，視圖類的基類為 CHtmlView 類。 地址欄的生成與處理 利用控件創(chuàng)建一個(gè) ComBoxBox，作為用戶輸入網(wǎng)址的工具。當(dāng)應(yīng)用程序最初運(yùn)行時(shí)網(wǎng)址欄需要初始化，將上次瀏覽輸入的網(wǎng)址顯示出來。然后，加一個(gè)“轉(zhuǎn)到”按鈕，當(dāng)用戶輸入完網(wǎng)址，點(diǎn)此按鈕后，程序會(huì)根據(jù)用戶輸入的 URL 地址自動(dòng)轉(zhuǎn)到要打開的頁面。此外，網(wǎng)址欄還支持自動(dòng)記錄網(wǎng)址的功能。 ①、地址欄的初始化：地址欄初始化時(shí)需要從注冊(cè)表中讀取保存在其中的網(wǎng)址信息。為此，專門編寫了一個(gè)對(duì)注冊(cè) 表操作的類，具體的操作包括注冊(cè)表的打開、注冊(cè)表的關(guān)閉、判斷注冊(cè)表的狀態(tài)、從注冊(cè)表中讀數(shù)據(jù)等等操作。打開瀏覽器應(yīng)用程序時(shí)，會(huì)從注冊(cè)表中讀出記錄的網(wǎng)址信息，將讀到的網(wǎng)址信息在網(wǎng)址欄顯示出來。 ②、處理地址條相應(yīng)：當(dāng)用戶在地址欄輸入一個(gè)網(wǎng)址，點(diǎn)擊“轉(zhuǎn)到”按鈕（或者回車鍵）后，應(yīng)用程序會(huì)獲取輸入的網(wǎng)址信息，存入一個(gè)變量里，然后獲得當(dāng)前活動(dòng)視圖，利用其成員函數(shù)鏈接到網(wǎng)頁。當(dāng)點(diǎn)下“轉(zhuǎn)到”按鈕時(shí)，應(yīng)用程序還會(huì)判斷地址欄是否保存有此次輸入的網(wǎng)址，如果保存了就不進(jìn)行進(jìn)一步的操作，如沒保存此次輸入的網(wǎng)址，則會(huì)將輸入的網(wǎng)址保存起 來，然后加入地址欄。這就實(shí)現(xiàn)了自動(dòng)記錄網(wǎng)址的功能。 ③、地址條的刷新：如前所述， OnDocumentComplete()函數(shù)中的 lpszURL 和發(fā)生導(dǎo)航的 URL，是完整有效的 URL 形式，可能不同于 Navigate2 方法中設(shè)定的 UR（它可以 是 簡(jiǎn)略的 URL）。也就是說，當(dāng)頁面下載完以后， OnDocumentComplete()函數(shù)中的變量 lpszURL就保存了是完整有效的 URL 地址，我們可以用此 URL 地址取代輸入的網(wǎng)址，完成地址條的刷新。當(dāng)應(yīng)用程序打開一個(gè)超級(jí)鏈接時(shí)，也會(huì)刷新地址欄，我們就可以在OnDocumentComplete()函數(shù)中完成對(duì)地址欄的刷新。 首先需要在 ChtmlView 類中建立 OnDocumentComplete()函數(shù)，可以使用 Class Wizard來添加該函數(shù)。然后，在該函數(shù)中我們調(diào)用一個(gè) CMainFrame 類函數(shù)，從而實(shí)現(xiàn)對(duì)編輯框的設(shè)置。 添加“功能選項(xiàng)菜單” 為了瀏覽網(wǎng)頁的方便，瀏覽器應(yīng)具有回到前一個(gè)頁面、到下一個(gè)頁面、刷新、回到主頁等功能，此菜單實(shí)現(xiàn)以上所述功能。 此菜單具有回到前一個(gè)頁面、到下一個(gè)頁面、刷新、回到主頁等功能。利用 CHTMLVIEW類實(shí)現(xiàn)這些功能比較容 易，只需調(diào)用 CHTMLVIEW 類的一些成員函數(shù)。主要的是將這些成員函數(shù)正確地映