开发者学堂课程【玩转EMAS Serverless精品课-疫苗预约小程序：实战：小程序疫苗预约 - 文件存储和云调用】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/926/detail/14590
实战：小程序疫苗预约 - 文件存储和云调用
内容介绍：
一、小程序图片 API
二、实战:个人信息头像修改
三、云调用介绍
四、实战:疫苗预约提醒推送
五、课程总结
本节内容主要有两部分，一部分是用云存储的功能优化疫苗预约小程序，在该部分会介绍小程序图片的 API （与业务和云存储相关的功能），复习云存储 SDK 的使用，讲解如何结合这两者在小程序疫苗预约中进行实战。
然后进行云调用的内容（云调用的作用、功能），以云调用的一个场景（支付宝的消息推送功能）去讲解云调用的实战。
一、小程序图片 API
1.API 介绍
图片 io 的 API 是 chooseImage
这是一个 io 的接口，因此肯定是异步的接口，所以以小程序标准回调风格的接口，在success 时接收一个 success 回调函数，在 fail 时接收一个 fail 回调函数。
my .chooseImage({
sourceType: { ' camera ' , ‘ album ' ] ,
count : 2,
success: ( res ) => {
my .alert ({
content : JS0N.stringify ( res ) ,
}) ;
},
fail: ()=>{
my.showToast({
content: 'fail' , //文字内容
});
}
})
入参
object 类型，属性如下:
属性 |
类型 |
必填 |
描述 |
count |
Number |
否 |
最大可选照片数，默认为1张。 |
sizeType |
StringArray |
否 |
图片类型 original 原图 compressed 压缩图 默认二者都有 |
souceType |
String Array |
否 |
相册选取或者拍照，默认{‘camera‘,’album’} |
success |
Function |
否 |
调用成功的回调函数 |
fail |
Function |
否 |
调用失败的回调函数 |
complete |
Function |
否 |
调用结束的回调函数（调用成功、失败都会执行） |
success 回调函数
属性 |
类型 |
描述 |
apFilePaths |
String Array |
图片的路径数组 |
tempFiles |
Array<Object> |
图片的本地临时文件列表 |
res.tempFiles 结构
属性 |
类型 |
描述 |
path |
String |
本地临时文件路径（本地路径） |
size |
Number |
本地临时文件大小，单位尾 B |
注意：从 io 接口获得的是本地临时文件路径（本地路径），宿主机生成一段可访问路径给小程序，小程序就能通过该地址得到该图片。
2.云存储的 API
Serverless SDK 的云存储在file功能群上传文件的 API
myserverless.file.uoloadFile(options:object):Promise<Result>
该接口是 options ，得到本地上传文件信息（上面讲到通过 chooseImage 可以得到的是本地文件上传路径）
上传本地文件逻辑：
小程序侧通过调用支付宝原生的宿主的 io 接口获得本地相册，获得一张图片的本地地址，然后通过该本地地址上传到 Serverless 端获得其网络地址这是一个标准的云存储的使用。
实际代码：
在 chooseImage 的一个 serverless 的回调函数中，先得到本地的地址，然后让 path 作为 FilePath 的一个属性，最后将 options 填入 uploadFile 中。
入口参数
字段名 |
类型 |
必填 |
说明 |
options |
Object |
是 |
本地上传文件信息 |
注意 SDK 的返回值：
返回参数
字段名 |
类型 |
说明 |
filePath |
String |
本地文件路径 |
fileUrl |
String |
云存储文件地址链接 |
（云存储文件地址链接，使用过控制台云存储可以看到控制台会提供一个网络文件的路径，该路径可以在浏览器直接访问，这就是云存储的一个网络地址，得到网络地址后可以将其存储到建立好的 user 库中，作为头像更新的一个环节）
二、实战:个人信息头像修改
打开 demo，切换到页面 “我的”：
在 demo 中设置了点击头像然后修改头像的功能：
选择从相册修改，选择一张图片，点击提交，头像修改成功
原码实现：
先对头像绑定一个头像的事件，在点击时触发该事件。
再实际的调用 chooseImage 这个接口，在成功的回调中，得到本地路径。
根据本地路径再去调用 uploadFile，然后使用云存储存储一张新的图片，得到该图片的网络地址，并调用 updeteUser 更新该头像（将网络地址填入）。修改成功后，把本地的头像地址换为新的网络地址。
完成了视图层的渲染后，setDate 驱动其更新。
部分代码为：
my.userInfo.await=FileUrl;
this.setData{
user:{
…this.data.user,
avater:FileUrl,
}
}
三、云调用介绍
1.支付宝开放能力简介
支付宝开放能力：支付宝提供了通过 SDK 或 API 接口的方式开放给业务人员或商家，商家可以在程序中集成其 API ，然后调用支付宝的一些业务能力、支付能力、行业能力或安全能力（包括这节课讲到向支付宝用户推送模板的能力，也是支付宝开放能力的一种，还包括营销能力等等）
2.云调用介绍
云调用简介：
云调用是基于小程序 Serverless 的云函数来使用支付宝小程序开放接口的能力
如下图：
开发者可以在小程序中直接调用支付宝的后端开放接口
如果使用支付宝开放的传统链路，则小程序是传统链路调到后台服务，后端服务根据小程序传入的用户信息、模板信息去调用支付宝的开放平台接口（模板参数的接口），然后去调用支付宝后台。
该条链路中，除小程序以外，后台服务的逻辑也要自行实现（包括考虑很多接入性问题）。但是在云调用链路中，开发者无需感知该部分，只需调用云链路，然后交给 Serverless 处理
云调用和支付宝开放能力有区别，云调用目前支持队伍大套能力，之外的能力不支持
四、实战:疫苗预约提醒推送
1.消息推送能力介绍
通过小程序云调用 openAPI 给用户触达消息推送
2.流程
作为一个开发者，首先要订阅消息模板（例如上图推送疫苗消息的形式），然后在设计小程序时需要将该模板中的信息进行代码集成，让云调用调用该模板的消息推送。还需要在推送之前争取用户同意，因此在程序中要设计让用户授权同意推送模板的步骤（没有授权不能推送）。
用户接受授权后，触发云调用（该消息模板的推送，也是代码集成的一部分），通过云调用调用 Serverless ，Serverless 调用 openAPI ，支付宝根据调用的参数用渲染模板推送给用户（到用户的消息盒子中）
3.消息模板开通
（1）访问支付宝开放平台
https://open.alipay.com/platform/home.htm
（2）支付宝扫码登录
（3）进入小程序后台
（4）前往运营管理
商家运营管理页面：
（5）找到消息运营并领用消息模板
选择疫苗接种预约提醒：
（6）设置服务提醒模板
消息模板领用完成：
（7）记录模板 id
回到消息运营界面，点击消息名称后的详情查看并记录模板 id（需要在程序中填写，关键词顺序也需要记录）
4.云调用集成
打开 demo
（1）集成云调用依赖（引入云调用）
alipay-serverless-sdk
（2）端侧引入依赖，初始化云调用
import 形式引入云调用，调用 init 方法将 serverless 实例传入完成初始化:
import MPServerless from ‘@alicloud/mpserverless-sdk’;
import cloud from ‘slipay-serverless-sdk’;
my.serverless=my.serverless|| new MPServerless(my,{
appId:’202100226669379’,
spaceId:’5402e70-05a6-4ef8-a824-bf510d5b904d’,
clientSecret:’CBmcx4wzdHkFUE2G9qv50==’,
endpoint:’https://api.bspapp.com’
});
cloud.init(my.serverless);
（3）云调用结合业务逻辑实现
用户授权接口：
my.requestSubscribeMessage()
参数 |
说明 |
entitylds |
授权模版数组 |
success |
success |
云调用接口：
cloud.marketing.templateMessage.send()
参数 |
说明 |
toUserId |
发送消息的支付宝账号 |
userTemplateId |
用户申请的模板id号 |
page |
页面跳转地址 |
data |
关键字占位符数据 |
toUserId：用户支付宝 id 信息，对使用者来说，就是当前使用者的支付宝 id（getInfo 接口可以得到）
注意：开发者需要发送模板消息中的自定义部分来替换模板的占位符，例如（data格式）
:{"keyword1":{"value” : "12:00"},"keyword2": { "vallue": "20180808"},"keyword3": {"value" :“支付宝"}}（分别对应机构地址、用户昵称、疫苗类型）
强调：
支付宝的推送请求接口较新，不能在低版本的 SDK 中使用，所以在实践该环境时要使用真机调试。
真机调试演示：
如果绑定了支付宝可以打开支付宝，自动推送到支付宝的该小程序
在疫苗预约时进行推送：
在手机上完成预约，此时完成一个云调用
打开支付宝，点击消息，可以看到有一条小程序的名称且底下有一条疫苗接种提醒，此时完成消息推送。
疫苗推送的代码在信息中，绑定了预约按钮，在预约成功时推送消息。
五、课程总结
本节课分为两部分，一部分学习了云存储，然后学习了云调用。云存储的关键是区别本地存储和网络存储，本地地址是本地 io ，也就是支付宝小程序的图片 API 产生的本地地址，网络地址是云存储，通过把本地图片上传到 Serverless 后台，为图片创造一个网络地址，该网络地址只能本地访问，通过该环节进行头像修改。
然后学习了云调用，首先介绍了什么是支付宝开放能力，对比了开发者使用传统链路调用支付宝开放能力（例如推送）和云调用调用支付宝开放能力的开发体验和区别。
还实际演示了集成链路。最后是实战，讲解了如何集成云调用 SDK 和如何完成消息模板的开通（包括用户授权，云调用的使用）
课后:打卡任务
01小程序调用 SDK 成功更新用户信息头像
02成功推送疫苗预约消息
