微信小程序开发从入门到实战-微课视频版

本书以微信小程序开发入门到实战为定位，内容共12章： 第1章带领读者认识微信小程序； 第2章整体性地讨论小程序的框架问题； 第3章介绍常见的组件； 第4章介绍视图层的样式布局； 第5章介绍逻辑层JavaScript； 第6章介绍小程序数据库操作； 第7章介绍常见的网络接口； 第8章介绍常见的媒体和设备接口； 第9章介绍常见的交互和开放接口； 第10章介绍微信小程序*新技术——云开发； 第11、12章是两个综合性项目。
考虑到大部分高校开设过“Java程序设计”课程，本书中的高级接口均采用Java作为后端开发语言，案例中的后端代码附有注释，没有Java基础的读者可以根据注释修改成自己需要的后端程序。全书的110个知识点案例代码、9个小型实训项目代码和2个大型实训项目代码，均在微信开发者工具和真机中调试通过。
本书提供750分钟的视频讲解，扫描书中相应位置的二维码可以在线观看； 本书还提供教学大纲、教学课件、电子教案、程序源码和教学进度表，扫描封底的课件二维码可以下载。
本书可作为高等院校计算机相关专业学生学习微信小程序的教材，也可供对小程序开发感兴趣的开发人员、广大科技工作者和研究人员参考。
本书由陈云贵和高旭编著，其中，陈云贵负责编写第1章、第6~10章和第12章，高旭负责编写第2~5章和第11章。全书由陈云贵审阅定稿。

前言

微信小程序从2017年1月9日上线以来，取得了巨大的成功。2019年1月9日微信官方公布的数据显示，小程序已覆盖超过200个细分行业，2018年小程序服务超过1000亿人次用户，年交易增长超过600%，创造了超过5000亿的商业价值。微信小程序的蓬勃发展也产生了巨大的人才需求缺口，微信小程序进大学课堂已成必然趋势。
小程序（Mini Program）是运行于“大程序”之上的无须下载、无须安装、触手可及和用完即走的轻量级应用。微信团队为小程序提供的框架命名为MINA应用框架。MINA框架通过封装微信客户端提供的文件系统、网络通信、任务管理和数据安全等基础功能，对上层提供一整套JavaScript API，让开发者能够非常方便地使用微信客户端提供的各种基础功能与能力，快速构建一个应用。
本书以微信小程序开发入门到实战为定位，内容共12章： 第1章带领读者认识微信小程序； 第2章整体性地讨论小程序的框架问题； 第3章介绍常见的组件； 第4章介绍视图层的样式布局； 第5章介绍逻辑层JavaScript； 第6章介绍小程序数据库操作； 第7章介绍常见的网络接口； 第8章介绍常见的媒体和设备接口； 第9章介绍常见的交互和开放接口； 第10章介绍微信小程序最新技术——云开发； 第11、12章是两个综合性项目。
考虑到大部分高校开设过“Java程序设计”课程，本书中的高级接口均采用Java作为后端开发语言，案例中的后端代码附有注释，没有Java基础的读者可以根据注释修改成自己需要的后端程序。全书的110个知识点案例代码、9个小型实训项目代码和2个大型实训项目代码，均在微信开发者工具和真机中调试通过。
本书提供750分钟的视频讲解，扫描书中相应位置的二维码可以在线观看； 本书还提供教学大纲、教学课件、电子教案、程序源码和教学进度表，扫描封底的课件二维码可以下载。
本书可作为高等院校计算机相关专业学生学习微信小程序的教材，也可供对小程序开发感兴趣的开发人员、广大科技工作者和研究人员参考。
本书由陈云贵和高旭编著，其中，陈云贵负责编写第1章、第6~10章和第12章，高旭负责编写第2~5章和第11章。全书由陈云贵审阅定稿。
最后，感谢清华大学出版社的魏江江分社长、王冰飞编辑以及其他工作人员为本书出版付出的辛勤劳动； 感谢澳门科技大学赵庆林教授、冯丽教授和广东科技学院计算机学院田立伟院长在本书写作过程中给予的指导和帮助； 同时感谢我的家人的默默付出与支持。
愿本书对读者学习微信小程序起到抛砖引玉的作用，并真诚地欢迎读者批评指正。
编者

2020年1月

目录

源码下载

第1章

认识小程序

1.1微信小程序介绍

1.1.1微信小程序产生的背景

1.1.2什么是微信小程序

1.1.3小程序之“大程序”

1.1.4微信小程序应用前景

1.2小程序特征

1.3微信小程序开发准备

1.3.1申请小程序账号

1.3.2完善信息

1.3.3后台介绍

1.4第一个微信小程序

1.4.1开发者工具的安装

1.4.2第一个小程序

1.4.3项目发布和提交审核

1.5支付宝和百度小程序

1.5.1支付宝小程序

1.5.2百度智能小程序

第2章

小程序开发基础

2.1开发者工具介绍

2.1.1菜单栏

2.1.2工具栏

2.1.3模拟器

2.1.4目录树

2.1.5代码编辑区

2.1.6调试器

2.2小程序项目结构

2.2.1项目文件结构

2.2.2页面文件

2.2.3全局配置文件

2.3生命周期函数

2.3.1应用级生命周期

2.3.2页面级生命周期

2.4逻辑层

2.4.1页面数据

2.4.2页面事件处理函数

2.4.3页面跳转

2.4.4页面间参数传递

2.4.5模块化

2.4.6页面自定义事件函数

2.5视图层

2.5.1数据绑定

2.5.2条件渲染

2.5.3列表渲染

2.5.4模板

2.5.5引用

2.6实训项目——商品列表页和详情页

第3章

微信小程序组件

3.1组件概述

3.2视图容器组件

3.2.1view

3.2.2scrollview

3.2.3swiper

3.3基础内容组件

3.3.1icon

3.3.2text

3.3.3progress

3.4表单组件

3.4.1button

3.4.2checkbox

3.4.3input

3.4.4label

3.4.5form

3.4.6picker

3.4.7pickerview

3.4.8radio

3.4.9slider

3.4.10switch

3.4.11textarea

3.5导航组件

3.6媒体组件

3.6.1audio

3.6.2image

3.6.3video

3.7地图组件

3.8实训项目——问卷调查

第4章

样式与布局

4.1小程序样式

4.1.1定义样式

4.1.2使用样式

4.2选择器

4.2.1基础选择器

4.2.2复合选择器

4.3基础样式

4.3.1文本样式

4.3.2字体样式

4.4盒子模型

4.4.1盒子模型概述

4.4.2盒子模型属性

4.5元素类别

4.5.1块级元素

4.5.2行内元素

4.5.3内联块级元素

4.6flex布局

4.6.1flex基本概念

4.6.2flex容器属性

4.6.3flex项目属性

4.7layer布局

4.8float布局

4.9小程序布局实战

4.9.1列表式

4.9.2转盘式

4.9.3多面板

4.9.4标签式

4.10实训项目——仿京东首页小案例

第5章

JavaScript基础

5.1JavaScript简介

5.2JavaScript基础语法

5.2.1变量

5.2.2数据类型

5.2.3运算符

5.2.4逻辑控制语句

5.2.5定义和调用函数

5.2.6小程序中this和that的使用

5.3JavaScript在小程序中常见的交互场景

5.3.1购物车场景

5.3.2下拉菜单场景

5.3.3栏目切换场景

5.3.4系统设置场景

5.4实训项目——计算器小案例

第6章

数据库操作

6.1MySQL数据库

6.1.1MySQL数据库介绍

6.1.2MySQL数据库下载和安装

6.1.3使用phpStudy安装MySQL

6.2可视化工具Navicat for MySQL

6.2.1Navicat介绍与安装

6.2.2在Navicat中创建数据库

6.3基于Java的后端JSON接口

6.3.1JDBC

6.3.2JSON接口

6.4数据库操作

6.4.1wx.request()接口

6.4.2基于数据库的新闻列表页案例

6.4.3基于数据库的新闻详情页案例

6.5数据缓存Storage

6.6html2wxml富文本插件

6.6.1html2wxml插件介绍

6.6.2html2wxml插件使用

6.7实训项目——基于数据库的注册与登录案例

第7章

网络通信与文件上传下载操作

7.1WebSocket

7.1.1WebSocket接口

7.1.2基于Node.js的WebSocket案例

7.2wx.uploadFile()文件上传

7.2.1文件上传后端

7.2.2文件上传前端

7.3wx.downloadFile()文件下载

7.4实训项目——网络相册

7.4.1网络相册项目后端

7.4.2网络相册项目前端

第8章

媒体与设备操作

8.1地图与位置

8.1.1地图

8.1.2位置

8.2图片

8.3视频

8.4录音、音频播放控制以及背景音乐

8.4.1录音

8.4.2音频播放控制

8.4.3背景音乐

8.5设备操作

8.5.1获取系统信息

8.5.2网络环境

8.5.3电量

8.6实训项目——音乐播放器案例

第9章

交互接口和开放接口

9.1交互反馈

9.1.1消息提示框wx.showToast()和加载提示框
wx.showLoading()

9.1.2模态对话框wx.showModal()和操作菜单
wx.showActionSheet()

9.2微信登录接口wx.login()

9.2.1微信登录前端

9.2.2微信登录后端

9.3微信支付接口wx.requestPayment()

9.3.1微信支付前端

9.3.2微信支付后端

9.4获取用户信息接口wx.getUserInfo()

9.5模板消息template

9.5.1模板消息前端

9.5.2模板消息后端

9.6权限接口

9.6.1用户授权接口wx.authorize()

9.6.2获取用户权限设置接口wx.getSetting()

9.6.3打开用户权限设置界面接口wx.openSetting()

9.7微信运动接口wx.getWeRunData()

9.8其他常见开放接口

9.8.1小程序间跳转接口wx.navigateToMiniProgram()

9.8.2获取用户收货地址接口wx.chooseAddress()

9.8.3SOTER指纹认证

9.9实训项目——购物车与结算功能

第10章

小程序云开发

10.1云开发

10.1.1开通云开发功能

10.1.2云开发控制台使用

10.1.3第一个云开发小程序

10.2云存储

10.3云函数

10.3.1云函数API和云函数创建

10.3.2Callback风格和Promise风格

10.3.3npm和wxserversdk

10.4云数据库

10.4.1数据类型和权限控制

10.4.2查询数据

10.4.3插入数据

10.4.4更新数据

10.4.5删除数据

10.5实训项目——基于云数据库的许愿墙

第11章

数码产品类电商小程序项目

11.1需求分析

11.2页面设计与实现

11.2.1全局文件的设计与实现

11.2.2商城首页的设计与实现

11.2.3商品分类页的设计与实现

11.2.4商品详情页的设计与实现

11.3购物车功能的设计与实现

11.4支付页面的设计

11.5项目小结

第12章

基于云开发的新闻小程序项目

12.1需求分析

12.2云存储的设计与实现

12.2.1云存储在本项目中的意义

12.2.2云存储的设计与实现

12.3云数据库的设计与实现

12.4小程序端的实现

12.4.1项目效果图展示

12.4.2全局文件的实现

12.4.3其他页面的实现

12.5项目小结