【《基于HTML5微信公众号的设计与实现》7500字（论文）】.docx

《【《基于HTML5微信公众号的设计与实现》7500字（论文）】.docx》由会员分享，可在线阅读，更多相关《【《基于HTML5微信公众号的设计与实现》7500字（论文）】.docx（10页珍藏版）》请在优知文库上搜索。

1、基于HTM1.5微信公众号的设计与实现摘要：随着4G网络的大规模应用，移动互联时代的到来改变了人们的上网方式。传统的网站在移动端的不便利性也越来越明显，新一代的万维网核心语言HTM1.5,实现了新的超文本标记语言，可以多设备的跨平台使用，加上目前国内智能手机的迅速普及和政府对于4G网络的大力推广，也为HTM1.5在国内开发者的使用上提供了一个良好的发展环境。微信公众号利用HTM1.5的新技术特性来开发具有很好的实践意义，今后随着移动互联网技术的不断发展，能够开发出用户体验更好和客户端安全性更高的微网站。关键词：微信公众号；HTM1.5;移动互联网目录1Vts211tf212HTM1.5j)I2

2、121I彳/31.2.2Drag&Drop直接拖拽功能31.2.3CarlVaS31.2.4Audio/Video标签32.茁i32.1数据通信子系统42. 2消息处理模块库42. 3粉丝行为收集子系统43. S11-53. 1HTM1.5推客户而设十.53. 2消息处理模块库的设计53. 3微站可视化编辑子系统的设计63. 4数据通信子系统的设计741通信录树状结构实现84. 295. 3II*生91 .绪论1.1 研究背景及意义微信公共平台于2012年8月23日正式上线，这是基于微信的一个附加功能，任何组织或个人均可免费申请微信公众帐号。获得帐号后可通过后台编辑文字、图片、语音、视频等信息

3、，并群发给关注该帐号的用户，但每天仅可群发一次。同样地，用户主动给微信公众平台发送文字、图片、语音、视频等信息，公众平台可以根据预先设定好的规则，自动反馈相应的信息给用户支基于HTM1.5微信公众平台，丰富了原有编辑平台的功能，可以使接入公众账号瞬间拥有十分强大的功能。基于HTM1.5的微信公众平台设计与实现的意义在于以下几个方面：一是对于微信公众账号的运营者。对那些不懂计算机程序技术的运营者可以建立属于自己的程序接口，让他们通过简单的配置，即可拥有强大而又个性化的微信公众平台管理系统。使运营者可以专注于内容的运营，而不被如何呈现内容的方式而分心。相反地，该HTM1.5还可以辅助运营者，以更佳

4、的方式方法呈现运营者发布的内容，用一些程序小工具维系订阅用户的粘度。另一方面，对于微信公众账号的订阅者。通过关注接入了微信公众平台HTM1.5的公众号，可以获得比一般公众账号更多的功能，诸如天气查询、列车查询、微网站等。可以使得用户对这样的公众账号有着更好的用户体验，使用户更加乐于使用这们的公众账号。再者，对于微信公众平台本身来说，开发这样的HTM1.5,丰富和加强了微信公众平台本身的功能,扩展了微信公众平台的生态链。从另一个角度来看，也可以促进微信公众平台自身功能的扩展。1.2 HTM1.5简介HTM1.5取代了HTM1.4.0和XHTM1.l.0标准，是更为适应互联网近几年飞速发展的需要的

5、技术。HTM1.5的技术开发主要包括HTM1.5、JavaScript和CSS3.0技术，也就是说HTM1.5标准包含了以上者三种技术。它能够有效简化浏览器处理由不同公司研发的富互联网应用程序方式(如AdobeFlashyMicrosoftSilVerIight)的解析过程。新版本的HTM1.搭载了新的网页元素、行为与属性，主要为以浏览器为基础的互联网新体验模式，例如使用VIDEO)标签和AUDIO标签，不需要安装插件就能在浏览器中浏览多媒体内容；同时HTM1.5也摒弃了HTM1.4标准中的部分内容，如font标签，这部分功能由CSS3.0代替。除此之外，HTM1.5标准还支持富互联网应用程序

6、的开发，比如及时二维绘图、本地离线存储、控件拖拽和历史记录功能等。HTM1.5不仅仅是HTM1.4版本的全面升级，更是20年来互联网技术的一次巨大飞跃。它使Web应用更加成熟化、平台化，潜移默化中改变着互联网的使用模式。林江，俞宙，肖然.基于HTM1.5打造广东天气微信微门户几广东气象，2014,03:71-73.林江,俞宙,肖然.基于HTM1.5打造广东天气微信微门户川.广东气象，2014,03:71-73.我的工作运用了HTM1.5的文件缓存、网页内拖拽、地理信息共享、Canvas图形绘制等相关技术。下面对这些技术的应用进行相关介绍。1.2.1 文件缓存文件缓存功能能够为用户储存浏览器中的

7、浏览资料，使其在断网或离线的情况下仍然能够正常浏览网页。对于移动产品特别是iPad平板电脑上的网页应用程序的开发来说这项技术特别重要。在产品演示系统的开发中，真用户在移动平台上使用产品演示系统时经常出现的网络不通畅、掉线和用户的误操作等突发状况,这些不能由传统HTM1.静态网页解决。但是我们利用HTM1.5的文件缓存功能，能够在任何临时情况下使用产品演示系统，通过浏览器缓存浏览演示Demo,实现用户实现无障碍浏览。1.2.2 Drag&Drop直接拖拽功能HTM1.5新增了DragStart和DragEnd事件，能够实现开发者在网页中的拖拽事件功能，此外，通过拖拽事件，用户能够把本地文件拖拽入

8、网页中。最初，这项技术是针对在桌面上进行的鼠标操作而设计的。但是其本身却不能在iPad中运用，为了实现用手指随意移动拖拽网页内控件的功能，同时现有的资源库中缺少能够同时兼容iPad和鼠标操作的类。我们在产品演示系统中增加了OnTouchEvent等支持捕获手指位置及状态的类的程序编写，并且做到了桌面上进行鼠标操作的兼容支持。这项新增功能便于用户实现的演示Demo中对于视频、音频的处理操作。1.2.3Canvas图形绘制使用Canvas标签不仅能轻松实现网页的控制或修改图像，也给网页中的动画开发提供了条件。这种操作方法是以像素为基础的，配合JaVaSCriPt代码，不需要安装任何插件即可达到当前

9、仅在FlaSh或SiIVerlight中才能实现的效果。在产品演示系统中，Canvas标签是不可或缺的工具，它能够实现在不同场景间演示DCmO的模拟和扩展，比如显示动画、创建复杂控件等。比如说，我们在iPad平板电脑中利用Canvas画布实现了CoverFlow效果的模拟，而现有的大部分CoverFlow模拟程序都是以Flash技术为基础的，而这一类的控件无法在IPad平板电脑中使用。此外，本课题还通过CanVaS技术对网页内多媒体播放进行多元化效果控制，一个创新的、动态的演示系统能够有效吸引用户使用产品演示系统，因此在对于升级与开发产品演示系统的时候，Canvas技术可以用来解决更为复杂的应

10、用问题。1.2.4Audio/Video标签在HTM1.5网页中只需要加入AUDIO/标签并使用JaVaSeriPt代码开发操作面板就能够在网页中灵活播放多媒体，而无需安装插件播放音频或视频多媒体文件，而同时利用CanVaS技术对多媒体文件进行效果控制。因为公司很多宣传靠视频手段，所以在产品演示系统的演示Demo场景中也存在大量用于用户租住浏览的视频文件。通过同时使用这两个标签，使在iPadSafari中直接浏览视频成为了可能，而无需再在系统升级时安装浏览器插件。此外，我们利用Audio标签研制了嵌入演示Demo中的语音向导模块，这不仅引起了潜在用户群对于产品演示系统的兴趣、同时也使演示Dem

11、O所要表现的内容更为清晰。可以说，如果没有这两项功能，就无法实现在iPad上开发产品演示系统。2.需求分析本系统程序在.DIETFramework4.0框架下开发，数据库采用SQ1.Server2005,使用C#编程语言，页而依照HTM1.5标准开发设计，并将客户端绑定到学校的微信公众平台，学员通过手机访问应用程序。2.1数据通信子系统数据通信子系统是本文所开发的基于微信公众平台的自助管理的基础。用户对系统进行授权，即输入微信公众帐号的用户名和密码，数据通信子系统能够获取到微信公众帐号的信息，包括二维码、头像、帐号属性等，如果帐号为服务号，还能获取到它的自定义菜单列表。其次，数据通信子系统应还

12、具备微信后台数据的解析和系统用户数据的封装的功能。通过消息路由，即粉丝用户经公众平台发送内容至本系统，本系统查找对应的规则记录，并将消息分配至合适的模块处理的过程，用户可以实现绑定公众帐号，并且能够在微信后台、公众帐号和公众帐号粉丝之间的通信。2.2消息处理模块库系统通过功能模块使得用户使得用户不需要通过编码，只需要对消息处理模块进行简单的规则编辑操作就可以构建一个功能完整的微信公众账号后台。通过对微信公众平台的功能使用情况进行分析，将系统的功能性需求进行归纳和分类,最终确定本文需要开发的消息处理模块类型。如对访客消息的自动回复，包括基本文字、混合图文和语音回复等。表3-3列出本文开发的微信公

13、众号信息服务平台的部分关键模块。每一个模块都对应处理不同的消息事件类型。表3.3系统模块库模块名称模块功能基本文字回史问答的简单对话，当访客的对话语句中包含指定的关键字，或者对话语句完全等于特定关健字，或者符合某种格式时，系统自动应答设定好的回亚内容。基本混合图文回亚动的媒体内容，当访客的对话语句中包含指定关键字，或对话语句完全等于特定的关健字，或符合某些特定的格式时，系统白动应答设定好的图文PI复内容。基本语音回亚在回复规则中平那个可选择具有语音、音乐等音频类的回亚内容，并根据用户所设置的特定关键字精准的返回给粉丝，实现一问一答的简答对话。自定义接口回复对接整合。粉丝管理心，提供粉丝的常用个

14、人资料管理。微信墙在大型活动中，场内所有微信用户都可以参与到活动中来，他们发送到公众帐号的消息内容都可以同步到大屏幕上，打破微信消息只对好友可见的约束。2. 3粉丝行为收集子系统为了更好的了解到粉丝，应将有意义的粉丝行为数据收集起来。本文所设计的系统收集的粉丝行为数据主要有两点：谢远超.微信公众号信息服务平台的设计与实现【3.中山大学，2014.1 .粉丝个人信息的统计，包括粉丝的姓名，昵称，生日和所在城市等信息；2 .是粉丝与公众帐号后台发生的交互数据，包括聊天记录，规则触发率和关键字使用率。对于规则触发率和关键词使用率因提供直观的折线图，来清晰的表示每一个规则和关键字的使用率走势。3.系统设计3. 1HTM1.5推送客户端设计经过之前的设计与实现，HTM1.S推送客户端可以通过PhoneGap中间件及安卓插件完成跨平台安装与运行。HTM1.S推送客户端的实现可以细化为连接服务器、同步推送类型、设备控制、消息接收和消息呈现五大块。推送客户端连接服务器功能实现时，通过监听页面上对连接按钮的点击监听事件，然后新建一个WebSocket对象，连接url的协议类型使用ws或wss协议，形式如ws:/10.108.165.254:8080PushServerreg的形式。这个对象成功创建