摘 要

在互联网盛行的今天，我们见证了许多新的技术的诞生与盛行。新的技术总是可以带动社会的进步，改善人们的生活。WebOS作为一个新的操作系统，给我们带来了非常新颖的体验。一种新的操作系统给我们的不仅是体验，更多的是方便快捷。

本文研究的是设计实现一个基本的Web桌面，让用户可以在浏览器端像操作自己的个人电脑一样操作Web桌面。用户可以在Web桌面上拖拽图标、删除图标、打开应用以及右键桌面显示菜单，并实现一些个人电脑的一些基本功能。该Web桌面前台是由HTML5和CSS编写，而后台的逻辑则是由JavaScript编写。该Web桌面的主要功能有我的电脑、视频播放器、回收站、text文本编辑器和万年历，用户可以使用这些功能体验WebOS与传统操作系统的区别。

进入Web桌面，点击桌面右键会显示菜单，其中包括刷新页面，更改背景和创建文本文件。桌面上有5个默认图标，在我的电脑的应用中，用户可以查看本地文件，并对其进行删除操作，而视频播放器则允许用户播放服务器视频之外还允许播放本地视频。打开Text文件编辑器，用户可以编辑保存文件。当用户需要查看文件的时候，只需要点开相应的文本文件就可以看到自己之前编辑过的内容。至于万年历，用户可以查看不同年份月份的日期信息，并选择某一天查看具体的农历、星期、星座等信息。

最后实现的Web桌面让用户可以进行简单的操作，满足一个基本的Web桌面的需求。经过系统测试之后，Web桌面实现了大部分的功能，用户可以在Chrome和360浏览器上体验该Web桌面。

关键词：WebOS；HTML5；Web桌面；操作系统

ABSTRACT

In the times of prospering Internet, we have seen the birth and prospering of many technologies. The new technology can always bring the society forward improving the quality of our lives. WebOS, as a new operating system, always brings us the novel experience. A new operating system not only brings experience, but also more convenience.

The study of this thesis is designing a basic Web desktop in order to let users to operate Web desktop in the browser as they operate their own computer. Users can drag and delete icons, open applications and operate right-click on the desktop to display the menu, and realize some fundamental function of computer. This Web page of desktop is programmed by HTML5 and CSS, but the logic of Web desktop is programmed by JavaScript. The main function of this Web desktop consists of my computer, video player, recycle bin, text editor and calendar. Users can experience the difference between the WebOS and traditional operating system by using those functions.

Entering the Web desktop, users can make right-click on the desktop to display the menu, which includes refreshing, themes setting and creating files. In the desktop, there are 5 default icons. Opening the application of my computer, users can check the files in the local disk and delete files. In addition, video player can allow users to play the video not only in the server but also in the local disk. Users can edit the file by opening the text editor and check the text of previous contents when they want to see the file. When it comes to the calendar, users can see the information of different years and months and choose one day to see the specific information, such as the lunar calendar, the week and constellation and so on.

Users can make some simple operations in the final Web desktop, which meets the need of a basic Web desktop. After the system tests, Web desktop can realize most of the functions and users can experience the Web desktop on the Chrome and 360 browser.

Keywords: WebOS; HTML5; Web Desktop; Operating System

目 录

第1章 绪论 1

1.1Web桌面的研究背景和意义 1

1.2 Web桌面的发展现状 1

1.3 本文的研究目标和内容 2

第2章Web桌面需求分析和整体设计 3

2.1 Web桌面设计目标 3

2.2 需求分析 3

2.2.1系统功能模块 4

2.2.2本地磁盘文件管理 5

2.2.3视频播放器 6

2.2.4万年历 6

2.3 Web桌面前台结构设计 7

2.4 Web桌面后台模块设计 7

第3章 Web桌面设计与实现 8

3.1Web桌面设计技术介绍 8

3.1.1 HTML5和CSS 8

3.1.2 JavaScript 8

3.1.3 DWR框架 8

3.2 前台桌面的设计与实现 9

3.2.1 桌面及任务栏 9

3.2.2 桌面图标的初始化及开始菜单 9

3.2.3 图标右键菜单及桌面右键菜单 10

3.2.4 登录界面 11

3.3 桌面后台的设计与实现 12

3.3.1 图标的拖拽与删除 12

3.3.2 应用的获取与打开 13

3.3.3 数据库的建立 13

3.3.4 Text文本编辑器 14

3.3.5VideoPlayer的实现 15

3.3.6我的电脑磁盘管理 16

3.3.7万年历 18

第4章 Web桌面的测试 19

4.1 系统测试 19

4.1.1 功能测试 19

4.1.2 兼容性测试 20

4.2 集成测试 20

4.3 单元测试 21

4.4 测试分析 21

第5章 总结与展望 22

5.1 总结 22

5.2 问题与展望 22

致 谢 24

参考文献 25

第1章 绪论

1.1Web桌面的研究背景和意义

随着计算机的发展，Web占据着越来越重要的作用和地位。各式各样的Web应用和业务都相继出现，例如人们钟爱的网购，用户会登入淘宝、天猫、京东等网上购物平台进行购物，同时人们也可以在新浪、腾讯等网页上查看新闻等信息。这些应用和服务都改变着人们的生活，让人们的生活更加便利快捷。

于此同时，介于Web的作用如此之大，开发一个WebOS^（2）的重要性不言而喻。随着技术的发展，Web方面的技术也不断完善，开发者们逐渐可以在Web上开发出类似于Mac、Windows的操作系统。WebOS的出现打破了原有的格局，虽然WebOS仍然存在着一些问题，但是它也有自己的一些优点。开发者相信随着技术的发展，WebOS的局限会逐步消失，到时候真正的WebOS将会引发新一轮的技术革命。

对于现有的操作系统而言，WebOS本身有着许多优点。对于本地的操作系统，它们的资源十分有限，用户只能使用本地的资源。除此之外，本地的存储空间也十分有限，这大大地限制了个人电脑的能力，再加上个人电脑的安全性问题，对比而言，WebOS就有许多可取之处。