小程序开发研究
第11期2018年6月No.11June，2018
官方给出的小程序的解释是：“小程序是不需要下载安装便可以使用的应用，它实现了应用触手可及的梦想，用户扫一扫或搜一下即可打开应用，也体现了用完即走的理念，用户不用关心是否安装太多应用的问题，应用
将无处不在，随时可用，但又无需安装卸载。”[1]
小程序自2017年1月9日正式上线以来，就引起广泛关注。团队也不停地对小程序进行更新。小程序的优势十分明显，小程序触及了PC 网页，，H5，APP 无法触及的地方，其无需安装，用完即走的理念能够满足用户需求且节省手机内存。站在小程序的拥有者的立场，其开发成本大大减小，同时可借助强大的流量入口，因而也降低了推广的难度。总的来说，小程序是一种全新的方式，能够更好地在用户和服务中建立连接，并且可以在中便捷地获取和传播，具有不错的使用体验。1    小程序开发前准备
小程序采用了类似React Native 和Weex 一样的解析技术，开发者可以编写一套程序在多种客户端运行，同时，相比于、微商城具有更好的原生体验。全面开放申请以后，作为企业、政府、媒体、其他组织或者个人的开发者，都可以申请并注册小程序。小程序和的、服务号以及企业号是并行的体系，具有独立的注册以及发布流程。1.1  小程序接入流程：
小程序的接入主要有4个步骤。（1）小程序注册：在公众平台首页（m p.weixin.qq ）注册并提交注册信息、完善主体信息和管理员信息。
（2）完善小程序信息：完善小程序的基本信息如名称、头像及服务范围等。开发前需绑定开发者并获取APP ID ，以保证程序可以通过手机进行扫码测试。
（3）开发小程序：下载安装开发者工具，官方提供了一套完整的开发框架，开发者可以根据开发文档进行小程序的开发与调试。
（4）代码审核及发布：小程序开发完成后，不能够直接发布，需提交代码与开发配置信息提交审核，完成后尚可发布。
1.2  Web 开发者工具
官方公布的开发工具名为Web 开发者工具，小程序前端开发框架是官方提供的框架。Web 开发工具是一种基于Native System 系统层的框架，由于并不是运行在浏览器中，所以JavaScript 在Web 中的一些诸如Document ，Window 等方法均不可使用，以往HTML5在加载的时候在网络环境会有所限制，需要逐步加载HTML ，CSS ，JS ，然后返回数据，最后渲染页面展现在浏览器中[2]。用户总是需要等待很久，这样使得用户体验感大大降低。相比之下，小程序的两个线程：
Appservice Thread 和View Thread 会同时进行、并行加载，甚至Appservice Thread 会更早执行，当视图线程加载完，通知Appservice ，Appservice 会把准备好的数据用setData 的方法返回给视图线程。小程序的这种优化策略，可以减少用户的等待时间，加快小程序的响应速度。
Web 开发者工具区别于H5的开发工具+浏览器Device Mode 预览的模式，而是基于自己的开发者工具，可以实现同步本地文件+开发调试+编译预览+上传+发布等一整套流程。同时小程序自己开发了一套WXML 标签语言和WXSS 样式语言，并非直接使用标准的HTML5+CSS3。同时提供了很多原生APP 的组件，之前在HTML5中需要模拟才能实现的功能，在小程序中可以直接调用组件来实现。2    结构及其核心技术2.1  框架
2.1.1  小程序的文件结构
使用Web 开发工具新建一个项目，框架会自动生成描述整体程序的APP 和多个描述页面的page 文件。完整的小程序主要组成有：
一个入口文件：app.js  一个全局样式：app.wxss  一个全局配置：app.json
在页面pages 下将页面安装文件夹划分，每个页面存在4个文件 ，分别是：
视图层：wxml 文件、wxss 文件； 逻辑层：js 文件、json 文件（页面配置，不是必须）。
基金项目：咸阳师范学院创新创业科研训练项目；项目编号：2017104。
作者简介：武思怡（1997— ），女，陕西咸阳人，本科生；研究方向：软件工程，小程序开发。
武思怡，解    佺，张    雨，侯秉昀
（咸阳师范学院 计算机学院，陕西  咸阳  712000）
摘  要：文章从开发者的角度对小程序开发过程进行了简单说明，从环境与框架、组件、API 等方面进行了比较全面的分析，介
绍了小程序开发中的几个关键点，并对小程序的生存现状和未来发展趋势进行了分析。关键词：小程序；框架；API 无线互联科技
Wireless Internet Technology
小程序开发研究
（1）app.js是控制小程序逻辑的脚本文件，app.json是小程序的配置文件，负责对小程序的全局配置。app.wxss是全局样式表，作用范围是项目的每一个页面。
（2）wxml是一种类似xml格式的语言，具有数据绑定、条件渲染、列表渲染、自定义模板、事件回调和外部引用等功能。page.wxml主要通过使用基础组件构建页面结构。
wxss和css格式的语言有相同之处，用于描述wxml的组件样式，page.wxss的优先级比app.json的Window高。同时，为小程序新增了尺寸单位rpx，rpx可以根据屏幕宽度进行自适应，rpx实际上就是系统级的rem（把页面按比例分割750份，1rpx=innerWidth/750）。
page.json可以对独立定义的页面进行一些属性的设置，以满足实际需要。config.json可以设置一些个性化配置，当重新安装工具或者换一台电脑时，只要导入相同的代码包，开发工具就会自动恢复到开发这个项目时的个性化设置。
JS文件主要用于用户交互、响应用户点击等。在小程序中，通过JS脚本来响应用户操作。
2.1.2  了解小程序框架
小程序的开发是基于框架的，从软件设计角度来说，框架是一个可复用的软件架构解决方案，规定了应用的体系结构，阐明软件体系结构中各层次间及其层次内部各组件间的毅力关系，责任分配和控制流程，表现为一组接口、抽象类以及实例间协作的方法，是指对某一指定应用领域中的应用系统的部分设计与实现子系统的整体结构[3]。
小程序开发框架的核心是一个响应的数据绑定系统。分为视图层（View）和逻辑层（APP Service），小程序开发工具提供了视图层描述语言WXML和WXSS，以及基于JavaScript的逻辑层框架，并在视图层与逻辑层间设置了数据传输和事件系统，使得开发者能够很简单地将重心放在数据与逻辑上。处理事务逻辑的地方被称为逻辑层。在小程序中，所有.js脚本文件的集合构成逻辑层。逻辑层与视图层相互配合，完成数据处理及接收事件反馈。框架的视图层由WXML与WXSS编写，通过组件进行展现。对于小程序本身，.wxml文件与.wxss文件的集合构成了视图层，逻辑层处理数据之后，会发送给视图层用于与用户的交互，同时接收用户对视图层的反馈。视图层以给定的样式展现数据并反馈事件给逻辑层，数据展现是通过组件来进行的。视图的基本构成是组件。
2.2  相关组件
提供了一系列基本组件，可以通过使用这些基本组件组合形成来进行小程序的开发。这里说明几个比较有特点的组件。
（1）<view/>和html5中的<div/>类似，是布局中最基本的一个组件，任何一种复杂的布局都可以通过嵌套<view/>组件来实现，<view/>是一个块级容器组件，默认display：block，它是盒模型，在布局过程中一般推荐display:flex的写法。
（2）<textarea/>是多行输入框，与HTML中不同的是，它的值需要赋值给value属性，而不是被标签
包裹，是一个自闭合标签，css动画对<textarea/>组件无效。
（3）<navigator/>是页面链接，和HTML中超链接标签<a/>一样，主要进行页面跳转控制。链接的内容可以是一个字、词或者一幅图片，通过点击内容实现页面的跳转。
（4）<canvas/>主要用于绘制图形，其本身是一块无透明区域，并没有绘制的能力，仅仅是图形容器，需要调节相关的应用程序编程接口（Application Programming Interface，API）来完成实际的绘图任务。
2.3  API及其配置
2.3.1  域名配置
根据小程序提供的组件，开发者可以根据需要设计UI 界面，然而小程序的一些功能就要依赖框架提供的API来实现。在使用API时，首先要对小程序进行服务器域名的配置，每个小程序都需要设定通信的域名，小程序可以跟指定的域名进行网络通信。目前支持的有HTTPS（request）、上传文件（uploadFile）、下载文件（downloadFile）和WebSocket通信。
2.3.2  常用API
（1）wx.request(Object)：实现小程序与开发者的服务器实现数据交互。request方法的作用是发起HTTPS请求，在小程序中，只能使用HTTPS请求而不能使用HTTP请求，一个小程序同时只能有5个网络请求连接。
（2）WebSocket：request方法是通过客户端主动向服务器发起请求，而服务器端响应返回数据来实现通信的目的。这种方法存在缺点，那就是服务器不能主动向客户端发送消息。因此要实现服务器和客户端之间的即时通信只能采用轮询的方法，而且request的Header是十分长的，为了传输一个很小的数据会占用很多的宽带。针对这种情况，开发者可以通过小程序提供的WebSocket相关API创建WebSocket，WebSocket只需要服务器和浏览器通过HTTP协议进行一个握手的动作后单独建立一条传输控制协议（Transmission Control Protocol，TCP）的通信通道就可以进行数据的传送，实现长连接以达到通信的目的。
3    项目发布
3.1  发布流程
项目开发完成后，管理员需手动打包上传代码，填写相关配置类目并将代码提交审核，若第一次审核未通过，再次提交审核将开放提供测试的入口，该入口由开发者提供，用于审核人员审核小程序时登录。审核后手动发布即可。
3.2  上传原理
管理员手动将代码打包上传是怎样实现的呢？编辑器本身是基于Web技术体系实现的。简单是说就是node+webkit，node提供给我们本地api的能力，而webkit提供给我们Web 的能力，两者结合之后便可以使用JS+HTML实现本地应用程序。既然有nodejs，那打包选项里的功能就好实现了。其中 ES6转ES5就是引入babel-core的node包，CSS补全是引入postcss和autoprefixer的node包，代码压缩则是引入uglifyjs的node包。
[参考文献]
[1]刘红卫.小程序应用探析[J].无线互联科技，2016（23）：11-12，40.
[2]陈琦.基于Webpy+Apache HTTP Server 的小程序架构搭建研究[J].无线互联科技，2017（18）：50-51.
[3]百度百科.框架[EB/OL].（2018-03-15）[2018-04-24].baike.baidu/item/%E6%A1%86%E6%9E%B6/1212667?fr=aladdin.[4]刘玉佳.“小程序”开发的系统实现及前景分析[J].信息通信，2017（1）：260-261.
Study on the development of WeChat applets
Wu Siyi, Xie Quan, Zhang Yu, Hou Bingyun
（School of Computing, Xianyang Normal University, Xianyang 712000, China ）
Abstract：
A simple explanation of the development process of a applet from the perspective of the developer, comprehensive analysis of the environment, the framework, the components, the API, and so on, some key points in the development of applet is introduced, and analyzes the current status of existence and future development trend of the applet.Key words：
WeChat applets; frame; API 4    结语
小程序站在月活跃用户9亿人次的的肩膀上，自带流量趋势，入口多，功能简单便捷[4]。小程序功能快速迭代，意味着围绕小程序的开发和生态工具建设将会是移动互联网的一个巨大机会。目前各行业内诸多企业单位纷纷加入了小程序开发，开通了小程序功能。虽然前段时间不少声音都不看好小程序，但小程序进行优化后，开放了很多入口，使
企业号申请得开发者和用户关注度不断提升。纵使一些高频和复杂应用暂时无法被小程序取代，但是一些低频应用的主要功能，只要能在小程序上实现，APP 就可以完全卸载了。
总的来说，小程序目前发展空间甚好，至于以后未来的发展仍旧不能够准确预测。
Design of PC control software underwater vehicle
detection in hydropower plant based on LabView
Zeng Guangyi 1, Gong Yu 1, Wang Wenhui 1, Zhang Xiankui 2*, Qin Dan 2
（1.China Southern Power Grid Co., Ltd. Peak-shaving FM Generation Co., Ltd., Guangzhou 510630, China ;
2.China Shipbuilding heavy Industry Corporation 750 Test ground, Kunming 650051, China ）
Abstract：
This paper introduces a control software of underwater vehicle based on NI RT controller written by LabVIEW. The software is used to realize man-machine interaction, data recording and display, data communication between upper and lower computers and real-time control of underwater vehicle. The software adopts the classic producer-consumer mode of LabVIEW. By setting the priority and execution time of the loop, the software can control the robot body in real time while reading the state data.Key words：
underwater vehicle; LabVIEW; PC software; real time control [参考文献]
[1]郑发顺.遥控水下机器人系统在水库大坝水下检查中的应用[J].水利信息化，2014（4）：45-49.
[2]李福年，陈慕雄，田维坤. ROV 原理及在阿海水电站工程中的应用[J].云南水力发电，2013（3）：119-121.
[3]曾广移，覃丹，巩宇，等.一种具备ROV/AUV 双工模式的水电站检测水下机器人研究[J].科技广场，2017（9）：74-78.[4]软奇桢.我和LabVIEW ：一个NI 工程师的十年编程经验[M].北京：北京航空航天大学出版社，2012.[5]蒋新松.水下机器人[M].沈阳：辽宁科学技术出版社，2000.
（上接第51页）

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。