快速开发微信小程序之一

一、背景

记得11、12年的时候大家一窝蜂的开始做客户端Android、IOS开发，我是直14年才开始做Andoird开发，干了两年多，然后18年左右微信小程序火了，我也做了两个小程序，一个是将原有牛奶公众号的功能迁移到小程序，用户体验得到极大的提升，另外一个是给老板娘做的一个简单的卖蜂蜜的小程序，当时投入3个人，两周左右搞定（老板娘瞒着老板）。

微信小程序开发其实还是比较简单的，小程序端代码和Vue整体架构差不多，比较复杂的就是登录和支付这两块，因为这两块涉及到三方交互（小程序端、开发者服务器、微信服务端），今天讲一下登录这块是怎么一个交互的（这个18年时候做的事情，现在微信有些接口可能有所调整，但变化不会太大）。

二、一些名词概念

1、openid：普通用户标记，对当前开发者账号是唯一的，一个openid对应一个具体的应用，不同的公众号不同的小程序会给同一个微信用户分配不同的openid。
2、unionid：微信用户统一标记，一个开放平台账号下同一个微信用户unionid是唯一的，需要在微信开放平台绑定公众号/小程序。
案例说明：牛奶应用开始是开发公众号-服务号，这个时候用户注册到我们表里会有一个openid_1，然后小程序火起来了，我们决定开发小程序，但小程序会重新给同一个用户分配一个openid_2,这就不好了，你不能让一个用户在公众号上可以看到他自己的订单，然后跑到小程序后找不到订单是吧，咋整呢，微信还有一个开放平台，你再申请一个邮箱去注册一下开放平台，然后把公众号和小程序都在里边绑定一下，这样他就会给你分配一个统一的unionid。
3、session_key：用于用户解密微信用户数据，接口返回敏感数据是密文的，如unionId，手机号等，需要用session_key做为密钥去解密。

三、微信提供和登录相关几个主要接口

小程序端调用

1、wx.login()：获取临时登录凭证CODE，有效时间为5分钟，使用后就立即失效。

2、wx.authorize()：发起用户授权请求，如要获取用户信息，地理位置，保存相册、摄像头等需要调用该接口得到用户的授权。

3、wx.getUserInfo()：得到加密码的用户数据，返回encryptedData数据，加密向量值IV，将数据传给服务端，服务端完成解密用户信息注册等，调用该接口前必须先调用上面两个方法。

开发者服务器调用

1、jscode2session：通过CODE获取openid、unionid、session_key。

四、调用交互图