到此,我们基本可以来写小程序了,后续篇章再跟着项目来进行较好。对于api,这块要多查文档,反正就是用到啥就查。最好先大致浏览下。利用零碎的时间来学习小程序,可能进度比较慢。目前准备先重温接口如何编写,之前也只是大致了解一下,后端的东西太陌生了。虽然想找免费接口,但翻了一遍没找到合适的,无奈只能自己试着来弄弄nodejs后端接口。
第四章 场景应用
布局(忽略)
界面常见的交互反馈(其实就是讲组件,具体用法还是查组件文档,可忽略)
发起https网络通信
-
发起请求,就要有请求url,这个必填,且在小程序后台,还需要配置域名。最后在开发者工具中,详情一栏里的项目配置刷新,就可以看到配置的域名。
-
小程序后台配置的域名不能带路径,协议也要写https。
-
wx.request发起请求,参数为obj,详细参数见文档
-
发送请求参数,可以直接在url上,也可以使用data 区别:
url是有长度限制的,其最大长度是1024字节,同时url上的参数需要拼接到字符串里,参数的值还需要做一次urlEncode。
向服务端发送的数据超过1024字节时,就要采用HTTPPOST的形式,此时传递的数据就必须要使用data参数,基于这个情况,一般建议需要传递数据时,使用data参数来传递。
- 有时候参数要为json格式给服务器,可以设置请求头字段header(来设置提交的参数内容类型),
- 比如:header:{'content-type':'application/json'},这样提交的data里的参数自然对用json字符串
- 注意,只要成功收到服务器返回,无论HTTP状态码是多少都会进入success回调。因此开发者自己通过对回包的返回码进行判断后再执行后续的业务逻辑
- ???success回调的参数data字段类型是根据header['content-type']决定的,默认header['content-type']是'application/json',
- 在触发success回调前,小程序宿主环境会对data字段的值做JSON解析,如果解析成功,那么data字段的值会被设置成解析后的Object对象,
- 其他情况data字段都是String类型,其值为HTTP回包包体。
- app.json可以指定request的超时时间。字段为networkTimeout
排查异常:
- 小程序是否为开发版或者体验版,因为开发版和体验版的小程序不会校验域名
- 检查对应请求的HTTPS证书是否有效,同时TLS的版本必须支持1.2及以上版本,可以在开发者工具的console面板输入showRequestInfo()查看相关信息。
- 域名不要使用IP地址或者localhost,并且不能带端口号,同时域名需要经过ICP备案。
- 检查app.json配置的超时时间配置是否太短,超时时间太短会导致还没收到回报就触发fail回调。
- 检查发出去的请求是否302到其他域名的接口,这种302的情况会被视为请求别的域名接口导致无法发起请求。
微信登录:
-
【1】wx.login()可以获得登录凭证,有效时间为5分钟
-
【2】使用request来把凭证 -》 第三方服务器(开发者服务器)
-
【3】第三方服务器 (发送凭证,同时带上AppId和AppSecret)-》 微信服务器 (换取微信用户身份)-> 通过凭证和其他信息换取用户id
其中(确保为小程序开发者发送的code,所以带上AppId(可以公开)和AppSecret(不可泄漏))(小程序管理平台的开发设置界面可以看到)
code在成功换取一次信息之后也会立即失效,即便凭证code生成时间还没过期
开发者服务器和微信服务器通信也是通过HTTPS协议,微信服务器提供的接口地址是:
https://api.weixin.qq.com/sns/jscode2session?appid=<AppId>&secret=<AppSecret>&js_code=<code>&grant_type=authorization_code该接口返回三个字段:openid(微信用户唯一标识,即 微信用户id),session_key(会话密匙,微信服务器给开发者服务器颁发的身份凭证),unionid,暂时关注前两个
开发者可以用session_key请求微信服务器其他接口来获取一些其他信息(不可泄漏),为什么要设计session_key,见官方介绍
-
???绑定微信用户身份id和业务用户身份
开发者服务器没有微信用户id,填写业务侧的登录需求,并附带凭证请求开发者登录接口
此时开发者后台通过校验用户名密码就拿到了业务侧的用户身份id,通过code到微信服务器获取微信侧的用户身份openid。
微信会建议开发者把这两个信息的对应关系存起来,我们把这个对应关系称之为“绑定”。
- ???业务登录凭证SessionId
本地数据缓存:
写-》 wx.setStorage/wx.setStorageSync
读-》 wx.getStorage/wx.getStorageSync
每个小程序的缓存空间上限为10MB,如果当前缓存已经达到10MB,再通过wx.setStorage写入缓存会触发fail回调
-
本地缓存提前渲染页面
一般在对数据实时性/一致性要求不高的页面采用这个方法来做提前渲染,用以优化小程序体验
-
缓存用户登录态SessionId
利用本地缓存的能力来持久化存储SessionId
设备能力:
wx.scanCode,扫码,返回二维码的数据
wx.getNetworkType获取设备当前网络状态,wifi/...5G