毕业设计-多类型互联网前端开发技术的研究与应用

1、盐城师范学院毕业设计毕业设计多类型互联网前端开发技术的研究与应用学生姓名 学 院 专 业 班 级 学 号 指导教师 年 月 日多类型互联网前端开发技术的研究与应用摘 要随着移动互联技术的快速发展，Web标准不断完善，用户对产品体验的要求日益攀升，导致Web应用交互日趋复杂。课题采用当今服务端最热门的Node.js技术，在保持了与传统技术相互兼容的前提下，Node.js采用了基于事件驱动的异步式I/O模型，结合Node.js的模块管理工具NPM,实现了在处理响应事件、多个并发请求上的突破，并保持了流动性的用户体验，对降低HTTP服务器的并发压力、提高吞吐量方面有着极其重要的作用。【关键词】Nod

2、e.js；异步式I/O；高并发；事件驱动； Design and development of universal salary management system oriented to AndroidAbstractWith the rapid development of mobile Internet technology, Web standards continue to improve, the users demand for product experience is increasing, resulting in Web application interaction i

3、s becoming increasingly complex. Topic by todays server the most popular node.js technology, while maintaining the premise of mutually compatible with traditional technology, node.js adopted based on event driven asynchronous I / O model, combined with node.js module management tool - NPM, the reali

4、zation of the response to the event, multiple concurrent requests on the breakthrough in the treatment, and to maintain the liquidity of the user experience, to reduce the concurrent pressure of the HTTP server, has an extremely important role to improve the throughput.Key words Node.js; Asynchronou

5、s I/O; High concurrency; Asynchronous I/O; Event driven;目 录TOC o 1-3 h u HYPERLINK l _Toc20608 1 绪论 4。第四：对前端人员Javascript技能要求更高，促使团队技能提升。但是，单页应用不利于SEO的优化，同时存在初次加载时间也相对较多，cookie的保存等问题。5.1 语音咨询请求服务5.1.1 语音咨询架构设计语音咨询业务提供用户在线下单服务，最核心的功能是当前消息的实时性分发，信息的推送使用融云提供的即时通讯云服务。当用户选择服务后(先付费或者后付费)，将当前订单推送到律师客户端，由律师抢

6、单完成后续服务。整体的架构主要分为三部分:第一：使用融云提供的推送服务，使相应的业务能够快速获得即时通讯的能力以及一些场景的需要。第二：基于Node.js内置的HTTP服务器，采用异步式的I/O操作，session 存储以及Node.js的数据库更新服务。第三：HTTP服务器接收到用户的请求后，服务器将会直接调用基于Node 的读取服务，从而进行下一步的任务。图5-1 语音咨询架构设计5.1.2 API接口封装表5-1用户登录接口接口名称用户登录接口接口格式http post接口描述用户登录接口urlhttp:/user/login表5-2请求消息字段名称必填说明phone手机号M+86中国大

7、陆verifyCode手机验证码M手机验证码表5-3响应消息字段名称必填说明Code响应结果Mok988-请求参数错误desp响应描述M描述tokentokenN登录信息表5-4产品详情接口接口名称产品详情接口接口格式http post接口描述产品详情接口urlhttp:/user/cardDetailInfo表5-5请求消息字段名称必填说明token登录信息M获取登录信息productId产品编号M产品ID表5-6响应消息字段名称必填说明Code响应结果Mok988-请求参数错误desp响应描述M描述tokentokenN登录信息5.1.3异步式I/O请求服务Var request = fu

8、nction(service, method, _args, callback)global.pool.acquire(function(err, connection) /从RPC连接线程池中获取活动连接（如果无活动连接，则返回新建立的连接） /处理RPC的请求参数 if(!_args) / 如果无参数则建立一个空数组 _args = ; /空数组 console.log(RPC TO + method + : + _args); /打印相应信息 _args.push(function(err, response) /在请求参数的最后加上回调方法 if(err) /等RPC异步请求返回之后执

9、行 console.log(err) var r = JSON.parse(response); /转为响应的json字符串 console.log(rpc response : + response); if(r.status & r.status.code != 1) /判断返回数据在业务层面的正确性 callback(r.status.desp, r); / 回调具体的业务回调逻辑处理函数 else callback(err, r); /执行错误回调函数 /取消连接，释放会连接池 global.pool.release(connection); ); if(_args) /请求RPC接口

10、 connection.clientservicemethod.apply(connection.clientservice,_args); else connection.clientservicemethod.apply(connection.clientservice); );module.exports = request;消息队列推送的实现：引入amqp模块，amqp模块遵循了AMQP 协议13，该消息队列服务器提供了Node下运行的的客户端环境。因此Node.js的 程序可以通过该模块连接并操作Redis消息队列；HTTP 服务器在接收到不同的请求之后，会根据路由规则做出不同的处理

11、，这些处理函数被封装在相应的回调函数中，只要匹配相应的路由关键字，该消息才会被添加到消息队列中。5.1.4 路由设计路由采用REST风格，Express支持REST风格的请求方式，同时Express是基于Node.js的非常优秀的服务端开发框架。通过URL指定资源，操作包括获取、创建、修改以及删除，与之对应的则是HTTP协议中的GET请求、POST请求、PUT请求以及DELETE请求。相关路由设计如下:表5-1 基于Express的路由设计语音咨询路由设计route.post(/ ,callback)首页route.get(/login, callback)登录route.get(/mqttC

12、ount, callback)连接融云服务route.get(/orderList, callback)语音咨询列表route.get(/orderServices, callback)单页应用订单页route.get(/orderDetails, callback)订单详细页route.get(/orderPay, callback)支付页面5.1.5 核心功能模块(1)登录模块loginNode端接口配置/login:title:用户登录接口, /登录接口名称 config:baseurl:API_URL, /登录接口url method:POST, /HTTP请求方式 command:u

13、ser/login, /url data:body, /请求体 encrypt:false, /是否加密传输,调用登录接口loginSubHttpService.post(/apiLogin?json=1, subData, function (data) if(pid = 0)location.href = _url; /登录判断跳转); 图5-2 登录界面以及登录验证功能描述: 用户输入手机号码作为通行证，获取手机短信验证码即可完成登录。(2)：提交用户身份信息模块orderCommissionNode端接口配置/checkPersonalInfo: title: 用户身份信息, /用户身

14、份接口名称 config: baseurl: API_URL, /用户身份接口url method: POST, /HTTP请求方式 command: user/modifyInfo,/url data: body, /HTTP请求体 encrypt: true /HTTP是否加密 ,PersonalInfoHttpService.post(/personalInfo?json=1, , function (data) console.log(data); /打印data数据 var _realUname = data.realName; /获取用户姓名 var _realIdedity =

15、data.cardId; /获取用户身份证图5-3 提交用户身份信息功能描述: 用户填写相应的身份信息以及服务详情，推送到律师端，由律师完成抢单服务。(3)：提交语音咨询单模块OrderList Node端接口配置/ placeOrder: title: 用户下单接口, /用户下单接口名称 config: baseurl: API_URL, /用户身份接口url method: POST, /HTTP请求方式 command: user/ placeOrder,/url data: body, /HTTP请求体 encrypt: true /HTTP是否加密httpService.post(/

16、orderList?json=1, productId:parentProductId,function(data) console.log(data); /打印data数据 var num = ductDetailList.length; /获取服务列表长度 $(.orderList).html().attr(productId,parentProductId);/设置相应产品productorId图5-4 语音咨询服务功能: 用户选择语音咨询服务类型，提交订单。律师端收到推送语音信息，给用户拨打语音电话，完成后续服务。 对于程序员来说，异步式的编程风格所带来的大量的回调嵌套所引发的所谓的“

17、回调地狱”,不但让编写的代码看起来臃肿难以阅读，同时，也会让项目更加难以维护。但是可以通过使用promise来解决上述的问题。$(.xx).animate(, function() $(xx).animate(xx,function() /执行指定动画,1000),1000)/使用promise解决上述回调的问题:function animate(dis,time) /定义动画函数 var def = $.Deferred();/定义def变量 $(.boll).animate( left: dis+px /执行动画 ,time, function() def.resolve(time); )

18、; return def; /返回变量$(.boll).on(click,function() $.when( animate(50,1000), /执行动画6 结论综上所述，虽然Node.js现在应用广泛，很多公司都是基于它进行前后端分离开发，但前端开发技术日新月异，必须及时做出突破。在接下来的时间里，希望Node.js能做到以下几个方面的突破或者创新:单线程异步式I/O是Node.js立家之本，但或许可以结合java I/O的多路复用的Reactor模式，将Proator和Reactor两者有机的结合，更好的提升系统吞吐量。图5-5加入Reactor模式的单线程异步式I/O模型目前，Nod

19、e.js更多依赖NPM，或许可以将这些集成到它的核心功能中，包括添加文件服务器。Node.js是单线程的，是否可以更好的利用目前服务器多核的优势，来提升HTTP服务器的并发性能。结束语通过此次的研究与测试，我对Node.js的异步式的I/O设计模型以及事件循环机制有了更为深刻的理解，也深刻体会了Node.js 技术在高并发Web 系统的中的应用，以及如何提升网站高并发处理能力。在这其中，我最要感谢的就是我的指导老师张辉老师，从开始的选题到确定研究方向，张辉老师不仅给了我技术上的指导，更是让我对前端这个行业有了一个清楚的认知，也重新定位了职业规划。此外，研究过程中张老师身上体现出的对技术的严谨，细致也让我学到了很多，这在我以后的成长道路上都是不可多得的财富。最后，我要感谢我的家人，在我大学期间的无私付出，他们的理解和支持是我求学道路上最大的动力，谢谢。参考文献BYVoid.郭家宝.Node.js开发指南 M.北京,人民邮电出版社2012,(7):11.Stevens. Fenner. Rudolf, UNIX network programming M北京,人民邮电出版社. 2009.贺琛，陈肇雄，黄河燕. Web缓存技术综述J.小型微型计算机系统，2013, 25(5): 836-842.Xiao-zhong Z.Web Caching Server Built on Mem