描述
开 本: 16开纸 张: 胶版纸包 装: 平装-胶订是否套装: 否国际标准书号ISBN: 9787121366352
★?微信小程序的结构化开发方法
★少走弯路，高效开发
★本书的原则是实战，目标却是高效开发微信小程序。
★借助WePY、mpvue、Taro框架，让你从0开始迅速掌握小程序的开发步骤和技巧。
★全书不仅仅涉及小程序的前台UI，还涉及到后台逻辑的编写
★旨在让读者真正获得一个小程序项目的开发能力。
实战项目包括：
★WePY项目：
– 问卷小程序
– 摇一摇游戏
– 百度图片识别API
– 文字和信息发布小程序
– 使用Canvas绘制图片
★mpvue项目：
– “历史今日”小程序
★Taro项目：
– 星座测试小程序
本书的目的就是帮助开发者快速开发一个小程序。本书抛弃了其他图书逐步介绍微信组件和API的手法，毕竟这些内容微信官方文档已经讲得很详细了。本书从实战入手，通过微信官方提供的WePY框架和第三方框架mpvue、Taro，演示7个小程序项目的全部制作步骤，尤其是Taro框架，还可以将微信小程序转换为其他小程序，如今日头条小程序。
本书不同于其他书的特色还有：
?提供几乎所有的项目源代码
为了便于读者理解本书介绍的小程序，书中介绍的项目均提供可以运行的源代码，读者可以通过博文视点官网下载本书的项目代码。
?7个真实应用环境中流行的小程序项目
本书的实例选择了在小程序应用环境中常见的几种应用，最终的成品可以直接在项目环境中运行，读者不仅可以在学习中参考，也可以直接取出部分功能放在自己的项目中。
?3个流行微信小程序开发框架
本书以微信官方提供的WePY框架开发为主，为方便读者，还提供了流行的mpvue和Taro两个小程序框架的实例。这些框架可以帮助读者快速高效地开发小程序。如果你是熟悉Vue或React的前端开发人员，可降低学习成本、迅速入门。
如果你想开发一个微信小程序，但不知道如何下手，
如果你想开发多种小程序（微信小程序、今日头条小程序等），却没有解决方案，
如果你想快速开发一个微信小程序，
如果你想从软件开发转向微信小程序开发，
那么本书是一本非常适合你的参考资料。
本书是作者在《微信小程序开发零基础入门》之后精心打造的小程序开发书，
不仅包括微信小程序，还有百度小程序、支付bao小程序、今日头条小程序，
内容更贴近实战，目标是高效开发小程序。
《微信小程序开发零基础入门》读者评价摘要：
★实例代码具有代表性，基础控件的使用场景很清晰。
★注重理论基础，详细讲解了哪些APP适用于开发小程序，哪些不适合，全书注重理论，尤其是先讲解了HTML5、CSS和JavaScript的基础，再逐渐过渡到微信小程序需要使用的编程知识，全书脉络清晰，相信没有编程基础的读者读完了也能开发出一个完整像样的小程序来。
★看了几本所谓的入门书，这本是不错的了。力荐
6.1.1 摇一摇功能分析
小程序中的摇一摇功能，其实只需要一个简单的传感器就可以完成，即加速度传感器。
加速度传感器是一种能够测量加速度的传感器，通常由质量块、阻尼器、弹性元件、敏感元件和适调电路等部分组成。传感器在加速过程中，通过对质量块所受惯性力的测量，利用牛顿第二定律获得加速度值。根据传感器敏感元件的不同，常见的加速度传感器包括电容式、电感式、应变式、压阻式、压电式等。
一般而言，手机设备中的加速度传感器可以检测上、下、左、右的倾角变化，可用于手机游戏、拍照、设备姿势检测等。
小程序对加速度传感器进行了封装，使开发者不用操作加速度传感器本身，仅需要调用3个方法，就可以获得当前手机加速度器的情况和当前角度的值。这3个方法是：
l wx.stopAccelerometer(Object object)
l wx.startAccelerometer(Object object)
l wx.onAccelerometerChange(function callback)
摇一摇的基本功能，就是判断当前手机的状态是在摇动着还是平稳中。也就是说，在用户进入当前页面时：
l 使用wx.startAccelerometer(Object object)打开对该传感器的记录和监听。
l 在wx.onAccelerometerChange(function callback)这个API下监听变化状态，如果认为其摇动，数量加成，等待时间结束，返回数据。
l 在界面关闭或者游戏结束时，调用wx.stopAccelerometer(Object object)关闭加速度传感器。
摇一摇中的请求均可以使用接口轮询的方式访问服务器，不使用socket的方式。这样也方便后台服务器的接口代码编写。使用轮询的方式，就一定会使用小程序中的定时器等。
小程序的定时器和JavaScript的定时器一样，一般分为两种。
第一种，设定一个定时器，按照指定的周期（以毫秒计）来执行注册的回调函数，用于重复执行的内容，代码如下所示。
number setInterval(function callback, number delay, any rest)
// 使用
let timer = setInterval(
()=>{
// 需要执行的代码
},1000
)
使用该定时器执行的函数代码，可以使用clearInterval(number intervalID)方法取消，也就是说，对于上述1秒执行一次的代码，可以通过如下代码停止执行。
// 传入要取消的定时器的 ID
clearInterval(timer)
第二种，设定一个定时器，在定时结束以后执行注册的回调函数，也就是延迟一定时间执行，代码如下所示。
number setTimeout(function callback, number delay, any rest)
// 使用
let timer = setTimeout (
()=>{
// 需要执行的代码
},1000
)
同样，这个延迟定时器会在延迟1秒后执行函数规定的代码，也存在相应的代码停止执行方法，使用clearTimeout(number timeoutID)方法取消延迟定时器的执行，代码如下所示。
// 传入要取消的定时器的 ID
clearTimeout (timer)
本章项目的轮询和延迟开始等功能会大量使用这两个定时器的相关内容。
6.1.2 摇一摇项目规划
本实例不涉及用户的openid登录等内容，仅通过用户输入的手机号码和一开始输入的参与码进行判定，可以使用测试号完成该小程序的开发，而不用注册真实APPID。
在进入小程序时需要选择是创建一个新游戏还是参与一个游戏，需要输入两个用户信息相关的内容：
l 首先是用户的手机号，用于将来联系用户和用户单一识别。
l 其次是一个参与码，这个码意味着用户参与的是哪一次的摇一摇游戏，或者创建的游戏参与码是多少。
游戏时间的配置，需要一个小于1分钟的值，设定基本的单位为秒，可以通过这个时间设定一个游戏的结束时间。这个值只能设置一次，一个游戏时间针对一个参与码，只能由之前创建游戏参与码的人设置。
游戏的开始时间在创建者的设备中通过一个按钮控制，其他设备通过轮询的方式查询和读取接口，定时一致。因为并非网络游戏等实时性质极强的游戏，所以较小的延迟不会影响游戏的体验。
等到本机的所有计时结束，会返回给服务器相关的数据值，在有效时间内可以记录在数据库中，如果超出了有效时间，认为成绩无效。
最后将所有的数据传输给各个参与的设备，完整的逻辑如图6-1所示。
6.1.3 摇一摇接口定义
根据6.1.2节的规划，摇一摇小程序需要以下接口：
l 用户参与活动时的手机信息和参与码信息的接收接口，在此接口中同时会获得活动的时长。
l 用户创建活动时手机信息及参与码和时长相关的接口。
l 用户单击游戏开始的接口。
l 所有用户接收到游戏开始信息的接口。
l 用户返回摇动相关数据的接口。
l 用户在所有数据传输结束后根据参与码信息返回该参与码中的参与排行榜的人次、手机号码和摇动次数的接口。
可以在后台的服务器端提供6个接口，具体的接口和说明如表6-1所示。
6.2 项目编码
本节开始项目的具体编码，项目后台服务器依旧使用Laravel框架，同时因为本章的实例不涉及用户登录内容，所以本例同时也提供线上测试的地址。
6.2.1 摇一摇小程序的后台
依旧在之前的Laravel项目中编写。
（1）该项目的项目路由规划，根据上一节中的路由定义，首先在RouteServiceProvider.php文件中定义一个新的路由文件，代码如下所示。
// 摇一摇用户请求
Route::prefix(‘shake/api’)
->middleware(‘api’)
->namespace($this->namespace)
->group(base_path(‘routes/shake.php’));
（2）在routes文件夹下新建shake.php文件，并且将上一节中指定的路由定义在文件中，代码如下所示。
<?php
Route::group([‘namespace’ => ‘ShakeApi’], function () {
// 参与
Route:: post(‘activity/join’, ‘IndexController@join’);
// 创建
Route:: post(‘activity/create’, ‘IndexController@create’);
// 游戏开始的接口
Route:: get(‘activity/start/{create_id}’, ‘IndexController@start’);
// 用户获得开始的接口
Route:: get(‘activity/getStart/{join_id}’, ‘IndexController@getStart’);
// 用户参加活动的数据
Route::post(‘activity/saveData’, ‘IndexController@saveData’);
// 排行榜数据
Route:: get(‘activity/getData/{code}’, ‘IndexController@getData’);
});
这6个相关的接口均将路由的请求转发到了对应的IndexController中，其中参与活动、创建活动和最后的提交数据都采用POST形式，其他均为GET形式，并且其参数直接放在路径代码中。
评论
还没有评论。