CN102955694A - 基于WebKit 浏览器的客户端实现方法以及客户端 - Google Patents

Abstract

本发明提出基于WebKit浏览器的客户端实现方法以及客户端。点击进入主界面，从本地数据库中读取应用系统数据，进入应用系统列表界面选择应用系统；加载已选择应用系统的URL页面，所述应用系统的JS脚本绑定终端本地对象；点击应用系统的URL，通过JS脚本调用终端本地对象，进行数据传递。本发明简化了基于Android平台的客户端开发过程，适应单个Android智能客户端对接多个Web应用系统的快速开发和适配，提高Android平台客户端对接Web系统的速率。

Description

基于WebKit 浏览器的客户端实现方法以及客户端

技术领域

本发明主要应用于政府和企业的信息化系统向智能平台(Android平台)开发迁移的领域，尤其涉及基于WebKit浏览器的客户端实现方法以及客户端。 

背景技术

随着移动信息化技术的进步和中国电信3G业务的快速发展，移动信息技术走进了人们的工作和生活之中。通过掌上终端、PDA、手机等移动设备，以电信、互联网通讯技术融合的方式，人们可以随时随地进行随身的移动化信息生活和工作。 

目前，政府和企业在电脑上应用的各种信息化软件体系，如办公信息化软件、ERP软件、CRM软件、物流管理软件、进销存软件，以及各行业特定的行业软件(如警务联网系统、统计局统计系统等等)，都开始逐渐移植到手机终端上使用。针对政府和企业的多种信息化系统开发相应的移动系统是一件工作量巨大、耗费时间和资源的繁重工作。 

现今Web信息系统向移动终端迁移的过程是为不同平台不同终端定制开发不同的客户端。传统做法是通过Android SDK进行页面和系统的开发，并利用WS、http或者Socket等方式与后台进行数据通信与交互；后端也会根据设计好的数据通信方式，从原有信息系统中进行二次开发适配的过程。也有一些组织和机构在致力研发跨平台的客户端、例如Oprea、JIL、xFace widget等。 

发明内容

鉴于以上，本发明提出基于WebKit浏览器的客户端实现方法以及客户端。 

在本发明中涉及的相关技术术语，作如下说明： 

JS，全称JavaScript，是一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能。 

WebView，为Android手机中内置了一款高性能webkit内核浏览器，Android将Webkit内核浏览器在SDK中封装成了WebView组件。 

WebChromeClient，是在Android系统中辅助WebView处理Javascript的对话框、网站图标、网站title以及加载进度等功能。 

WebViewClient，是在Android系统中帮助WebView处理各种通知、请求事件的，具体包括页面开始加载事件、页面加载完成事件以及页面加载失败事件等。 

本发明提出基于WebKit浏览器的客户端实现方法，包括以下步骤：点击进入主界面，从本地数据库中读取应用系统数据；如果本地数据库中没有应用系统数据，切换到新增应用系统页面中，新增应用系统并将新增的应用系统写入本地数据库；如果本地数据库中有应用系统数据，将进入应用系统列表界面选择应用系统；加载已选择应用系统的URL页面，所述应用系统的JS脚本绑定终端本地对象；点击所述应用系统的URL，通过JS脚本调用终端本地对象，进行数据传递。 

优选地，基于WebKit浏览器的客户端实现方法，进入应用系统列表界面，还包括以下步骤：进行应用系统列表的增加、删除或修改操作，并更新本地数据库中的应用系统数据。 

本发明还提出基于WebKit浏览器的客户端，包括：数据库，用于存储本地应用系统数据；本地功能调用模块，在接收到Webkit浏览器的调用请求时，调用终端本地对象并向JS传递数据；主界面，用于读取数据库已存储的本地应用系统数据，如果没有应用系统数据，切换到新增应用系统页面，新增应用系统并将新增的应用系统存储到数据库；如果有应用系统数据，进入应用系统列表界面；Webkit浏览器界面，用于绑定应用系统的JS脚本与终端本地对象，用于从应用系统列表界面中选择应用系统，加载已选择应用系统的URL页面，点击所述应用 系统的URL，通过JS脚本调用本地功能调用模块，接收其传送给JS脚本的数据。 

优选地，基于WebKit浏览器的客户端，包括：主界面还增加、删除或修改应用系统列表，并更新数据库中的应用系统数据。 

本发明提出基于当前最流行移动信息平台(Android平台)的通用客户端，并利用HTML、CSS和浏览器的特点，简化针对不同系统开发不同Android平台客户端的工作。本发明将Android平台客户端开发人员从繁重的软件开发工作中简化出来，并使其着重于HTML页面和CSS的工作，从而简化了基于Android平台的客户端开发过程，降低了Android客户端开发人员的技术门槛，提高了客户端软件的开发速度，极大地适应了单个Android智能客户端对接多个Web应用系统的快速开发和适配，提高Android平台客户端对接Web系统的速率，为企业开发客户端节省了开发时间和人力成本。 

附图说明

此处所说明的附图用来提供对本发明的进一步理解，构成本发明的一部分，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中： 

图1为本发明基于WebKit浏览器的客户端结构示意图； 

图2为本发明Webkit浏览器界面调用本地功能的示意图； 

图3为本发明基于WebKit浏览器的客户端实现方法流程图； 

图4为本发明实施例的示意图。 

具体实施方式

为使本发明的目的、技术方案和优点更加清楚明白，以下结合具体实施例，并参照附图，对本发明进一步详细说明。 

图1所示为本发明基于WebKit浏览器的客户端结构示意图，包括数据库、本地功能调用模块、主界面和Webkit浏览器界面。其中： 

数据库，用于存储本地应用系统数据。 

本地功能调用模块，在接收到Webkit浏览器的调用请求时，调用终端本地对象并向JS脚本传递数据。终端本地对象包括拍照、录音、定位、文件存储和读取、短信管理或电话管理等。 

主界面，用于读取数据库已存储的本地应用系统数据，如果没有应用系统数据，切换到新增应用系统页面，新增应用系统并将新增的应用系统存储到数据库；如果有应用系统数据，进入应用系统列表界面。主界面还增加、删除或修改应用系统列表，并更新数据库中的应用系统数据。主界面包括ListView控件、ItemView控件。 

Webkit浏览器界面，用于绑定应用系统的JS脚本与终端本地对象，用于从应用系统列表界面中选择应用系统，加载已选择应用系统的URL页面，点击所述应用系统的URL，通过JS脚本调用本地功能调用模块，接收其传送给JS脚本的数据。Webkit浏览器界面包括WebView控件、WebChromeClient和WebViewClient。 

本发明提出了利用HTML方式将Web信息系统向移动终端迁移的快速集成和适配的方法，设计了具有门户特性的客户端，并封装了终端的硬件功能，以方便客户端访问Web页面时，Web页面直接管理和调用终端功能获取所需数据与信息。 

下面将结合附图对本发明进行具体说明。 

(1)客户端通用性 

客户端自动从本地数据库(即XML文件)中读取现存的所有门户信息，并将各个门户信息以对象形式传递给主界面中的ListView控件。ListView控件按照自定义的ItemView布局形式，并按照各个门户信息的对象，进行ItemView中数据的填充和显示工作。用户长按ListView中的某一具体ItemView项，系统为用户显示一个提示对话框，其中包含了所选门户的详细信息。 

ItemView控件中包括左侧CheckBox多选框，右上侧为用于显示系统用户名的TextBox控件，右下侧为用于显示应用系统URL和IP的TextBox控件。选择左侧的CheckBox多选框后，用户可以选择菜单中的修改和删除功能，对所选门户信息进行修改和删除等功能。 

当新增、修改或删除门户信息时，ListView控件将按照ItemView布局进行显示，并对本地XML文件进行数据新增、修改或删除操作，从而实现了显示的数据与XML文件本地存储的数据一致。比如，“删除选中项”将用户所选的应用系统从主界面和本地数据库中删除；“全部删除”菜单项将在主界面和本地数据库中删除所有应用系统。 

(2)通用的传输协议 

本发明在每个门户页面的显示均采用HTML方式，即直接访问门户所定制的Android移动终端访问的页面。这样使得在迁移Web信息系统到移动终端上时，减少了很多工作。 

在应用系统列表中，用户需要添加应用系统URL。用户选择进入该应用系统后，将在本地打开Webkit浏览器界面，根据该应用系统URL访问该应用系统。含有WebView的Webkit浏览器界面将使用WebView控件对应用系统的Web控件进行解析和显示。 

从一个URL页面切换到另一个URL页面，Webkit浏览器界面将WebView控件加载新的URL页面。Webkit浏览器界面在开始打开时，显示进度提示对话框，在页面加载完成时关闭进度提示对话框，以确保系统的动态准确性。 

通过对WebView控件的封装，开发人员无需再进行Android终端每一个界面的开发和调试，在每一个Android终端与后台进行交互时，也不需要数据通信模块，使用通用的传输协议HTML，直接采用了HTML的HTTP方式进行交互，大大降低了Android平台客户端开发人员的进入门槛和工作量，开发人员只需要对含有JS脚本的Web页面进行开发和调试工作。HTML的方法完全避免了不同版本Android终端、不同品牌Android终端、不同屏幕分辨率的Android终端的差异，为开发和迁移工作减少了很多复杂的工作。 

(3)终端功能的调用 

在终端上进行传统的网页浏览，只能够进行网页浏览和数据操作。而本发明封装了WebView控件，能够对所有网页进行浏览，还可以通过WebView控件将JS脚本和终端本地对象进行绑定，使得点击网页 URL时，通过JS脚本能够访问到本地封装好的各种终端功能对象。URL是客户端访问的页面地址。而在该URL地址返回的页面中，会有JS代码。在这些代码中，包含有调用本地客户端的JS代码。从而实现通过URL访问网页，点击网页上的功能来调用JS，实现调用本地终端对象。开发人员在开发网页时，通过JS脚本调用终端本地对象获取所需的数据与内容，从而实现网页与终端本地功能的结合。 

本发明封装了应用系统所需的基本终端本地功能，包括拍照、读取终端设备基本信息、拨打电话、发送短信、读写本地文件、定位、管理本地文件系统、音频文件播放和管理监测终端网络、显示进度对话框和提示框等。主界面打开时，将管理各种终端本地功能的对象注册到主界面中，终端本地对象与JS脚本进行绑定，为WebView控件的JS调用这些对象做好准备。当JS调用某个功能时，相应的本地功能对象会被调用，完成调用后再将得到的数据返回给JS。这样WebView控件的页面便能完成本地功能的调用。 

Webkit浏览器界面中还是用WebChromeClient和WebViewClient控件配合WebView控件完成相应的显示和操作功能。WebViewClient用来帮助WebView处理各种通知、请求事件，包括页面加载开始、页面加载完成、页面加载错误等消息。WebChromeClient用来辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等。两种组件各自负责各自的功能，并完成WebView运行时出现的各种状态的处理。这样，Webkit浏览器界面便能够访问并显示Web页面，控制管理本地资源。 

图3所示为本发明基于WebKit浏览器的客户端实现方法流程实施例，以Android SDK，JDK1.6和Eclipse等开发工具为基础，通过连接中国电信网络和各种Web应用系统，进行实际操作。操作和开发过程如下： 

在步骤301、点击进入主界面，从本地数据库中读取应用系统数据。 

在步骤302、如果本地数据库中没有应用系统数据，系统将自动切 换到新增应用系统页面中，提示用户新增应用系统，并将新增应用系统写入本地数据库。 

在步骤303、如果本地数据库中有应用系统数据，系统将进入应用系统列表界面，供用户选择相应的应用系统。在应用系统列表界面中，用户还可以进行应用系统列表的增加、删除、修改或查询操作，并更新本地数据库中的应用系统数据，如图3所示。 

在步骤304、用户选择某一应用系统，打开WebView控件，并加载该应用系统的URL页面，所述应用系统的JS脚本绑定终端本地对象。点击所述应用系统的URL，通过JS脚本调用终端本地对象，进行数据传递。 

Webkit浏览器界面通过WebView、WebViewClient和WebChromeClient的相互配合，完成Web页面的加载和显示、JS的调用、本地功能的调用和数据的传递。用户通过页面对各种数据进行操作和管理，并利用HTML的特点将数据与后台Web系统进行交互。其中，Webkit浏览器界面调用本地功能的示意图如图2所示。 

Webkit浏览器界面的菜单中，包含了“返回设置”，“重新加载”和“后退”等菜单项。“返回设置”菜单项将关闭主界面，返回到应用系统列表界面，让用户重新选择新的应用系统。当出现网络问题或者需要刷新页面时，“重新加载”菜单项使WebView控件重新加载原有URL。“后退”菜单项使WebView后退到前一个URL并进行访问和显示。Webkit浏览器界面完全通过HTML解析页面，并对用户的页面操作进行封装，有效提高了Webkit浏览器界面对用户的友好性。 

图4为本发明实施例示意图。在该实施例中，应用系统保存在网络侧，客户端所访问的内容完全来自于网络。在本发明中，应用系统也可以保存在手机终端侧，比如，将HTML的CRM等软件内容存放在手机侧，而这些本地的HTML向后台抓取数据，并完整显示出来。 

用户点击智能手机上的客户端按钮，打开客户端。如果用户第一次使用本客户端，客户端自动跳入到增加应用系统页面，提示用户输入需要访问的应用系统地址。当用户输入完成后，客户端自动切换到应用系 统列表页面，用户选择需要访问的应用系统并点击。客户端接收请求后，自动通过终端的数据网络访问指定的应用系统并在基于Webkit浏览器的界面显示返回的页面与数据。完成访问后，用户可以选择退回列表界面，重新选择新的应用系统并进行访问。本客户端通过列表管理页面，能够为用户提供多个应用系统的访问和管理。 

Web系统向移动终端迁移，开发者所需要做的唯一的工作是开发Web页面。这里的Web页面是各个应用系统的Webkit浏览器界面，与电脑浏览器中浏览的Web页面有一些小的区别。在进行Web系统向终端浏览器迁移的开发过程中，只需要对Web系统的页面进行CSS的布局调整以及添加调用终端本地功能的JS代码。首先，对Web系统的页面进行CSS调整，使其能够在手机屏幕中良好的显示，并使用户有良好的用户感知和用户操作效果。其次，按照系统的要求在各个Web页面添加终端本地功能的调用函数，调用JS的接口，使Web页面具有调用终端本地的功能并获取数据。能够快速进行Web系统向移动终端迁移的过程，大大缩短了开发时间和开发资本，提高了工作效率。 

本发明将Android平台客户端开发人员从繁重的软件开发工作中简化出来，使软件开发人员不再进行复杂的客户端代码开发，而是使其着重于HTML页面和CSS的工作，从而简化了基于Android平台的客户端开发过程，降低了Android客户端开发人员的技术门槛，提高了客户端软件的开发速度，极大地适应了单个Android智能客户端对接多个Web应用系统的快速开发和适配，提高Android平台客户端对接Web系统的速率，缩短Web系统向移动终端迁移的时间，为企业开发客户端节省了开发时间和人力资源成本。 

作为对详细描述的结论，应该注意本领域的技术人员将会很清楚可对优选实施例做出许多变化和修改，而实质上不脱离本发明的原理。这种变化和修改包含在所附权利要求书所述的本发明的范围之内。 

Claims (10)

1.基于WebKit浏览器的客户端实现方法，包括以下步骤：

点击进入主界面，从本地数据库中读取应用系统数据；

如果本地数据库中没有应用系统数据，切换到新增应用系统页面中，新增应用系统并将新增的应用系统写入本地数据库；

如果本地数据库中有应用系统数据，将进入应用系统列表界面选择应用系统；

加载已选择应用系统的URL页面，所述应用系统的JS脚本绑定终端本地对象；

点击所述应用系统的URL，通过JS脚本调用终端本地对象，进行数据传递。

2.根据权利要求1所述基于WebKit浏览器的客户端实现方法，进入应用系统列表界面，还包括以下步骤：

进行应用系统列表的增加、删除或修改操作，并更新本地数据库中的应用系统数据。

3.根据权利要求1或2所述基于WebKit浏览器的客户端实现方法，其中，所述应用系统保存在网络侧和/或手机终端侧。

4.根据权利要求1或2所述基于WebKit浏览器的客户端实现方法，其中，终端本地对象包括拍照、录音、定位、文件存储和读取、短信管理、电话管理、音频文件播放、监测终端网络或显示进度对话框。

5.基于WebKit浏览器的客户端，包括：

数据库，用于存储本地应用系统数据；

本地功能调用模块，在接收到Webkit浏览器的调用请求时，调用终端本地对象并向JS传递数据；

主界面，用于读取数据库已存储的本地应用系统数据，如果没有应用系统数据，切换到新增应用系统页面，新增应用系统并将新增的应用系统存储到数据库；如果有应用系统数据，进入应用系统列表界面；

Webkit浏览器界面，用于绑定应用系统的JS脚本与终端本地对象，用于从应用系统列表界面中选择应用系统，加载已选择应用系统的URL页面，点击所述应用系统的URL，通过JS脚本调用本地功能调用模块，接收其传送给JS脚本的数据。

6.根据权利要求5所述基于WebKit浏览器的客户端，包括：

主界面还增加、删除或修改应用系统列表，并更新数据库中的应用系统数据。

7.根据权利要求5或6所述基于WebKit浏览器的客户端，主界面包括：

ItemView控件，显示应用系统URL；

ListView控件，读取数据库已存储的本地应用系统数据，如果没有应用系统数据，切换到新增应用系统页面，新增应用系统并将新增的应用系统存储到数据库；如果有应用系统数据，进入应用系统列表界面。

8.根据权利要求5或6所述基于WebKit浏览器的客户端，Webkit浏览器界面包括：

WebChromeClient控件，辅助WebView控件处理JS的对话框；

WebViewClient控件，用于从应用系统列表界面中选择应用系统，加载已选择应用系统的URL页面；

WebView控件，用于绑定应用系统的JS脚本与终端本地对象，点击所述应用系统的URL，通过JS调用本地功能调用模块，接收其传送给JS的数据。

9.根据权利要求5或6所述基于WebKit浏览器的客户端，其中，所述应用系统保存在网络侧和/或手机终端侧。

10.根据权利要求5或6所述基于WebKit浏览器的客户端，其中，终端本地对象包括拍照、录音、定位、文件存储和读取、短信管理、电话管理、音频文件播放、监测终端网络或显示进度对话框。

Images