记录一次微信小程序使用云能力开发的过程

对于开发微信小程序云开发不知从何起的同学们,可以当作一次参考。虽说官方有文档,有模板示例,但是这些都是片段或者完整的结果展示。对于初学或者开发经验较少的同学们,可能不知先从那里入手进行第一步的开发。下面解析下构建微信小程序云开发的初始步骤,让大家能够一步步创建起自己的小程序。

一、创建小程序

1、创建小程序:选择了不使用模板(会自动默认选中不使用云服务),因为选择了示例,里面的目录内容结构太多太复杂了,示例里的(组件,扩展等)我们也不会全部用到,会让自己的小程序雍肿。

2、开通自己的云开发服务(其实就是开通云服务器,赠有限的免费使用云服务器时间),安装步骤开启就可以了,因为我的已经开启了)。记住此处中出现的环境ID

二、赋予云开发能力 ,使用云函数

 1、与开发能力:首先 再我们的项目目录中创建 云函数存放的文件目录 cloudfunctions,如下图:

鼠标选中编译器中的:资源管理器窗口-选中其中的文件 然后 按 shift+alt+R 键可打开项目目录,再进行目录创建

2、 在项目根目录找到 project.config.json 文件,新增 cloudfunctionRoot 字段,指定本地已存在的目录作为云开发的本地根目录

 

保存后或者手动编译 cloudfunctions文件夹 会有云朵的标识 。

3、创建云函数,且需要安装云服务扩展( wx-server-sdk )
1、鼠标移到如果图(急于赶工拍了一张):右键云开发目录 选中新建Node.js云函数。

 

 

 创建了一个login云函数(名称根据自己的需求写)。 云函数的文件 函数逻辑处理 也根据自己的需求修改,图下是默认的示例:

2、安装扩展

wx-server-sdk扩展不是再主目录中安装的。    

是在cloudfunctions 目录下安装 :

npm install --save wx-server-sdk@latest

如图操作:

 

4、初始化云服务

 创建完云函数,还得再项目中初始化。

先在根目录创建个config.js 配置文件用于定义某些常量的配置 :内容如下

const config = {
  // 云开发环境 ID
  envId: 'xxx-xxxxx',
}
module.exports = config

然后打开项目中的 app.js,并引用及初始化云服务:

// app.js
const config = require('./config')
App({

  //每次进入应用执行,只执行一次
  onLaunch() {
    //初始化云服务
    if (!wx.cloud) {
      console.error('请使用 2.2.3 或以上的基础库以使用云能力')
    } else {
      wx.cloud.init({
        env: config.envId,
        traceUser: true,
      })
    }
  }


})

配置完成,下面如何使用云函数:

5、云函数使用

 在wxml页面中 绑定一个点击事件clickLogin ,如图:

然后再在 js文件中 配置:

// index.js
Page({

  data:{

  },

  //获取信息
  clickLogin(){
    // console.log("信息");
    wx.cloud.callFunction({
      name:"login",//云函数名称
      data:{
        a:1,
        b:2,
      },//传给云函数的参数
    }).then(res=>{
      console.log(res,"结果");
    }).catch(console.error);
  },

})

 结果如下:获取到了用户的 openid unionid等信息

即成功请求了云函数,可以着手进行自己微信小程序的云开发了。某些过程还未详细介绍,比如编译器中开启云开发过程,和 安装云服务扩展( wx-server-sdk )这里有些需要注意的,就是根目录还未进行 npm初始化或者安装,则node_modules 则会安装到了 cloudfunction下的,这个需要注意。

以上时个人操作的见解,仅供参考,如不足请补充!

附上demo资源链接-码云 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/955022.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Agent一键安装,快速上手Zabbix监控!

目录 一、Linux操作系统部署Agent环境配置1、防火墙配置2、永久关闭selinux yum方式安装1、配置zabbix仓库2、安装agent3、配置 Zabbix-Agent 指向 Zabbix-Server4、启动agent服务 二进制包安装1、下载二进制包2、创建用户和目录及更改属主(组)3、解压二…

人工智能实验(五)-基于神经网络的模式识别实验

一、实验目的 理解BP神经网络的结构和原理,掌握反向传播算法对神经元的训练过程,了解反向传播公式。通过构建BP网络模式识别实例,熟悉BP网络的原理及结构 二、实验内容 基于提供的数据集,训练1个BP神经网络模型: 1. …

开发手札:.asmdef和RuntimeInitializeOnLoadMethod

最近为了快速响应临时小demo和老项目改造开发,思考了几种方式。 一般我们开发都是基于一套完善的unity框架进行的,完全建一个new project就是干,这样开发不仅慢而且乱。我们组框架代码都有现成的,而且组员都熟练使用了&…

九 RK3568 android11 MPU6500

一 MPU6500 内核驱动 1.1 查询设备连接地址 查看原理图, MPU6500 I2C 连接在 I2C4 上, 且中断没有使用 i2c 探测设备地址为 0x68 1.2 驱动源码 drivers/input/sensors/gyro/mpu6500_gyro.c drivers/input/sensors/accel/mpu6500_acc.c 默认 .config 配置编译了 mpu6550 …

Quinlan C4.5剪枝U(0,6)U(1,16)等置信上限如何计算?

之前看到Quinlan中关于C4.5决策树算法剪枝环节中,关于错误率e置信区间估计,为啥 当E=0时,U(0,1)=0.75,U(0,6)=0.206,U(0,9)=0.143? 而当E不为0时,比如U(1,16)=0.157,如图: 关于C4.5决策树,Quinlan写了一本书,如下: J. Ross Quinlan (Auth.) - C4.5. Programs f…

机器学习第一道菜(一):线性回归的理论模型

机器学习第一道菜(一):线性回归的理论模型 一、问题:千金买笑1.1 散点图1.2 机器学习能搞啥 二、模型的建立2.1 线性回归2.2 回归模型 前面讲了机器学习的“四大绝技”,今天,开始研究第一绝技“回归”&…

Edge Scdn是什么,它如何提升网站安全性与访问速度?

随着网络攻击的日益猖獗,尤其是分布式拒绝服务(DDoS)攻击的频繁发生,如何保护网站的安全性并确保用户的访问体验变得极为重要。Edge Scdn(内容分发网络)作为一种新兴的技术方案,逐渐被越来越多的…

深入浅出Redis持久化

文章目录 前言RDB快照原理保存时机 AOF同步策略AOF重写 混合持久化总结 前言 redis作为内存数据库,数据都在内存里,如果突然宕机,则数据都会丢失(这里假设不使用非易失性内存),redis提供了持久化机制来防止…

JAVA实现五子棋小游戏(附源码)

文章目录 一、设计来源捡金币闯关小游戏讲解1.1 主界面1.2 黑棋胜利界面1.3 白棋胜利界面 二、效果和源码2.1 动态效果2.2 源代码 源码下载更多优质源码分享 作者:xcLeigh 文章地址:https://blog.csdn.net/weixin_43151418/article/details/145161039 JA…

无公网IP 实现外网访问本地 Docker 部署 Navidrome

Navidrome 是一款可以在 macOS、Linux、Windows以及 Docker 等平台上运行的跨平台开源音乐服务器应用,它支持传输常见的 MP3、FLAC、WAV等音频格式。允许用户通过 Web 界面或 API 进行音乐库的管理和访问。本文就介绍如何快速在 Linux 系统使用 Docker 进行本地部署…

JS后盾人--JS数组挖掘(少年篇)

数组引用类型分析 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title> </he…

VirtualBox环境中vscode报错:提取扩展时出错。Failed to fetch

问题现象&#xff1a; VSCode切换到扩展并筛选特色时(为了触发联网)&#xff0c;提示提取扩展时出错。Failed to fetch 拔网线复现不了&#xff0c;完全没有网络VSCode只会提示离线 虚拟机内Edge浏览器访问https://marketplace.visualstudio.com/直接报ERR_CONNECTION_REFUSED…

HTML文章翻页功能

效果展示&#xff1a; 效果原理&#xff1a; 1、引入CDN 2、绘制文章翻页样式&#xff0c;以及自动分段 3、获取窗口宽高&#xff0c;计算出当前文章总分段&#xff0c;并实现分页 4、完整代码 <!DOCTYPE html> <html><head><meta charset"utf-8&qu…

IDEA运行测试函数@Test注解旁边没有运行按钮

如图我想直接运行 testSaveShop 函数进行测试&#xff0c;但是旁边没有运行按钮。 解决办法&#xff1a;测试类需要加上public&#xff0c;系统才能识别到并调用运行。 位置如下&#xff0c;在类和方法都加上 public &#xff0c;然后就会出现运行按钮&#xff1a; 但是如果点…

计算机网络 (38)TCP的拥塞控制

前言 TCP拥塞控制是传输控制协议&#xff08;Transmission Control Protocol&#xff0c;TCP&#xff09;避免网络拥塞的算法&#xff0c;是互联网上主要的一个拥塞控制措施。 一、目的 TCP拥塞控制的主要目的是防止过多的数据注入到网络中&#xff0c;使网络能够承受现有的网络…

使用jupyter notebook没有正常打开浏览器的几种情况解决

迅速记录前期 1.下载 https://www.anaconda.com/products/individual 2.安装 直接默认安装就行 3.打开jupyter notebook 在开始菜单里面可以找到 4.遇到的问题解决 1.运行jupyter notebook&#xff0c;黑窗口自动关了 每次黑窗口迅速的加载完就自己关掉了 也没有打开新…

29、Spark写数据到Hudi时,同步hive表的一些坑

1.hudi的同步hive表没有comment 原以为hudi同步的hive表是根据数据写入的dataframe的schema创建的。就和spark write hive时类似&#xff0c;查看源码后发现不是。 1.1 hudi同步hive的模式 HMS , JDBC , HIVESQL。我这儿常用的是HMS和JDBC 各个同步模式对应的执行器&#x…

wordpress zibll 2025款新页脚-6ke论坛

演示地址&#xff1a;6KE论坛-综合开放交流论坛 [hidecontent type"reply" desc"隐藏内容&#xff1a;评论后查看"] [/hidecontent]

Freeswitch使用media_bug能力实现回铃音检测

利用freeswitch的media bug能力来在智能外呼时通过websocket对接智能中心的声音检测接口&#xff0c;来实现回铃音检测&#xff0c;来判断用户当前是否已响应&#xff0c;拒接&#xff0c;关机等。 1.回铃音处理流程 2.模块源码目录结构 首先新建一个freeswitch的源码的src/a…

基于SpringBoot的企业级工位管理系统【源码+文档+部署讲解】

系统介绍 基于SpringBootVue实现的企业级工位管理系统采用前后端分离架构方式&#xff0c;系统设计了管理员、员工两种角色&#xff0c;系统实现了用户登录与注册、个人中心、员工管理、部门信息管理、工位信息管理、使用情况管理、工位分配管理等功能。 技术选型 开发工具&…