1. 微信小程序开发概述

1.1 微信小程序特点

微信小程序是微信平台提供的一项开放技术，服务于企业用户，用于构建移动端的一种“轻应用”。这类应用无需下载安装，用户通过扫一扫或者搜索就可以打开，不用担心手机安装太多应用而导致空间不足。微信小程序上线后，与订阅号、服务号、企业号一起成为微信的企业应用体系。

微信小程序运行于微信平台，兼容不同手机平台，利用微信小程序开发的应用无需兼容多个平台，开发完成后可直接在多个平台上运行，降低了应用开发的门槛。

针对传统H5应用的不足，微信小程序对用户交互性能做了大量优化，使得微信小程序在某些用户体验上已经接近App的水平。

微信小程序并没有采用Web编程中的+CSS3+组合，微信小程序采用了腾讯新定义的技术规范和架构，但微信小程序的开发与Web编程、微信公众号编程非常相似，对于前端开发者来说，从Web开发迁移到微信小程序的开发成本并不高。微信小程序吸收了主流前端开发中数据、样式、控制逻辑分离的理念，将每个页面分为WXML文件、WXSS文件、JSON文件、JS文件四个文件。其中JS文件使用标准语法规范进行逻辑操作，JSON文件基于JSON语法规范，用于页面文件的配置，WXML文件基于XML语法规范，用于描述页面的可视化组件，WXSS继承了标准CSS语法，用于定义WXML组件的样式。

在网页开发中，渲染线程和脚本线程是互斥的，但在微信小程序中，它们被分离出来，运行在不同的线程中。微信小程序的渲染层和逻辑层分别由两个线程管理：渲染层界面使用 进行渲染；逻辑层使用线程运行 JS 脚本。一个小程序有多个界面，因此渲染层也有多个线程。这两个线程之间的通信会通过微信客户端进行中转，逻辑层发送的网络请求也会经过转发。小程序的通信模型如图所示。

Web 开发者可以使用浏览器 DOM API 来操作 DOM 对象。小程序的逻辑层和渲染层是分开的，逻辑层运行在 中，没有完整的浏览器对象，因此缺少相关的 DOM API 和 BOM API。这个差异导致一些前端库，例如 ，无法在小程序中运行。同时环境也不同，所以一些 NPM 包无法在小程序中运行。

小程序每次冷启动时都会检查是否需要更新版本，如果发现有新版本，则会将新版本的代码包下载到本地。因此小程序的页面加载都是基于本地的，不需要频繁发送网络请求来获取页面文件，所有页面跳转也不需要与服务器交互。这将大大提高小程序的执行效率，提供比H5 Web应用模式更好的用户体验，操作流畅度和响应速度会更好。这也意味着微信小程序可以在没有网络连接的环境下使用。结合本地存储，小程序可以满足网络临时断线或者网络​​状况较差的场景需求，这是微信服务号和H5都无法实现的。

微信小程序的出现，为开发者提供了全新的应用开发框架。除了可以选择APP开发、H5开发（网页开发）、微信公众号开发之外，还可以选择使用微信小程序来实现移动端应用。接下来我们将微信小程序与APP、微信公众号进行对比，帮助大家了解这三种产品的优缺点，让大家在开发应用时能够做出正确的选择。

小程序与应用程序的区别

App，大多数情况下也叫APP，具有非常好的性能和体验、组件支持齐全、接口丰富的特点。但是App也有一系列的缺点，主要有：

微信小程序和微信公众号

微信小程序与微信公众号（服务号）功能上有一定的重合，都可以用来实现企业级应用。特别需要指出的是，微信早期只提供了微信公众号，企业级应用基本都是使用微信公众号实现的。微信公众号本质上是一个H5应用，具有传统H5应用的特点，比如每次刷新页面都要去服务器读取内容。因此，微信公众号虽然也能实现企业服务，但是在用户体验上和PP相比还是有很大差距。微信小程序的目标是提升应用的用户体验，让其接近APP的水平，因此微信小程序的出现，让它在定位上和微信公众号有了明显的不同。基本上可以按照以下几个标准来做选择：

小程序面向产品和服务，主要以实现业务功能为主，致力于打造线上线下融合的企业服务场景。

微信公众号主要服务于企业和个人的营销和信息传递需求，是一种新的信息传播方式。公众号依托粉丝经济，与H5结合后，可以提供一些简单的公众号内营销和互动功能。

微信小程序对用户交互性能做了很多优化，用户体验接近APP。公众号开发采用H5开发技术实现交互功能，运行环境基于浏览器，相当于移动端Web应用。因此微信公众号主要应用于业务逻辑和交互简单的应用。体验好的应用应该使用小程序进行打造或改造。

具体来说，微信小程序被微信平台开放了较多的接口功能，基本可以覆盖大部分行业需求。相较于公众号，在视频直播、商城、小游戏等互动性强的领域表现更佳。公众号开发适合微商城、微官网等用户互动性相对较少的应用类型。

虽然微信公众号和小程序各自都有一定的应用场景，但在实际使用中，并不是非此即彼。一个企业可以同时注册微信公众号和小程序。企业利用微信小程序承载企业服务，利用公众号进行企业宣传营销。微信公众号是单独申请的，微信小程序可以单独申请，也可以通过微信公众号快速申请。对于没有公众号和小程序的商家，正确的申请和注册流程应该是先申请微信公众号认证，然后在公众号后台的【小程序管理】页面直接快速注册小程序。微信公众号+小程序的模式已经成为企业运营和推广的标配。

1.2 微信小程序开发流程1.2.1 注册小程序

开发微信小程序，首先要注册一个小程序账号，注册成功后登录微信小程序管理后台，完成小程序开发者绑定及开发信息配置，之后开发者即可下载开发者工具，使用开发者工具开发小程序。

微信公众号是单独注册的，微信小程序可以单独注册，也可以通过微信公众号快速注册。对于没有公众号和小程序的商家，正确的申请流程应该是先申请认证的公众号，然后在公众号管理后台的【小程序管理】页面快速申请小程序。微信公众平台的网址是：。注册微信小程序需要邮箱作为账号，小程序注册成功后，即可使用邮箱+登录密码登录微信小程序管理后台。为了方便开发者开发和体验小程序的各项功能，开发者可以为小程序申请一个测试账号，并利用该账号在开发者工具中创建项目并进行开发测试，以及真机预览体验。小程序测试账号可以让开发者免去繁琐的注册流程，降低小程序开发初期的使用门槛。小程序测试账号申请地址为：

1.2.2 小程序开发配置

成功申请小程序开发账号后，你需要登录小程序管理后台进行小程序设置，填写小程序基本信息，如名称、头像、介绍、服务范围等。

你可以在【开发】->【开发管理】页面中看到小程序ID，小程序ID相当于小程序平台的身份证，后续很多地方都会用到它。

另外，开发小程序前需要在微信小程序后台将开发者微信账号添加为项目成员，只有添加为小程序项目成员的人员才能使用微信小程序开发工具进行开发、调试、上传程序包等功能。建议将所有研发人员添加为项目成员，项目团队中其他非开发者如果需要体验小程序功能，则需要添加为体验成员。

1.2.3 使用开发者工具开发小程序

由于小程序采用渲染与逻辑分离的运行机制，与传统网页的运行机制不同，无法使用传统网页编程中的开发调试工具。为此，微信推出了一站式小程序开发IDE：微信开发者工具。开发者可以使用微信开发者工具完成小程序代码开发、编译运行、界面及逻辑调试、真机预览、提交发布版本等工作。

你可以在小程序开发文档中找到小程序开发工具的下载页面，或者直接输入以下网址进入小程序开发工具的下载页面：。在小程序开发工具的下载页面，根据你的操作系统下载对应的安装包并安装。需要注意的是，小程序开发工具只支持7.0及以上版本，Mac上支持OS X 10.8及以上版本。还需要注意的是，微信小程序网页开发工具需要扫码登录后才能使用，所以使用前必须绑定开发者。

首次使用开发者工具调试小程序时，会出现错误提示：“不在合法域名列表中”。这是因为小程序中发起了wx.请求，但是小程序管理后台没有设置请求的域名。设置服务器域名请到小程序管理后台【开发】->【开发管理】->【开发设置】->【服务器域名】。配置时注意：域名只支持（wx.、wx.、wx.）和wss（wx.）协议。域名不能使用IP地址（小程序局域网IP除外）或者其他方式。

为了降低开发门槛，开发者工具提供了即使你没有申请服务器域名也可以编写和调试小程序的选项。在微信开发者工具中点击【详情】->勾选【不验证合法域名】。这样就可以正常使用wx.功能发送网络请求了。不过要注意的是，这只是为了简化开发，当小程序发布到线上时，这种方法就不起作用了，这时候就需要你配置一个合法的域名了。

如果小程序中使用并引用了第三方页面，在运行调试小程序时会出现“页面未找到”的错误提示，此时需要配置业务域名，由于微信小程序本身的限制，无法在Web-view中直接跳转H5页面，需要先配置业务域名，才可以在Web-view中跳转H5页面。