微信小程序> 小程序码云调用实现方式

小程序码云调用实现方式

浏览量:3524 时间: 来源:mingjuna2010

①开通云开发、创建云开发环境(环境命名为项目名称拼音即可,示例中football)
创建了第一个云开发小程序后,在使用云开发能力之前需要先开通云开发。在开发者工具工具栏左侧,点击 “云开发” 按钮即可打开云控制台、根据提示开通云开发、创建云环境。默认配额下可以创建两个环境,各个环境相互隔离,每个环境都包含独立的数据库实例、存储空间、云函数配置等资源。每个环境都有唯一的环境 ID 标识,初始创建的环境自动成为默认环境。

注:AppID 首次开通云环境后,需等待大约 10 分钟方可正常使用云 API,在此期间官方后台服务正在做准备服务,如尝试在小程序中调用云
API 则会报 cloud init error:{ errMsg: “invalid scope” } 的错误。

②在项目根目录找到 project.config.json 文件,新增 cloudfunctionRoot 字段,指定本地已存在的目录作为云函数的本地根目录。

示例:functions 为云函数文件夹名称。

{   "cloudfunctionRoot": "./functions/"}

③完成指定之后,云函数的根目录的图标会变成 “云目录图标”,云函数根目录下的第一级目录(云函数目录)是与云函数名字相同的,如果对应的线上环境存在该云函数,则我们会用一个特殊的 “云图标” 标明。

小程序
其中football是云环境名称。

④接着,我们在云函数根目录上右键,在右键菜单中,可以选择创建一个新的 Node.js 云函数,我们将该云函数命名为 createCode。开发者工具在本地创建出云函数目录和入口 index.js 文件,同时在线上环境中创建出对应的云函数。创建成功后,工具会提示是否立即本地安装依赖,确定后工具会自动安装 wx-server-sdk。
⑤使用云函数调用小程序码时,必须要设置权限。在新建的云函数createCode文件夹右击选择新建js文件,添加config.js文件,在config.js文件添加小程序码的设置权限代码:

{  "permissions": {    "openapi": [      "wxacode.getUnlimited"    ]  }}

下面是云调用小程序码的云函数的index.js相关代码,注意添加之后,右击云函数,点击 上传并部署云端安装依赖(不上传node_modules),重新上传云函数到云端,不然修改之后的云函数不生效。下面是云函数的index.js相关代码:

// 云调用~生成小程序二维码const cloud = require('wx-server-sdk')cloud.init()exports.main = async (event, context) => {  var scene = event.scene;  var page = event.page;  var width = event.width;  var lineColor = event.lineColor;  var isHyaline = event.isHyaline;  var autoColor = event.autoColor;  try {    // 1、通过云调用生成二维码    const result = await cloud.openapi.wxacode.getUnlimited({      scene: scene,      page: page,      width: width,      lineColor: lineColor,      isHyaline: isHyaline,      autoColor: autoColor,    })    console.log(result)    // 2、上传图片到云存储    const upload = await cloud.uploadFile({      cloudPath: scene + '.jpg',      fileContent: result.buffer,    })    console.log(upload)    // 3、返回图片地址    var fileID = upload.fileID;    console.log("fileId=" + fileID);    const fileList = [fileID]    const imgList = await cloud.getTempFileURL({      fileList: fileList,    })    return imgList.fileList  } catch (err) {    console.log(err)    return err  }}

⑥需要小程序码页面的js文件中进行调用,需要注意的是,采用getUnlimited生成的小程序码,永久有效,数量暂无限制,但是scene参数的长度受到了限制,最多只能32位。可以采用16进制进行优化参数的长度。调用云函数生成小程序码代码如下:

// 生成二维码let activityId = this.data.activityIdlet recommendAccountId = this.data.recommendAccountId;wx.cloud.init()let newActivity = parseInt(activityId).toString(16)let newRecommendAccountId = parseInt(recommendAccountId).toString(16)var path = 'pages/activity/activity-details/activity-details'var width = '430';var scene = 'p,' + newActivity + ',' + newRecommendAccountId;var lineColor = {  "r": "255",  "g": "255",  "b": "255"};var isHyaline = false;var autoColor = false;let _this = this;wx.cloud.callFunction({  name: 'newCode',  data: {    page: path,    width: width,    scene: scene,    lineColor: lineColor,    isHyaline: isHyaline,    autoColor: autoColor  },  success: res => {    console.log("生成成功")    console.log(res)    _this.setData({      code: res.result[0].tempFileURL    }, () => { this.loadOrgDetail()})  },  fail: error => {    console.log("生成失败")    console.log(JSON.stringify(error))  }});

注意事项:云函数修改之后一定要右击云函数,点击 上传并部署云端安装依赖(不上传node_modules)重新上传云函数到云端。不然修改之后的云函数不生效。

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎