详情
本书从微信公众平台的基础知识入手，阐述开发原理，讲述了常用调试方法及工具，并辅助公众平台的常用功能及方法讲解，如微信支付、网页授权、微信登录等。同时本书还分析了微信小程序架构。之后，本书分别介绍了echo server程序、公众号智能小助手、小程序人脸识别案例。最后，本书围绕如何搭建一个具有独立域名的博客站点介绍了服务器运维的相关知识。
书名：微信公众平台与小程序开发——从零搭建整套系统（第2版）
ISBN：978-7-115-50894-2
本书由人民邮电出版社发行数字版。版权所有，侵权必究。
您购买的人民邮电出版社电子书仅供您个人使用，未经授权，不得以任何方式复制和传播本书内容。
我们愿意相信读者具有这样的良知和觉悟，与我们共同保护知识产权。
如果购买者有侵权行为，我们可能对该用户实施包括但不限于关闭该帐号等维权措施，并可能追究法律责任。
编 著 张剑明
责任编辑 陈聪聪
人民邮电出版社出版发行 北京市丰台区成寿寺路11号
邮编 100164 电子邮件 315@ptpress.com.cn
网址 http://www.ptpress.com.cn
读者服务热线：(010)81055410
反盗版热线：(010)81055315
本书系统全面地介绍了微信公众平台与小程序开发的各方面知识。全书由4个部分组成，第一部分从微信公众平台的基础知识入手，在阐述微信开发环境与相关技术的同时，介绍常用的调试方法及工具。第二部分主要介绍微信网页开发的原理与流程，并对微信支付和微信登录技术进行了分析。第三部分对微信小程序的架构进行了分析。第四部分介绍了echo server程序、公众号智能小助手、小程序人脸识别案例，并围绕如何搭建一个具有独立域名的博客站点讲解服务器运维的相关知识。
本书适合Web前端开发工程师、后端开发工程师以及具有一定程序开发基础的技术人员阅读，本书也可作为培训班教材使用。
“再小的个体，也有自己的品牌”，这是微信公众平台官方页面的一句标语。腾讯微信团队于2012年推出公众平台，在经历雨后春笋般的蓬勃发展后，微信公众平台已演变为自媒体平台，越来越多的产品通过公众号来实现其线上的传播和营销。微信公众平台成为初创型企业快速验证商业模式的首选。小程序发布后，通过不断地打磨和生态完善，也在逐步赢得市场和大众的认可。
如果说微信是一棵树，那么它俨然是一棵参天大树。微信以社交为基石孕育出无限的想象空间，而支付、小程序、搜索以及游戏，则是这棵大树结出的累累果实，这些与每个用户息息相关的高频使用业务让“微信，是一个生活方式”这句口号变得更加丰满。微信互联网的时代已经到来。
微信公众平台对任何人来说都是一个机会。正如微信之父张小龙所言：“你如何用微信，决定了微信对你而言，它到底是什么。”和大家一样，我也是在微信公众平台刚推出不久就加入到了探索的行列。小程序刚推出的时候，我第一时间进行开发实践。本书的绝大部分内容都是我在工作中的积累，并已经应用到实际的项目中，得到了良好的验证。也有一部分是我在工作之余的兴趣创作，例如本书案例中介绍的公众号智能小助手以及人脸识别的小程序。
在接下来的时间里，我会继续关注并探索与公众平台相关的演进和技术，希望能给大家带来更多干货，实实在在地帮助到大家。
本书从逻辑上可以分为四大部分。
第一部分为第1～4章，主要介绍与微信公众平台开发相关的基础理论知识，包括开发环境和开发框架的搭建、常用调试工具使用详解等。这一部分可以帮助读者了解公众号开发的背景知识，为阅读后续的章节打下基础。如果读者对这部分内容已经较为熟悉，可选择性阅读。
第二部分为第5～7章，这是本书的核心内容，主要提供微信公众平台开发过程中涉及的常见问题的解决方案，包括微信网页授权、微信支付和微信登录。在讲解原理的过程中我会结合实际代码来帮助读者掌握这部分内容。
第三部分为第8、9章，主要介绍微信小程序的相关理论知识，包括对微信小程序的行业介绍、开发工具的使用等。另外，这部分内容也对微信小程序开发框架的底层实现原理进行了剖析，让读者对微信小程序有一个较为深入的理解。
第四部分为第10～13章，这是案例实践部分，讲解了如何接入公众号开发模式，向读者展示了一个公众号的开发过程，并结合时下流行的人脸识别技术，开发了一个人脸识别小程序。第13章介绍了如何从零开始搭建站点及日常服务器运维。掌握了这部分内容之后，读者就可以独立完成一个逻辑复杂的公众号或小程序开发了。
本书在第1版的基础之上进行了部分内容勘误，并参照微信官方的文档，更新了部分API接口及相关内容。但是，即便如此，书中也难免会有一些错误或者更新不及时的地方。如果遇到和微信官方文档不一致的地方，请以官方文档为准。在此，我恳请读者朋友们批评指正。我建立了一个QQ群（141927779），欢迎读者加入该群进行交流。大家也可以通过电子邮箱（hellocpp@foxmail.com）和微信号（hellojammy）与我联系。期待和大家的交流，也衷心希望本书能对大家有所帮助。
书中的所有源代码都可以在作者的个人博客中下载。
感谢微信团队的伟大创新，让我们的生活方式发生了改变。
感谢我的家人，特别是我的妻子，撰写本书占用了我不少本该陪伴她的时间，感谢家人给我的支持和鼓励！
本书由异步社区出品，社区（https://www.epubit.com/）为您提供相关资源和后续服务。
作者和编辑尽最大努力来确保书中内容的准确性，但难免会存在疏漏。欢迎您将发现的问题反馈给我们，帮助我们提升图书的质量。
当您发现错误时，请登录异步社区，按书名搜索，进入本书页面，单击“提交勘误”，输入勘误信息，单击“提交”按钮即可。本书的作者和编辑会对您提交的勘误进行审核，确认并接受后，您将获赠异步社区的100积分。积分可用于在异步社区兑换优惠券、样书或奖品。
我们的联系邮箱是contact@epubit.com.cn。
如果您对本书有任何疑问或建议，请您发邮件给我们，并请在邮件标题中注明本书书名，以便我们更高效地做出反馈。
如果您有兴趣出版图书、录制教学视频，或者参与图书翻译、技术审校等工作，可以发邮件给我们；有意出版图书的作者也可以到异步社区在线提交投稿（直接访问www.epubit.com/selfpublish/submission即可）。
如果您是学校、培训机构或企业，想批量购买本书或异步社区出版的其他图书，也可以发邮件给我们。
如果您在网上发现有针对异步社区出品图书的各种形式的盗版行为，包括对图书全部或部分内容的非授权传播，请您将怀疑有侵权行为的链接发邮件给我们。您的这一举动是对作者权益的保护，也是我们持续为您提供有价值的内容的动力之源。
“异步社区”是人民邮电出版社旗下IT专业图书社区，致力于出版精品IT技术图书和相关学习产品，为作译者提供优质出版服务。异步社区创办于2015年8月，提供大量精品IT技术图书和电子书，以及高品质技术文章和视频课程。更多详情请访问异步社区官网https://www.epubit.com。
“异步图书”是由异步社区编辑团队策划出版的精品IT专业图书的品牌，依托于人民邮电出版社近30年的计算机图书出版积累和专业编辑团队，相关图书在封面上印有异步图书的LOGO。异步图书的出版领域包括软件开发、大数据、AI、测试、前端、网络技术等。
异步社区
微信服务号
1.1 微信，是一个生活方式截至2018年9月30日，未经审核的2018年第三季度综合业绩报告中的经营数据显示，腾讯QQ的月活跃账户数为8.03亿人次，智能终端月活跃账户数为6.98亿人次，而微信和WeChat的合并月活跃账户数达到10.83亿人次。
早在2010年，腾讯广州研发中心产品团队便在张小龙的带领下，开始着手微信的研发。张小龙此前曾经开发过Foxmail和腾讯七星级产品QQ邮箱，这两款产品颇受业界好评。这一次，微信成为张小龙的又一力作。
2011年1月，微信发布针对iPhone用户的1.0测试版（见图1-1），并通过QQ账户体系来导入好友关系链，快速拥有了微信的第一批用户。通过QQ来导入用户，是一个非常明智的选择，也是腾讯经营社交产品多年厚积薄发的最好印证，这更是令其他互联网企业望尘莫及且不可多得的资源。
图1-1 微信1.0测试版截图（图片来自腾讯微信官网）
这里简单回顾一下微信的发展历史，如表1-1所示。
表1-1 微信iPhone版本更新大事件
| 时间点 |
版本 |
主要功能特性 |
|---|---|---|
| 2011年1月 |
微信 1.0 |
即时通信；分享照片；更换头像等简单功能 |
| 2011年5月 |
微信 2.0 |
语音对讲功能，该功能的发布使微信的用户有了显著增长 |
| 2011年8月 |
微信 2.5 |
查看附近的人，再次引爆用户增长 |
| 2011年10月 |
微信 3.5 |
极具创造性和趣味性的“摇一摇”，增加微信社交属性 |
| 2012年4月 |
微信 4.0 |
新增相册功能，并可以把图片分享至朋友圈，使得用户黏度大大增加 |
| 2012年7月 |
微信 4.2 |
视频聊天；网页版微信，开拓桌面市场，影响运营商业务 |
| 2013年2月 |
微信 4.5 |
实时对讲，多人实时语音聊天；进一步丰富“摇一摇”及二维码功能 |
| 2013年8月 |
微信 5.0 |
银行卡绑定，可使用微信支付；表情商店 |
| 2014年1月 |
微信 5.2 |
位置共享；“我的银行卡”中新增多项生活服务；聊天记录搜索；语音转文字 |
| 2014年8月 |
微信 5.4 |
查看图片时可以识别图中二维码 |
| 2014年9月 |
微信 6.0 |
小视频；微信卡包 |
| 2015年5月 |
微信 6.2 |
聊天记录迁移；朋友圈文字翻译 |
| 2016年12月 |
微信6.5 |
可以在朋友圈分享相册中的视频；选择照片时可以进行简单的编辑 |
| 2017年1月 |
微信6.5 |
面对面红包，通过二维码给身边的人发红包 |
| 2017年5月 |
微信6.5 |
聊天内容可按文件、图片、链接类型查找 |
| 2017年12月 |
微信6.6 |
主界面新增任务栏，下拉可找到用过的小程序 |
| 2018年1月 |
微信6.6 |
支持微信账号切换，“发现”页支持自定义显示项 |
| 2018年4月 |
微信6.6 |
可保留未编辑完的朋友圈 |
| 2018年5月 |
微信6.6 |
扫一扫可拍照翻译整页中英文；把浏览的文章缩小为浮窗 |
| 2018年6月 |
微信6.7 |
可直接浏览订阅号的消息 |
| 2018年7月 |
微信6.7 |
可把常用的小程序添加到“我的小程序” |
| 2018年8月 |
微信6.7 |
可使用英语和粤语进行语音输入；可在iPad上使用小程序 |
| 2018年9月 |
微信6.7 |
在表情面板拍摄自己的表情；可快速找到常读的订阅号 |
| 2018年12月 |
微信7.0 |
用“时刻视频”记录眼前的世界；界面全新改版；可在“看一看”中浏览好友认为好看的文章；在聊天详情页中，可以给单聊设置强提醒 |
| 2019年1月 |
微信7.0 |
解决已知问题 |
从微信的版本更新记录中可以看到，微信的每一次重大版本更新，都精准地把握住了用户的核心需求点。产品功能的不断更新迭代，让用户体验得到不断提高，一款互联网产品被打造得老少皆宜。
2012 年，张小龙提出一个新观点：微信，是一个生活方式。下面详细回顾微信的发展历史，来了解这一理念是如何实现的。
2011年5月，微信2.0语音版全新发布，让聊天不再是单纯的文字，用户可以像打电话一样和朋友们交流。（多么高明的创新！从此，人们无论是走在大街上、坐地铁，还是排队，都可以拿起手机对讲）这个创新使人们可以随时随地通过语音进行交流。标志性的系统声音与功能界面已成为经典。
2011年年底，尤其是2012年的中央电视台春晚，“摇一摇”功能走进了用户生活。如今，它已经成为微信拥抱O2O的主要互动方式（如摇优惠、摇电视、摇周边）。
2012年年初的“相册”，让用户拥有了一个简单整洁的朋友圈。虽然现在的朋友圈仍然有广告出现，但是用户至少有一定的选择权——可以选择对某些广告“我不感兴趣”。
2012年7月，微信网页版（见图1-2）推出，微信从此进入桌面时代。之后还接连发布针对Windows版（见图1-3）和Mac版（见图1-4）的客户端微信。与手机端微信相比，PC端微信拥有除去“朋友圈”之外的绝大部分功能。这样，人们再也不用在上班时间盯着手机屏幕查阅微信消息了。
图1-2 微信网页版
图1-3 微信Windows版（微信2.2.0.46）
图1-4 微信Mac版（微信2.0.4）
2013年8月，微信支付推出。腾讯财付通一直都是支付宝的强劲对手，微信支付的推出，再次给支付市场带来了一场巨变。从此，人们付账时都会问一句：“老板，可以微信支付吗？”商户倘若不接入微信支付，似乎就无法做生意了。由此可见，微信支付已深入人心。
2014年1月27日，微信红包席卷了整个春节，它打破了传统，改变了过年红包的发放方式，人们足不出户便可以送出祝福。更具趣味性的是“拼手气红包”，每个人抢到的红包金额都是随机的，跟抢红包的时间先后无关。
2014年9月，朋友圈小视频的发布让朋友圈再度活跃起来。用户可以录制发送一段6s的短视频，在朋友圈中传播。小视频的编码是经过微信团队精心优化的，能最大限度地节省用户流量。
2016年1月底，临近春节，朋友圈突然被马赛克刷屏，这就是“红包照片”。用户单击发布朋友圈按钮，可以看见微信红包照片选项，发布成功之后，该照片将被模糊处理，如需评论或者看清照片，需要向好友发送红包，金额由微信随机决定。一时间，带有各种“我和我男朋友”“小时候的萌照”等标题的内容席卷朋友圈。需要说明的是，红包照片只可在特定时间使用。
2017年1月，临近春节，微信红包又放出新玩法：面对面红包。发红包不再需要加好友或者建群，包好红包并出示二维码，大家就可以领取红包，这为2017年春节讨红包又增添了乐趣。
2017年12月，微信小程序新增入口，下拉主界面任务栏即出现用过的小程序，同时新增了游戏类小程序。
2018年1月，人们终于盼来了微信账号的切换功能，这对于有多个微信账号的用户来说省去了不少麻烦事。另外，“发现”页管理的功能也给用户提供了更多选择，用户可以自定义显示或隐藏某些功能入口，从此“发现”页返璞归真。
微信一次又一次的创新，给人们带来了惊喜和期待。如今，人们通过微信进行聊天、阅读、社交、购物，已经越来越离不开微信了。微信已经深入人心，融入到了生活的每个角落。这正是一个生活方式。
手机占据了人们越来越多的时间，每天只有24小时，除去睡觉和工作，陪伴家人和身边朋友的时间已经不多了。而在跟朋友一起吃饭时，在家人身边时，“低头族”们正沉醉在微信的世界里无法自拔。不敢想象没有了微信的生活会变成什么样。我曾经关闭朋友圈两个星期，其实并没有之前想象的那么糟糕，我的生活依旧，并且我跟家人、朋友有了更多的交流时间。假如一定要说失去了什么，那就是朋友圈的那些“八卦”：谁去哪里旅行了，谁去了哪家餐馆吃饭，等等。
1.2 微信公众平台2012年8月23日，微信公众平台正式上线。微信不再只是一个聊天工具，它正在缔造一个生态系统。
“再小的个体，也有自己的品牌”这句标语让人们看到微信未来更多的可能。微信的亿级用户，具有极大的用户挖掘价值，也为这个新的平台增添了更加优质的内容，创造了更好的黏性，从而形成一个生态循环。
微信公众平台主要面向个体户、企业、政府、媒体、个人和组织。在这里可以通过渠道将自有品牌推广到线上平台。
公众平台账号分为3类。
给企业和组织提供更强大的业务服务与用户管理能力，帮助企业快速实现全新的公众号服务平台。
为媒体和个人提供一种新的信息传播方式，构建与读者之间更好的沟通与管理模式。
为企业或组织提供移动应用入口，帮助企业建立与员工、上下游供应链及企业应用间的连接。
这些官方说明听起来有点复杂，其实理解它们三者之间的区别，便可知何时、何种条件下应该使用哪种账号。
服务号，偏向于提供服务及互动（如查询服务、商品售卖），每个月可群发4条消息，推送的消息会直接出现在用户的聊天列表中。
订阅号，偏向于为用户传达资讯（类似于报纸），每天只可群发一次消息，推送的消息会置于“订阅号”文件夹中，需要用户进入文件夹查找订阅号，因此入口较深。
企业号，用于公司内部通信，需要验证用户为企业身份后才可关注。
由上述可知，服务号侧重于提供服务和互动，订阅号侧重于提供简单的资讯。简单地说就是，服务号可以给用户提供更多、更丰富的内容和体验。当然，它们的申请门槛也不一样。
订阅号可通过微信认证资质，审核通过后有一次升级为服务号的机会，升级成功后类型不可变；服务号不可变更为订阅号。
另外，只有认证后的服务号才可申请微信支付。订阅号不可申请微信支付。微信公众平台高级模式中有编辑模式和开发模式两种。
在此模式下，可以通过简单的界面逻辑来设置自动回复，服务号还有公众号底部自定义菜单功能。
在此模式下，开发者可以通过公众平台提供的接口，实现自动回复、获取订阅者、自定义菜单等。
编辑模式上手容易，不要求编写代码，响应速度快，不依赖于第三方开发者服务器。但是它的扩展功能有限，不能调用公众平台提供的九大高级接口，无法实现大部分定制化功能。因此，对于有开发能力的个人或企业，建议使用服务号来实现公司的核心业务功能，同时使用订阅号辅助来进行资讯推广，最大限度地利用微信公众平台的服务号和订阅号各自的优势，为企业发展提供有力保障。
关于公众号的注册数量，有一点需要特别补充说明：2018年2月，微信公众平台发布公告，正式调整了公众号注册数量，个人号每人可申请的上限从之前的5个调整为2个，组织类每个主体可申请的上限由原来的50个调整为5个。另外，如果有多个账号需求，相应的个人和组织可发起申请流程，微信公众平台进行初审，并报互联网信息内容主管部门审批同意，则账号注册数量可得到适当放宽。
1.3 企业号2014年9月18日，微信企业号正式公测。微信企业号是一个互联网化连接器，它可以帮助企业实现业务及管理互联网化。
企业号可以帮助政府、企业及组织高效地构建自己独有的生态系统，随时随地连接员工、上下游合作伙伴及内部系统和应用，实现业务及管理互联网化。这些功能具体体现在以下4个方面。
通讯录可灵活地管理组织架构，连接员工和上下游；企业级的权限体系可支持层层授权的管理模式。
帮助用户构建基于微信的线上业务，通过扫一扫、摇一摇、支付和卡券将线上与线下进行连接，实现新的融合场景。
企业号可作为移动应用入口，通过统一的身份认证，方便地连接内部系统和应用，消除信息孤岛现象。
企业号的开放生态吸引了大量的SaaS服务商和定制化服务商，用户可以方便地选择第三方应用和服务。
除此之外，企业号还提供可靠的安全保障以及丰富的功能体验，如企业通讯录、权限分级、统一的会话入口、自由收发消息、保密消息、应用定制、微信原生功能和安全开放的接口等。
1.4 企业微信2017年5月，微信宣布企业号升级为企业微信。企业微信继承原企业号所有功能并保留相关数据，而企业号管理后台被整合至企业微信管理后台进行统一管理。
微信早期推出的企业号是对B端企业市场的尝试，在企业号基础上继续推出企业微信，代表着微信进军企业市场的决心与信心。
我在体验企业微信后发现，企业号在企业微信中存在独立模块，名叫“微信插件”，如图1-5所示。新建“企业应用”，就相当于新建了一个企业号应用。“微信插件”可以不依托于企业微信APP，加入企业后，可以在微信的“通讯录”→“我的企业”中进入企业以找到相应的企业号，并且可以在微信中接收企业通知，使用企业应用。
图1-5 微信插件
1.5 小程序2016年1月9日，是应用号（小程序）的启动日。经过一年的不断改进，小程序逐渐地找到了自己的定位和形态。小程序于2016年11月开始公测。在同年年底的微信公开课上，张小龙宣布微信小程序的发布时间是2017年1月9日。从启动到发布，历时刚好一年。
小程序的设计目标主要是解决高频使用场景下的用户体验问题。小程序代表了一种表达方式，它是一种信息的载体。相对而言，其更多的场景代表了一种可触达性。
从技术实现的角度看，它不以HTML 5网页或Hybrid的形式存在。简单地说是，小程序是运行在微信这个应用之上的应用，它是订阅号和服务号的扩展。小程序可以使微信生态拥有更多的应用场景和服务入口。
1.6 微信开放平台微信推出公众平台之后，又推出了开放平台。开放平台为第三方应用程序提供接口，可以将第三方内容分享到朋友圈和聊天会话中，以便更大范围地传播信息，其最大的优势是可以开通支付功能。
微信开放平台能在以下4类开发场景中应用。
允许移动应用支持微信分享、微信收藏和微信支付，使第三方应用和微信在一定程度上互联。
允许网站支持使用微信账号登录。用户只需用微信“扫一扫”功能便可实现登录，还可以在网站自有账户体系和微信账户之间建立连接关系。
微信公众号开发，可以为亿万微信用户提供便捷的服务。
公众号第三方平台，可以为广大公众号提供运营服务和行业解决方案。
微信开放平台主要面向APP开发者。通常是拥有了应用之后，通过开放平台将内容分享至朋友圈或发送给微信好友。例如，QQ音乐APP的分享可直接发送到朋友圈（见图1-6），或者是通过微信授权来登录APP（见图1-7）。
图1-6 QQ音乐分享至朋友圈和微信好友
图1-7 QQ音乐可以使用微信账号登录
1.7 微信支付微信支付改变了人们的支付体验，让支付变得更加轻松。它是集成在微信客户端的支付功能，用户可以通过手机快速完成支付流程。微信支付以绑定银行卡的快捷支付为基础，向用户提供安全、快捷、高效的支付服务。
要接入微信支付，则公众号必须是认证的服务号，并且开通微信支付认证。
微信支付的支付模式主要有刷卡支付、扫码支付、公众号支付、H5支付、APP支付以及小程序支付。
刷卡支付，用户展示微信钱包内的“付款”给商户系统，扫描后直接完成支付，主要应用场景是面对面线下收银。
扫码支付，商户系统按照微信支付相关协议生成支付二维码，用户使用微信“扫一扫”完成支付的模式。这种模式的主要应用场景有PC网站二维码支付、实体店单品或订单支付等。这种模式又称为Native（原生）支付。扫码支付中用到的支付二维码寻找路径为 “我”→“钱包”→“付款”，如图1-8所示。
图1-8 扫码支付路径
公众号支付，用户在微信中打开商户的H5页面，商户在页面中通过微信支付提供的JSAPI接口调用微信支付模块完成支付。主要应用场景包括：用户进入商户微信公众号，打开某个商品页面完成支付；用户通过好友分享的朋友圈、聊天窗口等入口获得购买链接，单击链接后打开页面完成支付；商户将商品页面转换成二维码，用户扫描二维码后在微信浏览器中打开页面后完成支付。
公众号支付依赖于微信浏览器环境的JSAPI提供的桥接支付模块。
H5支付，商户在微信客户端之外的移动端网页展示商品或服务，用户在这些页面确认使用微信支付时，商户发起本服务响应微信客户端进行支付。
H5支付主要用于触屏版手机浏览器请求微信支付的场景，用户可以方便地从外部浏览器唤起微信支付。不过，H5支付模式的申请门槛较高。
另外，微信官方也不建议在APP端使用H5支付。我在实践中发现，iOS和Android系统自带的浏览器以及主流浏览器（如QQ浏览器、UC浏览器等）均支持H5支付，但在某些APP中使用H5支付会出现无法支持微信的异常情况。我推测可能是APP对WebView进行了限制，不支持H5支付的协议。
APP支付，又称为移动端支付，是商户通过在移动端APP中集成开放SDK，调用微信客户端的支付模块完成支付的模式。
小程序支付，用户在微信小程序中使用微信支付的场景。
微信支付的六大支付场景，几乎涵盖了用户日常生活中的所有线上线下支付需求，为O2O行业的支付环节提供了有效的解决方案。
1.8 表情开放平台微信表情开放平台，对所有人开放，只要设计的表情能让大家在聊天时开怀大笑，就有机会登上微信客户端，获得亿万微信用户的关注。按照一定的规范，表情在制作完成后会经过审核，通过之后便可以供大家下载使用。用户下载表情时，如果觉得满意，还可以使用微信支付“赞赏”作者，让作者的付出得到回报。
1.9 微信广告2015年1月，朋友圈出现了第一批商业广告，如图1-9所示。微信试图重新定义社交广告，让广告成为生活的一部分。
图1-9 朋友圈广告
微信广告目前有朋友圈广告和公众号广告两种方式。
朋友圈广告基于微信公众号生态体系，以类似朋友的原创内容形式进行展现，在基于对微信用户画像进行精准定向的同时，通过实时社交混排算法，依托关系链进行互动传播。这是一种比较有趣的广告呈现方式，出现在朋友圈的广告，大家可以自由评论。这种新颖的呈现方式，让广告的内容成为一个大家热议的话题。再加上朋友圈广告的精准投放，让产品、内容、服务这些身边的事物，出现得恰到好处。
除此之外，微信广告还会出现在公众号内，可以用于推广微信卡券、增加粉丝等。
1.10 微信互联网纵观互联网发展史，从早期的PC互联网到移动互联网历经了将近20年的时间，而移动互联网发展到今天也超过10年了。在移动互联网时代，入口为王，入口即流量，拥有了入口，就意味着拥有了移动互联网的“船票”，而微信就是腾讯拿到的一张移动互联网“船票”。
2018年年初，微信及WeChat的合并月活量已超过10亿，微信俨然成为了一个超级入口、一个物联网的入口ID。微信可以满足用户对未来智能生活的绝大部分需求，微信互联网的时代已经到来。如果说微信是一棵树，那么它俨然是一棵参天大树。微信以社交为基石孕育出无限的想象空间，而支付、小程序、搜索以及游戏则是结出的累累果实，这些与每个用户息息相关的高频使用业务让“微信，是一个生活方式”变得更加丰满。
1.11 小结本章围绕微信生态展开讨论，介绍了微信生态的公众平台（服务号、订阅号和小程序）、微信开放平台和微信支付等主要组成部分。微信已经不再是一个简单的手机应用，它正在改变着人们的生活方式，正在成为一个重要的链接器，微信互联网的时代已经到来。第2章将开始讲解微信公众号开发的相关技术内容。
本章主要介绍微信公众平台前后端开发环境的搭建和涉及的主要技术点，并介绍一个基于PHP的公众号开发框架。本章有较多概念性的知识，如对本章内容已经有所了解，可直接进入其他章节的阅读。
2.1 开发环境软件开发环境是指为支持软件开发而使用的一组软件，它由软件工具和集成环境组成，通俗地讲，就是软件的开发需要在一定的环境中使用特定的工具来进行。犹如建设一栋房子，建房子所需要的手续就是集成环境，它是大前提，工人以及运输工具（如吊车）就是软件工具，而开发人员就是设计者，决定如何对房子进行设计和建造。
微信公众平台以及小程序的开发，同样需要开发环境的支撑。简单地讲，微信公众平台开发与传统的B/S架构系统比较类似，分为前端开发与后端开发；而开发微信小程序时，微信官方提供了标准的开发框架及开发工具。但是当两者呈现动态内容时，都需要与服务端交互，因此，这里先介绍服务端的开发环境。
开发环境的选择与使用的后端开发语言有一定的关系。微信公众号的后端开发语言不限，只要能与微信服务器正常交互即可。常见的后端开发语言有Java、PHP、C#、Python、Node.js和Go语言等。微信官方的SDK代码示例通常有PHP、Java和Node.js 3个版本，我选择的后端开发语言是PHP，本书也将以PHP为主介绍相关开发内容。
2.2 集成软件包公众号或小程序与服务端交互时，通常是发送一个HTTP请求到服务端，因此服务端需要有能处理请求的服务存在。Web服务器接收并响应请求，处理的过程中可能会涉及数据库的交互，因此需要数据库服务来存储数据。另外，程序设计语言也需要运行环境的支撑。因此，一个简单而完整的HTTP服务端开发由Web服务器、数据库和程序设计语言运行环境组成。
分别安装上述3个软件会比较烦琐，安装完成之后还需要做许多配置。为了简化搭建服务端开发环境的过程，可以选择集成软件包。它集成了运行程序的基本环境，主要包括HTTP服务器、数据库管理软件以及程序设计语言运行环境，如图2-1所示。
图2-1 集成开发环境架构
这类集成软件开发包主要包括以下4个。
只支持在Windows系统下安装使用的一个开源平台。
只支持在Linux系统下安装使用的一个开源平台。
只支持在Mac系统下安装使用的一个开源平台，支持PHP多版本切换。
开头的X代表X-OS，表示可以在任何常见操作系统下使用，包括Windows、Mac、Linux以及开源平台。
上述几个集成软件开发包，从跨平台、易用性、可扩展性和可配置性等方面综合对比，我选择的是XAMPP。XAMPP是Apache（HTTP服务器）、MySQL（数据库管理软件）、PHP（程序设计语言）和Perl（脚本语言）的简称。
读者可根据自己的操作系统选择合适的XAMPP版本。XAMPP属于Apache发行版，是Apache Friends（一个推广Apache服务器的非营利性项目）旗下的产品。感兴趣的读者还可以加入社区。
我下载的是XAMPP for OS X版本，其安装过程非常简单。需要注意的是，在选择安装组件这一步时，如图2-2所示，需要勾选“XAMPP Core Files”，这样才能安装完整的集成软件开发包。XAMPP的默认安装目录是/APPlications/XAMPP。
图2-2 选择安装组件
安装成功后，启动程序，然后选择“Manage Servers”，再选择“Apache Web Server”并启动Apache。启动成功后，绿色小灯会亮起，如图2-3所示。假如启动失败，则可以切换到APPlication log查看原因，问题可能包括端口被占用、目录权限等。
图2-3 启动XAMPP
切换到欢迎页“Welcome”，单击右下角的“Go To APPlication”，会自动打开浏览器进入欢迎页。也可以直接在浏览器输入http://localhost，如果出现如图2-4所示的界面，则说明安装XAMPP成功。
图2-4 XAMPP欢迎页
选择“Configure”，出现一个简单的设置界面，在这里可以设置http以及https的端口，默认是80和443。“Open Access Log”和“Open Error Log”可以分别查看Apache的访问日志和错误日志。
下面介绍与项目开发密切相关的目录和配置文件。
Apache的DocumentRoot为默认请求根目录。建议将新建的每个Web项目代码都放到这里，否则需要通过别名映射到其他目录，或者是使用虚拟目录来实现。
PHP配置文件。配置PHP的so模块加载、文件上传大小限制等。
Apache配置文件。配置Apache根目录、监听端口、加载的PHP扩展等。
Apache虚拟目录配置文件。
接下来新建一个PHP项目，将其命名为dev.hello1010.com。在Apache的站点根目录/APPlications/XAMPP/htdocs下新建dev.hello1010.com目录，并新建index.php文件，输入代码打印phpinfo信息。
<?php phpinfo();打开浏览器，输入http://localhost/dev.hello1010.com/即可访问，如图2-5所示。至此，一个简单的基于PHP的公众号后端开发环境就搭建完成了。当然，这里并没有任何业务逻辑。
图2-5 访问dev.hello1010.com
由于Apache的默认Web应用目录是/APPlications/XAMPP/htdocs，如果要把项目放到其他目录下，则需要用到Apache的虚拟主机技术。它的主要优势是可以为每个站点配置便于访问的本地域名；可以把应用目录移动到htdocs之外的其他目录，加大磁盘空间，而且安全性好。另外，在多人协作开发时，只要保证各开发者本地的Virtual hosts是一致的，那么大家访问的URL也都是一样的，URL中就不会出现localhost，而且可以解决本地跨越访问的问题。
按照下面的3个步骤配置以完成虚拟目录的设置。
① 修改Apache配置文件。进入XAMPP的安装目录，编辑httpd.conf文件。
/APPlications/XAMPP/xamppfiles/etc/httpd.conf定位到靠近文件底部的位置或直接搜索“Virtual hosts”，删除下方被注释的“Include etc/extra/httpd-vhosts.conf”前面的“#”，如图2-6所示。如果没有被注释，则跳过这一步。
图2-6 开启Virtual hosts功能
② 修改Apache的httpd-vhosts文件。进入Virtual hosts目录，在/APPlication/XAMPP/xamppfiles/etc/extra目录下，打开httpd-vhosts.conf文件，在文件末尾新增配置代码，如下所示。
<VirtualHost *:80>
DocumentRoot "/APPlications/XAMPP/htdocs/dev.hello1010.com/" ServerName dev.hello1010.com
ErrorLog "logs/dev.hello1010.com.com-error_log"
CustomLog "logs/dev.hello1010.com-access_log" common
<Directory "/APPlications/XAMPP/htdocs/dev.hello1010.com/">
Options Indexes FollowSymLinks Includes ExecCGI
AllowOverride All
Require all granted
</Directory>
</VirtualHost>在这里，设置的域名是dev.hello1010.com。读者的域名可以根据自身情况修改。错误日志和访问日志均在/APPlications/XAMPP/xamppfiles/logs/下，并设置站点根目录为/APPlications/XAMPP/htdocs/dev.hello1010.com。
③ 配置localhost文件。打开电脑终端，输入命令“sudo vim /etc/hosts”，按提示输入密码，如图2-7所示。进入vi模式，输入“i”编辑localhost文件，如图2-8所示。在文件末端新增一行代码，把域名“dev.hello1010.com”映射到本地“127.0.0.1”，编辑完成后保存文件并退出。可以通过ping域名的方式来验证是否配置成功，如图2-9所示输入以下命令。
ping dev.hello1010.com图2-7 编辑本地hosts文件
图2-8 编辑本地localhost文件
图2-9 ping域名验证配置是否设置成功
至此，基于Apache虚拟目录的站点配置就完成了。在浏览器输入dev.hello1010.com即可访问，效果等同于访问localhost/dev.hello1010.com。不过，假如此时直接输入http://localhost，则会提示报错，那是因为这里启用了Apache的虚拟目录方式，也要在配置文件中指定localhost的目录，同样，在httpd-vhosts.conf新增如下代码。
<VirtualHost *:80>
DocumentRoot "/APPlications/XAMPP/htdocs/"
ServerName localhost
ErrorLog "logs/localhost-error_log"
CustomLog "logs/localhost-access_log" common
<Directory "/APPlications/XAMPP/htdocs">
Options Indexes FollowSymLinks Includes ExecCGI
AllowOverride All
Require all granted
</Directory>
</VirtualHost>开发环境安装完成后，接下来就可以着手编码了。这里需要一个编辑器，也就是编写代码的工具。简单的方式就是使用文本编辑器，例如Windows平台下的Notepad++、Mac平台下的Sublime Text。不过这类工具功能简单，虽然也支持编程语言插件，但是假如希望省心并提高工作效率，建议使用集成开发环境（Integrated Development Environment，IDE）。这类工具通常会有一些高级功能，例如代码断点调试、类库关联等。由于这里选择的开发语言是PHP，因此接下来重点介绍PHP的IDE。
支持PHP语言的集成开发环境主要包括Eclipse、NetBeans、Zend Studio和PhpStorm等。我选择的是PhpStorm。PhpStorm是JetBrains公司开发的一款跨平台PHP集成开发环境，它是一款智能的PHP编辑器，并支持JavaScript、HTML/CSS的智能编写，PHP单元测试以及代码重构。PhpStorm的启动界面如图2-10所示。
图2-10 PhpStorm启动界面
安装完成之后，可以通过Create New Project(创建新工程)、Open(打开目录)、Create New Project from Existing Files(以向导的方式打开已存在工程)，或者Check out from Version Control（从源码版本管理器中Check out代码，例如从Subversion或GitHub 中下载代码）新建工程，如图2-11所示。
图2-11 PhpStorm打开或新建工程的方法
这里介绍的PhpStorm是PHP语言的开发环境，也就是后端语言开发环境。前面提到过，公众号开发通常由前端开发和后端开发构成。常见的前端IDE有Sublime Text、WebStorm等，这里不对前端开发工具进行过多介绍。另外，Web的开发工具中，后端开发IDE也适用于前端开发。
2.4 PHP开发框架搭建好开发环境后，接下来就可以开始编写代码了。最直接的方式就是自己从零开始写。但是为了提高生产效率，减少不必要的代码重复，通常开发者会选择一种开发框架。关于如何选择开发框架这个话题，在这里不做过多讨论，读者可根据的需要自行选择。常见的PHP开发框架有Laravel、ThinkPHP、Yii、CI（CodeIgniter）等。框架可以节省大量的开发时间和精力，并且让扩展变得更容易。我选择的是比较接近原生PHP的框架——CI。它小巧，但简单实用。
CI是一个小巧但功能强大的PHP MVC应用程序框架。作为一个简单而“优雅”的工具包，它可以为开发者建立功能完善的Web应用程序。CI为开发者提供了足够的自由，它并不是一个大而全的PHP框架，没有大规模集成类库，没有使用复杂的模板语言，无须做过多的配置即可直接使用。
CI虽小，但是“五脏俱全”。对CI感兴趣的读者，可以通读它的代码，在了解框架的同时，学习应用程序框架的设计思想。图2-12展示了CI系统的应用程序流程。
图2-12 CI系统的应用程序流程
图2-12说明了基于CI系统的应用程序流程。
① 前端访问index.php，初始化运行CI所需的基本资源。
② Router检查HTTP请求，以确定如何处理该请求。
③ 如果存在缓存文件，则直接读取缓存并输出到浏览器。
④ 在加载应用程序控制器之前，对HTTP请求以及用户提交的数据进行安全检查，例如XSS过滤。
⑤ 控制器加载模型、核心类库、辅助函数以及其他所有处理该请求所需的资源。
⑥ 渲染视图并发送至浏览器。如果开启了缓存，视图会被缓存起来用于后续的请求。
CI是基于MVC的框架。MVC是一种用于将应用程序的逻辑层和表现层分离出来的设计模式。在实际开发中，得益于这种开发方式，页面中只会包含少量的PHP脚本代码。
CI的设计目标是在最小化、最轻量级的开发包中得到最大的执行效率、功能和灵活性。从技术和架构角度看，CI可以支持动态实例化对象，组件高度独立，并且彼此松耦合。它在小巧的基础上力求做到简单、灵活和高性能。
从官网下载的源代码，解压后稍作配置即可使用，具体安装方法可参照官网文档。一个完整的CI代码目录结构如下所示。
├── application
│ ├── cache // 缓存文件
│ ├── config // 配置文件
│ ├── controllers // 控制器
│ ├── core // 核心系统类
│ ├── helpers // 辅助函数
│ ├── hooks // 钩子——扩展框架核心
│ ├── language //多语言
│ │ └── english
│ ├── libraries// 类库
│ ├── logs // 日志文件
│ ├── models // 模型
│ ├── third_party // 第三方平台代码，例如SDK
│ └── views // 视图文件
│ └── errors //常见错误页面
├── system //CI框架核心代码system目录下的文件是CI框架核心代码，application是一个完整的应用程序代码。
下载CI源码并解压到目录/APPlications/XAMPP/htdocs/dev.hello1010.com，然后在浏览器输入localhost/dev.hello1010.com或dev.hello1010.com（配置了虚拟目录）即可访问，访问效果如图2-13所示。在2.2节配置的站点根目录是/APPlications/XAMPP/htdocs/dev.hello1010.com，而CI的项目入口文件正好也在根目录，因此可以正确访问。更详细的安装说明以及安全注意事项，可参考官方文档。
图2-13 基于CI的工程首页运行效果
这里使用的是PHP集成开发环境，已经简化了Apache和PHP的配置。假如读者是自行安装的开发环境，可能会遇到一些问题。下面简单介绍可能会遇到的问题以及解决方法。
通常是CI的日志目录和默认的Session目录没有权限。打开工程目录../application/config/config.php，定位到第237行，可知日志的默认配置目录log_path是没有填写的，这是因为有默认的日志目录../application/logs/，因此可以将这个目录设置为读写权限，例如在Mac平台下，通过chmod –R 777 logs/进行设置。假如需要把日志目录设置到其他目录，则赋值给log_path一个绝对路径即可，但是也要记得将目录设置为读写权限。
另外一个是Session目录。定位到config.php的第383行，sess_save_path的值也是空的，此时CI会读取系统环境下的默认Session路径，在php.ini的session.save_path配置项中进行设置。在XAMPP集成开发环境下，这个默认目录是/APPlications/XAMPP/xamppfiles/temp/。假如读者要给CI的Session存储路径重新赋值，切记需要确保新目录有读写权限。
CI默认访问的Controller和action是Welcome这个Controller下的index方法，假如尝试在Welcome下新增一个action（如hello），再访问这个新的action，那么此时它的访问URL是http://dev.hello1010.com/index.php/welcome/hello。URL中必须带上index.php。事实上，如果想要美化这个访问URL，可以在URL中去掉index.php，使它看上去更像是一个MVC框架的访问路径。但是当尝试去掉index.php访问时，会出现Object not found报错。这就需要开启Apache的URL重写功能，并在项目代码中进行简单的配置。
打开httpd.conf文件，搜索mod_rewrite。假如mod_rewrite模块被注释，则去掉前面的注释，之后应该会显示如下的代码。
LoadModule rewrite_module modules/mod_rewrite.so在工程根目录（与application文件夹所在目录）下新建配置文件“.htaccess”，并输入以下代码。然后重启Apache，再次输入http://dev.hello1010.com/welcome/hello即可访问。
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]在实际的项目开发过程中，可能会包含多个Web站点，假如多个站点之间关联性较大，通常会把这些站点部署到同一台服务器，并且后续的服务升级也是同步的。对于CI源码的管理，一个简单的方式就是每个站点都使用单独的CI代码，之后的CI框架源码BUG修复以及升级都单独处理。但这样势必会比较烦琐而且容易出错，因此这里探讨一种多个站点共享一份CI源码的架构方式，需要对原生的CI目录构造及其入口文件进行少量修改。改造后的目录结构如下所示。
├── application
│ └── wechat // 应用程序目录
│ ├── cache // 缓存文件
│ ├── config // 配置文件
│ ├── controllers // 控制器
│ ├── core // 核心系统类
│ ├── helpers // 辅助函数
│ ├── hooks // 钩子——扩展框架核心
│ ├── language //多语言
│ ├── libraries // 类库
│ ├── logs // 日志文件
│ ├── models //// 模型
│ ├── resource // 资源文件，存放 css、js和图片等文件
│ ├── third_party // 第三方平台代码，例如 SDK
│ └── views // 视图
│ └── app2 // 应用程序app2目录
│ └── app3 // 应用程序app3目录
├── service //公用业务逻辑
│
├── system //CI 源代码进行的改动有两个部分：把原先application目录下的所有文件及文件夹移到wechat 目录下，并最终归到application目录中，与system目录平级。这样做的目的是，希望所有的站点都统一到application目录里，各个站点独立运行，共享CI的同一套system代码，以便于管理和进行CI的升级。由于应用程序wechat相对于system的目录层级发生了变化，因此在wechat/index.php入口文件中，需要修改application_folder和system_path的值。
$system_path = '../../system';
$application_folder = '../application/wechat';后续增加站点时，只需要在application目录中新增一个文件夹，并复制原先application 目录下的所有代码（CI原生目录结构下的application）到新文件夹， 修改index.php中的application_folder和system_path的值，就可以完成站点的接入。
另外，我在wechat/core目录下新增了一个MY_Controller.php文件，继承自CI_Controller类，在这里实现一些控制器的基本方法，例如，统一登录、视图渲染等。同时还有MY_Model和MY_Loader两个文件。完整的目录结构和代码可参考本书的源代码。
在使用微信公众号的API时，通常需要做一些简单的封装，以便于实现项目代码的复用，统一管理相关接口以及全局性数据。例如，接口调用凭据access_token的使用，假如在项目代码中多处随意调用获取access_token的代码，而不进行缓存处理，则可能会因为调用次数过多而导致接口调用失败（微信公众平台限制）。因此，对微信公众号开发接口的二次封装显得很重要。
读者可以根据需要自己封装公众号接口，也可以选择一些开源且成熟的框架来直接使用，避免重复编写代码。我也选择了一个开源框架代码，并将其集成到wechat工程中。
由于封装好的接口代码属于第三方代码，因此要把下载的类文件wechat.class.php放到wechat/third_party/wechat目录下，并在libraries目录中新建wechat.php文件，通过继承wechat类来改写部分方法，比如构造函数以及与缓存相关的方法。如代码清单2-1所示。
代码清单2-1
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
require_once(dirname(__FILE__) . '/../third_party/wechat/wechat.class.php');
class Wechat extends WechatApi {
protected $_CI;
public function __construct() {
$this->_CI =& get_instance();
$this->_CI->config->load('wechat');
$options = $this->_CI->config->item('wechat');
$this->_CI->load->driver('cache', array('adapter' => 'redis'));
parent::__construct($options);
}
/**
* 重载设置缓存
* @param string $cachename
* @param mixed $value
* @param int $expired
* @return boolean
*/
protected function setCache($cachename, $value, $expired) {
if($this->_CI){
return $this->_CI->cache->save($cachename, $value, $expired);
}
return false;
}
/**
* 重载获取缓存
* @param string $cachename
* @return mixed
*/
protected function getCache($cachename) {
if($this->_CI){
return $this->_CI->cache->get($cachename);
}
return false;
}
/**
* 重载清除缓存
* @param string $cachename
* @return boolean
*/
protected function removeCache($cachename) {
if($this->_CI){
return $this->_CI->cache->delete($cachename);
}
return false;
}
}在构造函数中加载了与微信相关的配置文件（包含APPId、Token等信息）、初始化缓存，并重写了缓存操作的３个函数。与微信相关的配置文件，存放在各个环境的目录下，例如正式环境production的微信公众号配置文件存放在 wechat/config/production/wechat.php中，代码如下所示。
$config['wechat'] = array( 'token' => 'your_token', 'appid' => 'your_appid',
'appsecret' => 'your_appsecret',
'debug' => false, 'encodingaeskey' => '');在需要使用公众号接口时，只需要加载这个库文件，再调用相应方法即可，如下所示。
$this->load->library('wechat');
$this->wechat->getOauthAccessToken();关于项目中的更多细节，读者可下载本书源代码查看。
2.5 小结本章主要介绍微信公众号的开发环境及其相关技术，首先介绍主流的集成软件开发包，并从不同维度进行对比，然后选定XAMPP作为讲解示例，并详细介绍了配置 过程。IDE选择的是PhpStorm，并介绍了PhpStorm的基本使用。最后介绍了一个PHP的开发框架——CI，基于这个框架，进行了简单的改造，使其更适用于实际的项目开发。本章的开发环境搭建，只是作为一个示例，读者可以根据自身需求选择其他开发环境。接下来的一章将介绍微信公众号开发前需要具备的知识。
