陈琦
摘要:微信小程序依托拥有巨大用户群的微信,极有可能成为继微信公众号之后又一个亮点,其特点为轻量、用户友好,文章通过使用微信小程序开发平台、Webpy+ApacheHTTPServer,介绍一种开发微信小程序的轻量级架构以及设计思路,以供开
发者参考。
关键词:微信小程序;Webpy;Apache HTTPServer;架构搭建
2016年9月2旧,微信小程序正式开启内测。2017年1月9日0点,微信第一批小程序正式上线,用户可以体验到各种各样小程序提供的服务[1]。2017年第一季度,腾讯公布的微信月活跃账户数达到9.38亿,比去年同期增长23%[2]。在一个相对巨大的用户群体上微信依然保持高速增长,其生命力非同一般。作为一种新兴事物,微信小程序依托拥有巨大用户群的微信,极有可能成为继微信公众号之后的又一个亮点。
微信小程序有别于普通APP最显著的一点是不用下载和安装,通过搜索或扫码即可进入小程序,那么这就要求小程序要尽量做到轻量级;微信小程序有别于微信公众号内应用的最显著特点是,小程序更接近于原生APP应用,而公众号应用就是网页Web程序,因此小程序在用户友好性上更胜一筹。
小程序,顾名思义,相对于一般APP而言体量较小,那么对于开发者而言一个快速而轻量级的开发架构就成了开发微信小程序的首选,本文介绍一种快速开发的架构及设计思路,以供参考。
1架构中主要框架的选择及介绍
在架构中,客户端框架(也称为前端框架)、服务器端框架(也称为后端框架)、以及服务器中间件的选择是关键,下面从这3个方面进行相应介绍。
1.1微信小程序前端框架
小程序前端开发框架是腾讯官方提供的小程序开发框架,要想让小程序可以在微信上使用,该前端框架为必选项。
该框架提供了自己的视图层描述标签语言(WeiXmMarkupLanguage)WXML和样式语言(WeiXmStyleSheets,WXSS)以及基于JavaScript的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,让开发者可以方便地聚焦于数据与逻辑上[3]。其中WXML是一种类似于Web开发中HTML的XML语言,用于组织页面结构;WXSS是一种近似于Web开发中CSS的样式表用于表述WXML的显示方式;其逻辑层使用JavaScript语言和Web开发中一致;其数据层可以认为集成于逻辑层的JavaSmpt中,每一个程序页面都有一个Page.data用于存放相关页面需要使用的数据。在使用过程中可以发现,虽然与Web开发中一样都是用JavaScript,但是两者之间也存在一定差异,例如:在Web开发中修改页面上数据,需要先找到HTML上的对应节点然后修改节点上的数据,而小程序中采取的方式是在WXML的节点上直接使用双括号绑定Page.data中的数据(形如{{some_data}}),修改Page.data中的数据时,页面显示内容实时变换。
1.2月良务器端开发框架:Webpy
微信小程序前端框架与后端服务器交互的协议主要使用安全超文本传输协议服务器(HyperTextTransportProtocolServer,HTTPS),而且前后端数据传输时主要使用JS0N,与Web开发中类似,那么可以选取的服务器端框架就有很多。JAVA,PHP,C#,Ruby,Python等很多开发语言都有相当成熟的Web开发框架,在众多框架中选择合适的框架并不简单,本文选择Webpy作为后端框架主要基于以下几点考量。
1.2.1足够轻量
Webpy是一个非常轻量且功能齐全的PythonWeb框架,最新版本0.38的源文件大小仅为1.1MB,而且Python属于Linux服务器原生支持语言,这样一个框架部署在Linux服务器上时,对服务器压力相对较小。
1.2.2可以很容易地让页面模板和后台服务器端程序解耦由于微信小程序的前端必须使用腾讯自己本身的框架,那么开发小程序的服务器端框架必然要求其模板语言相对独立,那么类似于PHP,ASP,JSP等技术就不利于小程序的开发,而Webpy的页面模板就相对独立,可以轻松地和服务器端解耦。
1.2.3够灵活
由于存在微信自身服务器和小程序服务器相互沟通的场景,以及考虑到小程序才刚刚起步,以后出现调整在所难免,那么一个相对灵活的后端框架,用于应付各种不同变化和需求就很必要。在这一点上,Webpy的核心路由表非常容易维护,便于修改,可以适用于各种场景。
1.3服务器中间件:ApacheHTTPServer
ApacheHTTPServer(简称Apache)是Apache软件基
金会的一个开放源码的网页服务器,可以在大多数计算机操作系统中运行,由于其多平台和安全性被广泛使用,是当前世界使用排名第一的Web服务器软件。其快速、可靠并且是一个模块化的服务器,可通过简单的API扩展,将Perl/Python等解释器编译到服务器中,可以运行在几乎所有广泛使用的计算机平台上,受到广泛认可[4]。
ApacheHTTPServer作为一款优良的Web服务器,其灵活性、稳定性均满足作为微信小程序后端服务器的需要,同时只需添加VntualHost(虚拟机)监听443端口,配置SSL相应设置,即可满足微信小程序使用HTTPS服务传输的需要。再者,由于后端框架选择了Webpy,ApacheHTTPServer对于Python语言的友好型,也成了被選择的原因之一。
2主要技术难点剖析
2.1服务器端与客户端资源分配的设计思路
对于拥有客户端和服务器端的程序来说,到底是重客户端(业务逻辑多在客户端进行处理)还是重服务器端(业务逻辑多在服务器端进行处理),都需要提前确定。按照常规浏览器/服务器(Browser/Server,B/S)架构的程序,一般是重服务器端,而客户端程序/服务器(CUent/Server,C/S)架构的程序一般是重客户端或者两者并重。而目前微信小程序,按照对“小程序”字面的含义,应当属于C/S架构,但其使用的技术,却大量参照了B/S架构Web开发的内容,例如:WXML参照HTML,WXSS参照CSS,JavaScript与Web开发几乎一样用于页面逻辑层的编写。经过一段时间的研究,本文认为微信小程序应当参照C/S架构程序的思路进行编写,原因如下:endprint
(1)微信小程序区别于微信公众号应用的最大特点就是其客户端友好性,如果采取轻客户端、重服务端的做法无疑会使小程序的优势被同样是新近兴起的H5开发所完全取代;
(2)微信小程序运行时以微信APP为依托,而微信在全球众多用户的手机上均表现良好,因此可以推断重客户端的微信小程序不会对用户使用的设备造成过大压力;
(3)重客户端的做法可以减少网络传输的次数,让使用无线网络的移动用户更少感觉到网络延时造成的卡顿。
由此本文给出开发微信小程序时一些建议:
(1)编写微信小程序时应当将业务逻辑写在客户端,服务器端重点作为存储数据、组织数据的数据层服务器;
(2)在进入微信小程序时,应当在加载时尽可能多地加载服务器端提供的JSON数据,以便在后续操作中无需二次加载,减少网络延时对用户造成的影响;
(3)在小程序操作過程中,仅在用户完成操作甚至退出小程序时,向服务器端提交同步数据,其他情况均在小程序的内存中处理数据,进一步减少小程序操作的响应时间。
2.2微信小程序与服务器间的交互认证
在使用微信小程序时,用户的身份认证是一个与其他程序开发很不同的地方,原因在于这里涉及了微信自己的服务器与小程序服务器端的交互。完成微信小程序身份认证的方式如下:(1)小程序调用wx.login()接口获取微信用户的code,并将code发送至小程序服务器;(2)小程序服务器将code与小程序唯一标示appid以及小程序秘钥AppSecret发送给微信服务器;(3)微信服务器根据获得数据将用户的唯一标识opemd发送给小程序服务器;(4)微信小程序服务器根据openid生成Session会话,并将Session发送给小程序客户端,此后小程序的客户端与服务器端的交互均以该会话进行。
2.3Webpy与ApacheHTTPServer之间的整合
Webpy与ApacheHTTPServer之间的整合可以通过ApacheHTTPServer的WSGI模块mod_wsgi进行。
在ApacheHTTPServer的配置文件HTTPd中添加语句:
(1)LoadModulewsgi_modulemodules/mod_wsgi.so#加载wsgi模块;
(2)WSGIScriptAlias/appname/var/www/Webpy-app/code.py/#为程序入口起别名。
其中code.py文件为Webpy的入口文件。
同时修改Webpy的code.py文件在文件最后添加如下语句即可:
application=Web.application(urls,globals()).wsgifunc()。
3结语
通过对微信小程序的研究及测试,本文提出了一种可以用于快速开发微信小程序的架构,并解决了架构中的技术难点,提供了相关开发思路,为想要进行微信小程序开发的技术人员提供了一定的参考。
[参考文献]
[1]百度百科.微信小程序[EB/OL].(2017-07-11)[2017-09-25].HTTPs://baike.baidu.com/item/-
[2]腾讯.腾讯公布2017年第一季度业绩[EB/OL].(2017-05-17)[2017-09-25].HTTPs://www.tencent.com/zh-cn/articles/8003431495014482.pdf.
[3]腾讯.微信公众平台-小程序-开发-框架[EB/OL].(2016-09-21)[2017-09-25].HTTPs://mp.weixin.qq.com/debug八vxadoc/dev/framework/MINA.html.
[4]百度百科.apache(Web服务器)[EB/OL].(2015-09-16)[2017-09-25].HTTPs://baike.baidu_com/item/apache/6265.endprint