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

ops/2025/1/20 2:05:40/

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

一、创建小程序

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 = {// 云开发环境 IDenvId: '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资源链接-码云 


http://www.ppmy.cn/ops/151534.html

相关文章

上位机工作感想-2024年工作总结和来年计划

随着工作年限的增增长,发现自己越来越不喜欢在博客里面写一些掺杂自己感想的东西了,或许是逐渐被工作逼得“成熟”了吧。2024年,学到了很多东西,做了很多项目,也帮别人解决了很多问题,唯独没有涨工资。来这…

hydra破解密码

hydra九头蛇是常用的密码破解工具 1、破解centos ssh密码 hydra -l root -P password.txt ssh://192.168.1.107:2222 hydra -l root -P password.txt -s 2222 192.168.1.107 ssh2、破解ftp hydra -l allen -P e:\aa.txt ftp://127.0.0.1 hydra -l allen -P e:\aa.txt ftp:…

KAGGLE竞赛实战2-捷信金融违约预测竞赛-part2-用lightgbm建立baseline

接着上一篇,用lightgbm建立baseline,发现模型效果得到了很大优化(模型分提升为0.73) # In[211]: from sklearn.model_selection import cross_val_score,KFold # In[228]: import lightgbm as lgb # In[229]: from lightgbm import LGBMClas…

C#高级:通过 Assembly 类加载 DLL 和直接引用DLL的方法大全

一、主项目不添加引用 (主项目不添加引用,而是通过路径获取指定dll) 1.打印类的属性名称 namespace ReflectionDemo {class Program{static void Main(string[] args){// 指定【编译输出】的项目类库dll(启动项目编译输出目录下…

网络安全 | 什么是正向代理和反向代理?

关注:CodingTechWork 引言 在现代网络架构中,代理服务器扮演着重要的角色。它们在客户端和服务器之间充当中介,帮助管理、保护和优化数据流。根据代理的工作方向和用途,代理服务器可分为正向代理和反向代理。本文将深入探讨这两种…

【C++篇】红黑树的实现

目录 前言: 一,红黑树的概念 1.1,红黑树的规则 1.2,红黑树的最长路径 1.3,红黑树的效率分析 二,红黑树的实现 2.1,红黑树的结构 2.2,红黑树的插入 2.2.1,大致过程…

Hooks 使用规则

Hooks 使用规则 命名规则 Hook 必须 useXxx 格式来命名。 PS:这种命名规则也很易读,简单粗暴 调用位置 Hook 或自定义 Hook ,只能在两个地方被调用 组件内部其他 Hook 内部 组件外部,或一个普通函数中,不能调用…

Python 爬虫爬取京东商品信息 ||京东商品详情API

Python 爬虫爬取京东商品信息 下面我将逐一解释每一部分的代码 导入库 from selenium import webdriver from selenium.webdriver.edge.service import Service from selenium.webdriver.edge.options import Options import time import random import csv from selenium.…