微信小程序开发实战
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人

1.2 开发前的准备

在正式进行小程序的开发之前,我们还需要做一些准备工作,如注册小程序开发账号,以及下载和安装微信开发者工具等。在小程序开发完成后,我们也需要了解如何进行小程序体验版的发布,以及如何将测试完成后的小程序提交上线。本节主要介绍小程序开发前的准备工作。

1.2.1 注册小程序开发账号

在开发小程序之前,需要先在微信公众平台注册小程序开发账号。注册完成后可以在微信开发者工具上使用此账号进行小程序的开发。目前,小程序开放的注册范围有5种:个人、企业、政府、媒体和其他组织。我们在学习小程序开发时,直接注册个人的小程序账号即可。首先,进入微信公众平台账号注册页面,地址如下:

https://mp.weixin.qq.com

选择注册小程序类型的账号如图1-9所示。

图1-9 选择注册小程序类型的账号

其次,填写完整注册所需的基本信息,在注册时需要使用一个有效的邮箱作为账号,并且注册完成后需要登录邮箱进行验证。

注册完成后,使用此账号登录微信公众平台,由于我们注册的账号为小程序账号,所以会直接进入小程序的管理后台。

进入小程序管理后台后的第一步是将小程序基本信息补充完整,一个小程序账号对应一个小程序。需要补充完善的小程序信息包括小程序的名称、简称、头像、介绍及服务类目。小程序后台中的版本管理功能用来帮助开发者管理小程序的版本,里面会将当前已上线的小程序版本(线上版本)、审核中的版本(审核版本)及开发中的版本(开发版本)分别列出,如图1-10所示。

图1-10 小程序版本管理工具

在后台的成员管理工具中,可以对小程序的项目成员和体验成员进行管理。项目成员可以设置的权限包括运营者权限、开发者权限和数据分析者权限;体验成员可以添加用户,使其支持提前体验为发布上线的小程序。

反馈管理可以帮助开发者更快地追踪到用户在使用过程中遇到的问题,用户可以通过小程序提供的接口直接将意见提交到小程序后台供开发者查阅。

小程序后台的统计功能也非常重要,开发者可以在其中查看实时的小程序数据,也可以做一些来源分析、自定义事件等高级统计任务。

小程序后台汇总还提供了一些其他高级功能,如附近的小程序、物流助手、客服、模板消息等。如果读者有兴趣,可以在文档中查看它们的用途和使用方法。

1.2.2 下载和安装微信开发者工具

准备好小程序账号之后,下一步我们需要下载和安装小程序开发所需要的开发工具。在如下网址可以下载最新的微信开发者工具:

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

在下载时需要注意,官方提供了Windows 64位、Windows 32位和Mac OS 3个版本的开发者工具,读者可以根据自己所使用的计算机系统进行选择。本书以Mac OS为例进行介绍。

微信开发者工具的下载和安装十分简单,也无须额外的配置,在下载完成后,直接双击安装即可。使用微信开发者工具需要使用微信号进行登录,在申请小程序账号时,需要关联一个微信号作为小程序的管理员,可以用此微信号直接登录,也可以使用添加到小程序后台的开发者的微信账号进行登录,微信开发者工具的初始界面如图1-11所示,直接扫码进行登录即可。

图1-11 微信开发者工具的初始界面

登录成功后,界面如图1-12所示,可以在其中选择小程序项目。

图1-12 选择开发者工具中的小程序项目

如果是初次使用微信开发者工具,则需要创建一个新的小程序项目,在小程序项目目录页面单击加号按钮,创建一个新的小程序项目。在创建小程序项目时,需要填写小程序的AppID并选择建立普通快速启动模板,如图1-13所示。

图1-13 新建小程序项目

小程序的AppID可以在小程序开发后台的开发设置中查看,如图1-14所示。

图1-14 查看小程序的AppID

在新建完成小程序项目之后,默认的模板会自动创建一个获取用户信息的示例程序,如图1-15所示。

图1-15 模板创建的示例程序

1.2.3 微信开发者工具的使用简介

微信开发者工具提供了非常强大的模拟器、编辑器及调试器的相关功能(见图1-15)。微信开发者工具的左上角有4个功能按钮:模拟器、编辑器、调试器和云开发。其中,模拟器按钮用于开关模拟器窗口,编辑器按钮用来开关编辑器窗口,调试器按钮用来开关调试器窗口,云开发按钮与开通云函数相关功能有关。

模拟器窗口默认位于微信开发者工具的左侧,开发者可以选择使用各种iPhone或Android模拟器设备进行代码运行效果的查看。

编辑器的主要作用是索引文件与编写代码。微信开发者工具的右边上部分为编辑器窗口,编辑器左边为文件目录,编辑器右边为代码编写窗口。

调试器在微信开发者工具的右下方,其中提供的控制台工具用来显示程序中打印的调试信息,源文件工具用来提供给开发者进行断点调试,网络工具与数据工具用来查看应用运行时的网络与数据情况。

熟练运用微信开发者工具提供的模拟器、编辑器和调试器工具可以极大地提高开发效率。微信开发者工具的导航栏上还有一行高级功能按钮,如图1-16所示。

图1-16 高级功能按钮

使用图1-16列出的高级功能按钮可以进行编译模式的切换,或模拟将小程序切换到后台,以进行真机预览和真机调试。清缓存按钮的主要作用是将小程序的缓存进行清除,如用户登录状态等。关于真机调试的相关功能后面会专门展开介绍。

1.2.4 发布小程序体验版与上架小程序

一款小程序在发布之前,首先要经过内部测试。内部测试通常需要开发人员、测试人员、产品人员、运营人员及粉丝用户一起参与。1.2.3节提及的预览功能,只能开发者自己在手机上进行体验,如果要进行多人参与的内测,可以发布小程序体验版本。

在微信开发者工具导航栏的右上角有一个双箭头按钮(与开发工具窗口的宽度有关,额外的按钮会被隐藏在这个双箭头按钮中),这个按钮会提供更多的功能,如图1-17所示。

图1-17 更多功能按钮

更多功能菜单中提供了上传功能,单击“上传”,开发者工具会将当前的程序打包上传到小程序后台,在提交之前,需要选择一个版本号,如图1-18所示。

图1-18 设置版本号

在小程序后台的版本管理工具中可以查看开发者提交的小程序版本,可以将其设置为体验版本,如图1-19所示。

图1-19 设置小程序体验版本

在成功设置体验版本后,小程序后台会自动生成一个体验二维码。此小程序的体验成员可以通过微信扫描二维码对体验版小程序进行体验。

上架小程序需要先将完整的小程序代码打包上传,之后在小程序后台将此版本提交审核,然后微信小程序的审核团队会针对小程序的功能、可用性、是否合规进行审核,如果审核通过,开发者可以发布上线。