浏览器的设计与实现_学位论文

二 〇 〇 八 年 六 月

本科毕业设计说明书

学校代码： 10128 学 号： 040201123

题 目：浏览器的设计与实现 学生姓名：任飞 学 院：信息工程学院 系 别：计算机系 专 业：计

算机科学与技术 班 级：计算机04-1 指导教师：赵志燕 讲师 年金波 工程师

摘要

随着网络的不断发展，网页浏览器作为上网的所必需的软件之一，已经得到了广泛地应用。在IE独霸一方的背景下，国内外各式各样的浏览器软件都如雨后春笋般孕育而生。网页浏览器的开发与应用更是成为了计算机领域近年来的一大热点。

本文围绕着浏览器的编程与开发，讲述了在JDK5.0中进行浏览器开发的一些技术和笔者的一些心得，着重讲解了笔者在毕业设计中所实现的一个浏览器程序——MiniBrower。

本文用软件工程的开发过程，详细论述了浏览器的分析、设计及代码实现，最终实现一个具有能同时浏览多个网页，可查询历史浏览记录，可以实现打开和保存网页，超链接监听并响应，和对非法网站的过滤等基本功能的浏览器。本文以一个实际运作的浏览器 MiniBrowser 为主轴介绍浏览器的设计理念与方法,同时讲述浏览器中各个模块如何互相协同运作，来完成一个呈现网页的工作。HTML词法分析是本文着重讨论的技术问题，给出了详尽的数据结构，程序流程，并且还介绍了一些基于Java的HTML解析器。另外，Java Swing技术也是本文介绍的浏览器所使用的一种主要的技术，通过使用各个组件，并增加监听器和事件处理等操作，最终形成一个具有一定事物处理能力的浏览器的界面部分。

关键字：浏览器；Java Swing；HTML词法分析；事件

Abstract

With the unceasing development of network, the Homepage Browser, which becomes one of the essential software for surf online, has already obtained widely application. Under the leading position of IE, all kinds of domestic and foreign browser software have appeared like mushroom growth breeding lives. The homepage browser's development and the application have become a computer domain big hot spot in recent years.

This article revolves Browser's programming and development, narrated some technologies and author's attainments of carrying the browser in JDK5.0 development, explained browser procedure—MiniBrower which emphatically in the achievement of graduation project.

This article uses software engineering's performance procedure, elaborated Browser's analysis, design and code achievement, finally achieved the Browser which has simultaneously glances over many homepages. It can inquire the history to glance over the record, realize opens and preserves the homepage, the ultra connection monitors and responds, with to illegal website filtration and so on. This article take actual operation's browser—MiniBrowser as the main axle，introduced browser's design idea and method, simultaneously narrated how each module does coordinate the operation mutually in the browser, completes one to present the homepage the work. The HTML lexical analysis is the technical question which discusses emphatically, has given the exhaustive construction of data, the procedure flow, and also introduced some based on the Java HTML revolver. One kind of main technology which moreover, this article is also introduces the Swing technology of JAVA, through uses each module, and increases operations and so on monitor and event processing, final had certain thing handling ability browser's contact surface part to form.

Key words: Browser;Java Swing; HTML lexical analysis; Event

目录

引言 (1)

第一章绪论 (2)

1.1目前浏览器产品的发展现状 (2)

1.2M INI B ROWSER浏览器的组成和各部份功能说明 (3)

1.2.1 词法分析 (3)

1.2.2语法分析 (3)

1.2.3 GUI及软件界面 (4)

1.2.4布局算法 (4)

1.3开发的前期策划 (6)

1.3.1平台的选取 (6)

1.3.2确定要实现的基本功能 (6)

第二章开发工具及开发技术 (8)

2.1面向对象软件工程概述 (8)

2.2E CLIPSE简介 (9)

2.3J AVA S WING概述 (10)

3.1HTML概述 (13)

3.2HTML词法分析器B IT T OKEN的组成及其功能 (13)

3.3数据结构 (14)

3.4算法 (15)

3.4.1 基本算法 (15)

3.4.2词法分析的结果 (16)

3.5布局 (18)

3.6几种基于JAVA的HTML P ARSER (18)

第四章系统分析 (20)

4.1需求分析 (20)

4.1.1 功能需求 (20)

4.1.2其他需求 (21)

4.1.3其他说明 (21)

4.2总体设计 (22)

4.2.1设计目的 (22)

4.2.2环境说明 (22)

4.2.3子系统 (22)

4.2.4实现功能的设计 (24)

4.2.5使用Tomcat访问本地文件 (26)

4.3详细设计 (27)

4.3.1设计目的 (27)

4.3.2功能模块的实现 (27)

4.3.3系统模型 (28)

4.3.4开发环境 (30)

4.3.5关于JEditorPane的使用说明 (30)

4.4编码 (31)

4.5测试 (31)

4.5.1测试目的 (31)

4.5.2测试环境 (32)

4.5.3 测试用例 (32)

结论 (36)

参考文献 (38)

谢辞 (40)

引言

当前，信息化浪潮正在全球范围内兴起，一个以计算机网络为核心的信息时代正向我们走来。在Internet飞速发展的今天，互联网成为人们快速获取、发布和传递信息的重要渠道，从而倍受人们的重视，而互联网上信息的查找又要通过浏览器的浏览来实现，所以本文通过对当下流行的浏览器的模拟设计和实现来让大家对网络及网络资源的认识，以及浏览器的各个功能的实现有一个大概的认识。

浏览器是一个基于C/S架构的应用软件，其最基本的功能，就是能够将因特网上的众多资源，例如网页上的内容与信息或是在线服务等，呈现给使用者并让使用者得以使用存在于因特网上的各项服务。因此透过网络传输数据对浏览器来说，是相当重要且必备的一项能力。

浏览器作为重要的系统应用软件是不可或缺的。但目前，浏览器产品的市场被少数国外大公司垄断，众多的小型浏览器也尚处于发展期,而国内的自主技术的浏览器更屈指可数，刚刚进入实用阶段。迫切需要更多的人来关注浏览器技术，开发中国自主知识产权的浏览器产品。

为了支持跨平台访问网页的需求，本课题完成跨平台的浏览器开发，实现个人能同时浏览多个网页，可查询历史浏览记录，对非法网站的过滤等功能的浏览器。本文阐述了浏览器开发的关键技术，并详细说明MiniBrowser的实际开发过程，和技术细节。

第一章绪论

1.1目前浏览器产品的发展现状

常见的桌面浏览器有微软的Internet Explorer，网景的Netscape，开放源码的Mozilla FireFox，以及opera，mosaic，Hotjava，字符模式的lynx等。其中IE，Opera已有嵌入式版本，以上的大多数浏览器均有跨多平台的版本。这些桌面型浏览器功能参差不齐，但大多都能实现基本的浏览功能。其中IE与Netscape 对HTML页面的显示效果均堪称完美（对于XML，WML等标准的网页浏览，本文不予讨论）。

与完美的浏览效果，功能丰富，支持多种媒体格式和视音频插件等优点形成对立的是，这些浏览器庞大的体积和对机器配置的高要求；这也是桌面浏览器和嵌入式浏览器最大的区别。另外，桌面型浏览器通常是基于通用的操作系统，用于桌面电脑如PC机、MAC机等；而嵌入式浏览器通常基于专用系统。

需要指出的是，在网上常看到的一些浏览器，如Netcaptor，魔装网神，腾讯，飓风，Fantasia，金山WPS office的浏览器等等，均为使用IE内核的浏览器，使用了多页面多线程的方式，降低了系统资源的耗费，方便了浏览，但软件本身没有使用多少技术，可以用Delphi，VB等工具轻易开发出来（如果不要求完善的功能，只需简单到拖一个IE控件过去就行了），这也体现了微软的COM+及ActiveX技术的强大。

1.2MiniBrowser浏览器的组成和各部份功能说明

1.2.1 词法分析

HTML（HyperText Markup Language，超文本标记语言）词法分析是浏览器设计的基础环节之一，也是整个设计过程中重要的前端工作，其数据结构的拟定与接下来的语法分析和布局算法密切相关，词法分析的效率与准确性、容错性也关系到整个浏览器设计的质量。MiniBrowser采用了JDK（Java Development Kit,Java 开发包）附带的HTML解析器解析从服务器返回的HTML数据。

1.2.2语法分析

在大型的浏览器中，语法分析通常是独立的模块，但在某些小型的浏览器中，语法分析通常是与布局混合在一起的，即一边进行语法分析，一边布局，不设立相

应的数据结构来存储语法分析的结果。本文所讲述的MiniBrowser也是采用这种设计思想。另外，语法分析对布局的算法有直接的指导意义。

1.2.3 GUI及软件界面

浏览器无疑是一个图形界面的大需求者，选择好的GUI（Graphics User Interface，图形用户界面）环境实属不易，为了能够实现专有的功能，浏览器开发者往往还要对基础的GUI库进行包装、改写，甚至写自己的控件。所有这些，是需要有专业的GUI库开发经验的专职人员来完成。

GUI的功劳第一在于软件的操作界面，如窗口、菜单、工具条、滚动条等。第二在于主浏览窗体中的图形元素的输出（通常以自画控件的方式）。前者通常直接使用GUI库中的已有控件，编程难度很小，后者主要利用基本的点线函数，编程难度比较大。在MiniBrower中使用Java Swing技术编写浏览器的图形界面，而做图形界面首先要考虑的就是选择一个合适的布局管理器。与VB不同，JDK没有表单设计器，需要通过代码来定制布局管理器来放置用户界面组件所在的位置。

1.2.4布局算法

本文中的布局应理解为界面输出前的预演和处理位置等信息的算法，而不是具体的画图和界面输出。布局算法的好坏直接关系到界面的输出效果，但布局算法也是要根据GUI所能实现的输出效果来设计的，所以，GUI往往成为系统的瓶颈，如果GUI提供的支持有限，即使有再好的布局算法，也是纸上谈兵，无用武之地。在Swing中有以下几种简单的布局管理器：

（1）FlowLayout流式布局管理器

FlowLayout是最简单的布局管理器，按照组件的添加次序将它们从左到右地放置在容器中。当到达容器边界时，组件将放置在下一行中。

（2）BorderLayout边界布局管理器

BorderLayout为在容器中放置组件提供了一个稍微复杂的布局方案。BorderLayout把容器分为五个区域：东、南、西、北和中。东占据容器的右侧，南占据容器的下侧，以此类推。

（3）GridLayout网格布局管理器

GridLayout将容器分割成许多列和行，组件被填充到每个网格中。添加到容器中的组件首先放置在左上角的网格中，然后从左到右放置其他组件，直至占满该

行的所有网格，接着继续在下一行中从左到右放置组件。

（4）CardLayout卡片式布局管理器

CardLayout将界面看作一系列的卡片，在任何时候只有其中一张卡片是可见的，这张卡片占据容器的整个区域。

当某个容器被创建后，就会有一个默认的布局管理器。Window、Frame和Dialog的默认布局管理器是BorderLayout,Panel和Applet的默认布局管理器是FlowLayout。可以调用容器的setLayout()方法来设置容器的布局管理器。[1] 1.3开发的前期策划

以下的工作均是建立在大量的调查基础上的，是浏览器开发前期准备工作所解决的问题。

1.3.1平台的选取

目前的商业化嵌入式操作系统功能完善，但使用费用高昂，使用Linux内核的嵌入式操作系统不仅功能强大，便于开发移植，而且费用低廉，基于Linux的软件系统已日渐成熟，也有相应的窗口系统可以使用，使用PC上的Linux来进行浏览器开发，是再好不过的了，软件从一台PC移植到另外一台设备只需更改配置信息，重新编译一下就可以了（前提是使用的函数库、开发包具有JDK1.5或更高的版本）。

1.3.2确定要实现的基本功能

鉴于对浏览器开发难度的充分考虑，以及现有人员的水平，拟定实现以下功能，以及需要考虑但暂不予实现的功能。

需要实现的包括：

(1) 界面：包括窗口，菜单，输入框，工具条，滚动条等的支持。

(2) 实现简单网页的布局：实现对简单网页的查看。

(3) 支持基本IO（Input/Output，输入/输出）。

(4) 支持对非法网站的过滤。

需要考虑的功能：

(1) JSP（Java Server Page,Java服务页面）支持

(2) 汉字支持

(3) Java Script的支持

(4) 表单支持

(5) 页面元素的消息响应

第二章开发工具及开发技术

2.1面向对象软件工程概述

软件工程是一门研究如何用系统化、规范化、产业化等工程原则和方法实施软件开发和维护的学科。1968年秋季，NATO的科技委员会召集了近50名一流的编程人员、计算机科学家和工业界巨头，讨论和制定摆脱“软件危机”的对策。在那次会议上第一次提出了软件工程（Software Engineering）这个概念。到今年，软件工程整整走过了33年的历程。软件研究人员不断探索新的软件开发方法，至今已形成八类软件开发方法，例如最早的Parnas方法。但这一方法不能独立使用，只能作为其它方法的补充。

软件开发的面向对象方法于20世纪60年代后期提出，到20世纪90年代前半期，面向对象软件工程成为开发人员的首选范型。

面向对象方法是一种自底向上和自顶向下相结合的方法，它以对象建模为基础，不仅考虑了输入、输出数据结构，实际上也包含了所有对象的数据结构。OO 技术在需求分析、可维护性和可靠性这三个软件开发的关键环节和质量指标上有了实质性的突破。[2]

面向对象方法的特点有：

（1）自底向上的归纳

（2）自顶向下的分解

（3）基础是对象模型

（4）需求分析彻底

（5）可维护性大大改善

2.2 Eclipse简介

Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言，它只是一个框架和一组服务，用于通过插件和组件构建开发环境。幸运的是，Eclipse 附带了一个标准的插件集，包括 Java 开发工具（Java Development Tools，JDT）。

虽然大多数用户很乐于将 Eclipse 当作 Java IDE 来使用，但 Eclipse 的目标不仅限于此。Eclipse 还包括插件开发环境（Plug-in Development

Environment，PDE），这个组件主要针对希望扩展 Eclipse 的软件开发人员，因为它允许他们构建与 Eclipse 环境无缝集成的工具。由于 Eclipse 中的每样东西都是插件，对于给 Eclipse 提供插件，以及给用户提供一致和统一的集成开发环境而言，所有工具开发人员都具有同等的发挥场所。这种平等和一致性并不仅限于Java 开发工具。尽管 Eclipse 是使用 Java 语言开发的，但它的用途并不限于Java 语言；例如，支持诸如 C/C++、COBOL 和 Eiffel 等编程语言的插件已经可用，或预计会推出。Eclipse 框架还可用来作为与软件开发无关的其他应用程序类型的基础，比如内容管理系统。

基于Eclipse 的应用程序的突出例子是IBM 的WebSphere Studio Workbench，它构成了 IBM Java 开发工具系列的基础。例如，WebSphere Studio Application Developer 添加了对 JSP、servlet、EJB、XML、Web 服务和数据库访问的支持。

Eclipse采用的技术是IBM公司开发的（SWT），这是一种基于Java的窗口组件，类似Java本身提供的AWT和Swing窗口组件；不过IBM声称SWT比其他Java 窗口组件更有效率。Eclipse的用户界面还使用了GUI中间层JFace，从而简化了基于SWT的应用程序的构建。

Eclipse的插件机制是轻型软件组件化架构。在富客户机平台上，Eclipse使用插件来提供所有的附加功能，例如支持Java以外的其他语言。已有的分离的插件已经能够支持C/C++（CDT）、Perl、Ruby，Python、telnet和数据库开发。插件架构能够支持将任意的扩展加入到现有环境中，例如配置管理，而决不仅仅限于支持各种编程语言。[3]

2.3 Java Swing概述

在java 1.0刚刚出现的时候，包含了一个用于基本GUI程序设计的类库，Sun 将它成为抽象窗口工具箱（Abstract Window Toolkit，AWT）。基本AWT库采用将处理用户界面元素的任务委派给每个目标平台（Windows、Solaris等等）的本地GUI工具箱的方式，由本地GUI工具箱负责用户界面的元素的创建和动作。例如，如果使用最初的AWT在Java窗口中放置一个文本框，就会有一个底层的“对等体”文本框，用它来实际地处理文本输入。从理论上说，结果程序可以运行在任何平台上，但观感（look and feel）的效果却依赖于目标平台。

对于简单的应用程序来说，基于对等体方法的效果还是不错的，但是，要想编

写依赖于本地用户界面元素的高质量、可移植的图形库就会显现出缺陷了。例如，菜单、滚动条和文本域这些用户界面元素，在不同的平台上，操作行为存在着一些微妙的差别。因此，要想给予用户一致的、可预见性的界面操作方式是相当困难的。而且，有些图形环境并没有像Windows或Macintosh这样丰富的用户界面组件集合。这也就将基于对等体的可移植库限制在了一定的范围内。其结果是使AWT构建的GUI应用程序看起来没有Windows或其他应用程序显示的那么漂亮，也没有提供那些平台用户所认知的功能。更加糟糕的是，在不同平台上的AWT用户界面库中存在着不同的Bug。

1996年，Netscape创建了一种称为IFC（Internet Foundation Class）的GUI库，它采用了AWT完全不同的工作方式。它将按钮、菜单这样的用户界面元素绘制到空白窗口上，而对等体只需要创建和绘制窗口。因此，Netscape的IFC部件在程序运行的所有平台上的外观和动作都一样。Sun和Netscape合作完善了这种方式，创建了一个名为Swing的用户界面库。Swing可作为Java 1.1的扩展部分使用，现已成为JDK 1.2标准库的一部分。

现在，Swing是不对等基于GUI工具箱的正式名字。它已是Java基础类库（Java Foundation Class，JFC）的一部分。完整的JFC十分庞大，其中包含的内容远远大于Swing GUI工具箱。JFC特性不仅仅包含了Swing组件，而且还包含了一个可访问的API、一个2D API和一个可拖拽的API。

当然，在用户屏幕上显示基于Swing用户界面的元素要比显示AWT的基于对等体组件的速度慢一些。但对于任何一台现代的计算机来说，微小的速度差别无妨大碍。另外，由于下列几点无法抗拒的原因，驱使人们选择Swing：

（1）Swing拥有一个丰富、便捷的用户界面元素集合。

（2）Swing对底层平台依赖的很少，因此与平台相关的bug很少。

（3）Swing给予不同平台的用户一致的感官效果。[4]

第三章 HTML的分析

3.1 HTML概述

超文本标记语言(HyperText Markup Language，HTML)是一种用于文档布局和超文本链接规范的语言。它定义了特殊的、嵌入式指令的语法和放置方法，浏览器中不会显示这些指令，但是HTML可以告诉浏览器该如何显示文档的内容，如文本、图像及其他支持的媒体等，还有如何通过特殊的超文本链接来制作交互式的文档，这些链接可以把这些文档和其他因特网资源链接起来。

HTML词法分析是浏览器设计的基础环节之一，也是整个设计过程中重要的前端工作，其数据结构的拟定与接下来的语法分析和布局算法密切相关，词法分析的效率与准确性、容错性也关系到整个浏览器设计的质量。[5]

3.2 HTML词法分析器Bit Token的组成及其功能

Bit Token是Netbit Browser的HTML词法分析器，使用标准C编程，Netbit Browser是基于Linux/Gtk的浏览器，也是一个开放源码项目。

Bit Token作为Netbit Browser的词法分析部份，负责对接收的HTML代码进行词法分析，主要的目的是提取网页中元素的名称及其属性，并以恰当的形式（即按一定的数据结构）加以保存，也就是完成了将数据流离散化、结构化的过程。

Bit Token主要由以下几个部分组成：

（1）初始化：完成对数据结构的初始化，主要是分配内存，变量赋初值。

（2）主体的数据流分析：逐字符的进行判断，确定数据的归属类型。

（3）元素的分析：提取元素的名称、属性和值域。

（4）释放：主要是对内存的释放。

3.3数据结构

typedef struct BitTokenContext

{char * strBuffer; //当前正在处理的HTML代码

int bufferLength;

int curPosition;

char * global_strBuffer; //全局HTML代码

int global_bufferLength;

int global_curPosition;

BitTokenList *tokenList; //元素节点链表

BitTokenList *tokenList_tail;

BitPTagList pTagList; //元素名称表，指向静态数据

}BitTokenContext,*BitPTokenContext;

BitTokenContext是用于存储当前待分析网页全局属性的数据结构，其中TokenList是核心的元素节点链表。词法分析的目的就是生成这样一个链表。下面给出该链表的数据结构，是很简单的双向链表。

typedef struct TokenList

{ BitToken *token; //元素节点

struct TokenList *priou;

struct TokenList *next;

}BitTokenList,*BitPTokenList;

以下是元素节点的数据结构：

typedef struct BitToken

{int type; //节点类型，如定义的HTML_BODY，HTML_TXT等。

char *pData; //如果是HTML_TXT型元素，则为其内容，否则为空

BOOL end; //是否是结束元素，如

BitTokenAttrList *attrList; //元素属性链表，因为可能有多个属性，所以使用链表存储

BitTokenAttrList *attrList_tail;

}BitToken,*BitPToken;

请注意，以上出现tail标记的指针变量，如BitTokenList * tokenList_tail等，其作用是用于保存链表结尾节点指针，便于在释放内存时，直接找到链尾，提高了算法的效率。[6]

3.4算法

3.4.1 基本算法

首先介绍基本的算法：

(1) 从存储网页的字符串中，顺序读入一个字符。

(2) 如果遇到< ，认为遇到TAG（元素），处理该元素，使用函数