【经验分享】支付宝小程序serverless云开发拓荒

本文涉及的产品
简介: 【经验分享】支付宝小程序serverless云开发拓荒

支付宝小程序云开发拓荒:


1. 支付宝小程序准备

支付宝小程序开发就不详细介绍了,从创建小程序,到开发、提审官网有详尽的文档和示例。参见阿里云Serverelss关于小程序开发流程的指导文档

2.添加Serverless SDK依赖

可以修改package.json,添加依赖{"@alicloud/mpserverless-sdk": "^2.3.2"}。也可以下载Serverless官方Demo,在Demo基础上修改。(这里需要注意,工具上默认内置的是0.0.9版本,一定要换成2.3.2版本,不然很多新能力调用不了,会提示错误)

3.引入Serverless

在app.js中引入Serverless全局对象,即可在所有Page中直接引用,用于调用DB、File、云函数接口。

// 1. 引入必要的 sdk
import MPServerless from '@alicloud/mpserverless-sdk';
import cloud from 'alipay-serverless-sdk';
// 2. 在 app.js 中对 sdk 进行初始化
// 2.1 初始化 MPServerless
my.serverless = my.serverless || new MPServerless({
  uploadFile: my.uploadFile,
  request: my.request,
  getAuthCode: my.getAuthCode,
}, {
  // 2.2 参数能在小程序云服务空间详情中获取
  appId: '2021001153625076',
  spaceId: 'd25b93de-78d6-43b4-a9c6-355c782e8e8d',
  clientSecret: 'VRkdVX4p0SpZX4Qj/PZpSA==',
  endpoint: 'https://api.bspapp.com'
})
// 2.3 初始化 alipay-serverless-sdk
cloud.init(my.serverless);
App({
  onLaunch(options) {
    // 第一次打开
    // options.query == {number:1}
    console.info('App onLaunch');
  },
  onShow(options) {
    // 从后台被 scheme 重新打开
    // options.query == {number:1}
  },
});


接下来我们说下遇到第一个问题:


出现该问题是因为 阿里云云服务的密钥没配置导致https://mp.console.aliyun.com/cloudDev/setting

私钥以及公钥需要下载《支付宝开放平台开发助手》生成。

使用支付宝开放平台开发助手生成公钥私钥配置后提示下面这个。

找了半天原因,最后了解到是 支付宝小程序的公钥配置错误导致的。阿里云后台云开发设置里需要设置该小程序的支付宝公钥,而我配置成了应用公钥。支付宝公钥在小程序后台获取。

接下来咱们第一个demo:

获取用户userId

cloud.base.oauth.getToken为官方提供的云开发获取用户userId的api。其他相关调用相同,api列表文档如下:

https://opendocs.alipay.com/mini/cloudservice/khf843


my.getAuthCode({
  scopes: 'auth_base',
  success: async (res) => {
    my.hideLoading()
    const tokenResult = await cloud.base.oauth.getToken(res.authCode);
    console.log(tokenResult)
    const userId = tokenResult.userId;
    this.setData({
      userId
    })
  }
})


至于调用云函数。微信的是wx.callFuntion({name: xxx}),而支付宝是这样的:


my.serverless.function.invoke('functionName', {
    range: 30,
}).then((res) => {
  console.log(res);
}).catch(err => {console.err});


最后一个坑,云调用my.serverless.file.uploadFile 这类的调用 需要先在 app.js的onLaunch里静默授权一次,不然会调用失败。

会提示:`request error from Alipay IDE`,文档搜不到相关错误。


App({
  async onLaunch(options) {
    const res = await my.serverless.user.authorize({
      authProvider: 'alipay_openapi'
    })
    if (res.success) {
      console.log('授权成功');
    }
  }
});


以上的问题都是在第一次接触云开发探索中遇到的坑,记录一下给有需要的人。

相关实践学习
基于函数计算一键部署掌上游戏机
本场景介绍如何使用阿里云计算服务命令快速搭建一个掌上游戏机。
建立 Serverless 思维
本课程包括: Serverless 应用引擎的概念, 为开发者带来的实际价值, 以及让您了解常见的 Serverless 架构模式
目录
相关文章
|
1月前
|
小程序 Devops 开发工具
支付宝小程序入门学习之一:如何创建支付宝小程序并在手机上预览
支付宝小程序入门学习之一:如何创建支付宝小程序并在手机上预览
29 0
|
1月前
|
小程序 API
点餐小程序实战教程09-订单功能开发
点餐小程序实战教程09-订单功能开发
|
1月前
|
存储 小程序 数据可视化
使用无代码工具开发一款问卷调查小程序
使用无代码工具开发一款问卷调查小程序
|
1月前
|
小程序 数据库
零基础开发小程序第六课-删除数据
零基础开发小程序第六课-删除数据
|
1月前
|
小程序 开发工具 数据库
零基础开发小程序第三课-列表功能开发
零基础开发小程序第三课-列表功能开发
|
1月前
|
小程序 UED
人力资源小程序的设计与开发步骤
人力资源小程序的设计与开发步骤
16 1
|
1月前
|
存储 小程序 开发工具
零基础开发小程序第四课-查看功能开发
零基础开发小程序第四课-查看功能开发
|
19天前
|
小程序 JavaScript 数据安全/隐私保护
分享全栈开发医疗小程序 -带源码课件(课件无解压密码),自行速度保存
看到好多坛友都在求SpringBoot2.X + Vue + UniAPP,全栈开发医疗小程序 - 带源码课件,我看了一下,要么链接过期,要么课件有压缩密码。特意整理了一份分享给大家,个人认为还是比较全面的。希望对大家有所帮助!课程仅供大家学习交流使用!
25 1
分享全栈开发医疗小程序 -带源码课件(课件无解压密码),自行速度保存
|
19天前
|
关系型数据库 Serverless 分布式数据库
Serverless 应用引擎常见问题之在抖音快手小程序上使用如何解决
Serverless 应用引擎(Serverless Application Engine, SAE)是一种完全托管的应用平台,它允许开发者无需管理服务器即可构建和部署应用。以下是Serverless 应用引擎使用过程中的一些常见问题及其答案的汇总:
21 3
|
22天前
|
小程序 JavaScript
在使用微信小程序开发中用vant2框架中的Uploader 文件上传wx.uploadFile无反应和使用多图上传
网上有的说是bind:after-read="afterRead"的命名问题不支持-,但是我这儿执行了console.log("file",file);证明函数运行了。后来发现是multiple="true"原因开启了多图上传,如果是多图上传的话file就是数组了
25 2

热门文章

最新文章