数据方面硕士论文格式,关于基于WebSocket和SenchaTouch的移动Web应用设计与实现相关毕业论文题目范文

doc下载 >> 毕业论文 >> 论文格式 >>

这是一篇数据方面毕业论文题目范文,与基于WebSocket和SenchaTouch的移动Web应用设计与实现相关本科论文开题报告。是论文格式专业与数据及管理系统及数据库方面相关的免费优秀学术论文范文资料,可作为数据方面的大学硕士与本科毕业论文开题报告范文和职称论文论文写作参考文献下载。

摘 要 :移动Web应用迅猛发展,对系统的响应速度要求更高,同时要降低数据传输量,以便减少话费支出.传统的Web HTTP工作模式,由于在请求和响应中附加大量数据,难以满足移动用户需求.该文结合了移动Web框架Sencha Touch和WebSocket技术,设计实现了全新模式的移动Web应用,克服了普通Web的缺点,提升了系统的性能.

关 键 词 : Sencha Touch; WebSocket; Spring; Hibernate

中图分类号:TP393.09 文献标识码:A 文章编号:1009-3044(2014)05-0942-04

Mobile Web App Designing and Implementing Based on Sencha Touch and WebSocket

LV Hai-dong

(City Institute Dalian University of Technology, Dalian 116600, China)

Abstract: With the rapid development of mobile Web application, the response speed of the system requirements are higher, at the same time to reduce the amount of data transmission, in order to reduce the cost of expenditure. In traditional Web HTTP mode, due to additional amounts of data in the request and response, it is unable to meet the needs of mobile users. This paper bines the mobile Web framework Sencha Touch and WebSocket technology, design and implementation of mobile Web application of new mode, overes the drawbacks of conventional Web, improving system performance.

Key words: Sencha Touch; WebSocket; Spring; Hibernate

随着智能手机和平板电脑的普及,移动Web开发成为发展最快的领域,各种移动Web框架如雨后春笋层出不穷,Sencha Touch就是众多框架中的佼佼者.它是基于HTML 5的移动应用JavaScript框架,可以让Web 应用界面模拟原生应用.其具有优美用户界面组件和丰富的数据管理,完全使用标准HTML 5和CSS3,全面兼容Android,iOS及其他移动设备.Sencha Touch与其他移动框架比较,是个较重量级的移动Web应用框架,由于其对触摸屏丰富的UI设计,支持用户复杂交互,并使用纯JavaScript实现页面元素布局,因此适合用于开发业务逻辑比较复杂的移动Web应用,如交互较多的OA系统,ERP管理系统等.


如何写数据一篇论文
播放:34477次 评论:5757人

但在与服务器端的数据交互过程中,Sencha Touch依然使用传统的HTTP请求响应模式的AJAX技术,难以实现数据的快速响应和显示.由于每次AJAX的HTTP请求和响应中依然包含大量重复的头信息,致使数据传输量增加,不但降低应用的响应速度,而且会导致用户话费的损失以及手机电源的损耗.

HTML5的WebSocket规范的提出,将彻底取代现有的AJAX技术,抛弃了原有Web应用的请求/响应模式,取而代之的是客户和服务器的双向实时数据传输,极大提高了数据传输效率,使得移动Web应用可以与原生应用相媲美.该文结合Sench Touch和WebSocket开发出高效的Web应用系统,为突出重点,只重点介绍二者整合,即实现数据的实时查询和更新.

1.系统设计

此移动Web应用是将某中型电子产品销售企业的原有进销存Web应用扩展到移动终端,使得公司的业务人员可以随时随地进行业务处理,尤其是通过WebSocket技术,将所有数据实时推送到手机客户端,实现公司业务处理高效快捷.在开发过程中无论是数据输入和查询,都通过WebSocket实现客户端和服务器端的双向实时通讯.

系统依然采用传统的MVC模式,服务端采用JavaEE整合Hibernate4,Spring4,数据库采用MySQL5.5,Web服务器采用Sun GlassFish4.0.其中GlassFish4和Spring4都提供了WebSocket服务器的编程支持.客户端完全采用Sencha Touch2.3,由于其是基于HTML5 的JS框架,可以无缝集成WebSocket的异步编程模式.整个系统的总体架构参见图1所示.

服务器端由Hibernate担任持久层职责,实现数据的CRUD,Spring整合Hibernate实现Hibernate的包装和声明式事务处理,同时使用Spring实现WebSocket Server,负责客户端数据的接收和发送,当客户处于查询模式时,通过Spring 的Schedule模块定时读取业务数据,并实时推送到客户端Sencha Touch的DataView控件,实现查询数据的实时更新,不需要客户请求即可完成,实现全新模式的Web应用.

客户端完全采用Sencha Touch框架实现所有业务页面,使用基于EXTJS的MVC模式,通过编写Model类JS,控制类JS和视图view类JavaScript,实现单页面的移动Web应用.通过控制器类JavaScript,将Model类和View类整合起来,实现业务数据管理. 客户端和服务器端的数据传输全部采用JSON格式,无论客户发送的数据和命令,还是服务端接收和发送的数据,比XML格式具有更少的数据传输,能极大提高传输效率,改善系统的响应速度,提高用户的满意度.

2.系统编程实现

为节省篇幅,传统的Spring和Hibernate整合编程不做赘述,重点介绍使用WebSocket实现数据的传输.

2.1 WebSocket服务器实现

Spring4提供了WebSocket API的支持,使得编写WebSocket Server简单高效,服务器端处理WebSocket的发送和接收的编程非常方便,完全克服了使用JavaEE服务器内置的WebSocketServlet实现WebSocket Server的复杂性.编程时只要继承TextWebSocketHander父类,重写方法handerTextMessage即可,且自动工作在异步模式,得以实现数据的高速传输.使用Spring4实现的WebSocket Server代码参见如下代码示意:


本文地址:http://www.xianbear.com/geshi/423089.html

import .springframework.web.socket.WebSocketHandler;

import .springframework.web.socket.WebSocketSession;

import .springframework.web.socket.TextMessage;

//定义库存业务处理的Socket Server处理类

public class StockBusinessHandler extends TextWebSocketHandler {

private IStockBusiness stockBusiness等于null; //依赖注入库存业务处理类负责数据的DB读写

public EchoEndpoint(IStockBusiness stockBusiness) {

this.stockBusiness 等于 stockBusiness; }

@Override //Socket请求处理方法

public void handleTextMessage(WebSocketSession session, TextMessage message) {

//接收请求命令和参数

String jsonmand等于message.getPayload();

//调用业务方法取得查询数据,业务方法内解析JSON格式的命令和参数,使用HibernateTemplate对象完成数据的增加,修改,删除和查询.

String jsonData等于stockBusiness.getData(jsonmand);

//发送查询数据到WebSocket客户端,查询数据以JSON格式封装

TextMessage message等于new TextMessage(jsondata);

session.sendMessage(message);

}

}

编好后的WebSocket Server类可以通过Spring的XML配置文件方式,生成WebSocket需要的URL请求地址,配置的示意代码如下所示.

xmlns:xsi等于"http://.w3./2001/XMLSchema-instance"

xmlns:websocket等于"http://.springframework./schema/websocket"">

实际项目中配置了多个Socket Server Hander类用于处理不同模块的数据管理和查询.

2.2 客户端编程

移动客户端使用Sencha Touch的MVC编程模式,分别为每个业务模块定义Model,Controller,View和DataStore JavaScript文件,整个项目只需要一个主启动页面即可,所有的业务页面完全使用Sencha Touch的JS代码实现,具体MVC编程可参见Sencha网站,在此不再赘述.

Sencha Touch中由控制器类负责页面的显示,事件的处理以及不同View对象的载入和销毁,进而实现页面的切换.如下示意代码是产品库存管理控制器类,当控制器类载入时,自动显示产品库存列表页面View对象,当页面载入进DOM后,自动启动函数showPanel,实现页面数据的载入和处理.本案例中会自动发起WebSocket连接,请求服务器发送默认的产品库存信息,当页面中做进一步检索操作后,会再次使用当前WebSocket连接,发送新的参数,请求服务器发送新的查询结果.

Ext.define('erp.controller.inventory.Product',{ extend:'Ext.app.Controller',

views: ['erp.view.inventory.Product'],

init:function()

{

this.control({

'viewport>panel':{

render:this.showPanel

}

});

},

showPanel:function()

{ //定义产品库存显示页面初始化事件

//WebSocket服务器URL地址,注意协议使用的是ws,而不是http

var url 等于 "ws://210.30.108.30:8080//inventory/stock ";

var w 等于 new WebSocket(url);

//监听连接建立事件

w.onopen 等于 function() { alert("WS OPEN");};

//监听服务器数据到达事件,数据由服务器推送到客户端

w.onmessage 等于 function(data) {

//取得服务器发送的JSON数据,直接赋予页面的Store对象的data属性,

//由Sencha Touch自动更新View的DataView控件显示

this.view.store.data等于data;

};

//连接断开事件

w.onclose 等于 function(e) { 连接断开处理代码 };

//连接异常事件

w.onerror 等于 function(e) { 异常处理代码 };

//客户端向服务器端发送处理请求,要求显示所有的产品库存列表.

w.send({module:"stock",mand:"list",scope:"all"});

}

});

上面的控制器类需要定义如下JavaScript类,首先是表达产品的Model类,示意代码如下.

Ext.define('erp.model.inventory.stock.Product', {

extend: 'Ext.data.Model',

fields: [

{ name: 'id', type: 'int' },

{ name: 'name', type: 'string' },

{ name: 'unitprice', type: float' },

{ name: 'stockqty', type: float' }

]

});

在Model类基础上,定义产品读取的数据仓库类Srore,由Store负责读取服务器的数据,发送到View中的DateView控件上,传统的方式是通过AJAX Proxy的HTTP请求,发起向服务器的请求,由服务器响应发回JSON数据.在本文的新模式中,Store不再发送AJAX请求,而是服务器通过WebSocket将数据推送到客户端,客户端接收到数据后,直接将数据设置到Store的data属性,实现Store的数据更新,Sench Touch监测Store变化自动更新DataView的数据显示,实现了全新模式的Web应用.产品检索的Store定义示意代码如下:

Ext.define('erp.store.inventory.Product', {

extend:'Ext.data.Store',

model: 'erp.model.inventory.Product',

autoLoad: true

关于基于WebSocket和SenchaTouch的移动Web应用设计与实现的毕业论文题目范文
数据方面论文范文例文
});

最后定义显示产品库存的View类,示意代码如下:

Ext.define('erp.view.inventory.Product', {

extend:'Ext.panel',

docked:'top',

layout:'hbox',

items:[

{baseCls:'title',:'产品名称'},

{baseCls:'title',:'库存'},

{

xtype:'dataview',

fullscreen:true,

store:'erp.store.inventory.Product',

基于WebSocket和SenchaTouch的移动Web应用设计与实现参考属性评定
有关论文范文主题研究: 关于数据的论文范文检索 大学生适用: 本科毕业论文、在职研究生论文
相关参考文献下载数量: 26 写作解决问题: 学术论文怎么写
毕业论文开题报告: 论文任务书、论文题目 职称论文适用: 职称评定、高级职称
所属大学生专业类别: 学术论文怎么写 论文题目推荐度: 优秀选题

baseCls:'erp.model.inventory.Product',

itemTpl:'{name}

免费论文参考文献:

Web设计论文
[10]吕华盛.学生管理系统的设计与实现[d].辽宁:大连职业技术学院,2016,(65),[11]吕金龙,史景钊,王万章,叶芳,李冠峰.基于Web与sms的毕业设计论文管。论文设。

Web程序设计论文
取(datareader方式).,传统的应用程序是通过先建立到数据库的连接,在程序的整个运行过程中维护连接的方式来设计的.asp.采取了断开连接方式的数据结构.当浏览器向Web服务器。

基于Web特色数据库文检索系统的研发
#30340;效果返回给用户.四、系统结构本系统主要分为用户界面和管理员界面,具体结构如图1所示:图1系统模块流程图五、设计与实现使用asp技术进行开。

计算机网络与应用
用与网络技术专。计算机网络工程证书统软硬件安装,调试和维护能力;,⑵具有熟练使用计算机基本系统软件,常用应用软件的能力;,⑶具有计算机网络系统规划设计,安装调试,维护管理与应用开。

计算机应用与维护
学计算机基础"课程的前身是"计算机文化基础"课程,由于"计算机文化基础"课。学校计算机机房的维护2网络应用与Web智能唐雁,教授,张虹,副教授,邹显春,副教授,尹世群,副教授同。

计算机应用与研究
见,。计算机在环境科学中的应用究,(高职高专计算机类专业一体化课程及项目实训体系的建设与应用研究,(基于工作过程导向的课程开发研究,(高职高专xx专业教育改革研究,(高职高专xx专。

计算机技术与应用
及应用⑻辐照技术研究与应用⑼核电子学与核探测技术⑽同步辐射实验技术及应用⑾精密机械工程计算机科。计算机科学与技术学院一新技术的应用基础知识,增强dsp应用系统相关软,硬件设计和调。

计算机应用毕业设计
机毕业设计论文题目广西医用电气学院计算机应用专业2016届毕业设计中期检查通报,为加强对毕业论文(设计)工作的过程管理与质量监督,保证毕业论文(设计)质量,根据2016届毕业论文(设。

计算机软件与应用
下(1980年1月1日以后出生)具。大学生计算机论文软件在学科:计算机软件与理论2016.12武汉大学博士3,目前研究领域:人工智能,计算机软件与理论,计算机应用,遗传程序设计4,已完。

计算机应用与管理论文
"基于应用模板仓库的电子商务系统开发平台的设计与实现",《计算机应用》,2004年第6期,2004年6月,[2]"ane-busine。

【word版本】下载数据方面硕士论文格式,关于基于WebSocket和SenchaTouch的移动Web应用设计与实现相关毕业论文题目范文
小熊毕业论文网 http://www.xianbear.com 最具影响的优秀论文网站之一,为你提供关于写作方面的相关经典的论文范文参考包括本科毕业论文范文