微信小程序云开发功能练习

2020-12-15
来源:

前言

开发小程序时,前端开发人员始终需要与小程序服务器的开发保持联系,例如获取openId,生成小程序代码和微信付款。这些功能必须使用后端服务开发,这可能导致前端开发人员不得不联系和学习后端开发语言:例如Java,Python,PHP等,从而导致额外的学习费用。

小程序的云开发功能为前端开发人员带来了好消息。云开发为开发人员提供了完整的本机云支持和微信服务支持,这削弱了后端以及操作和维护的概念,并且不需要构建服务器。该平台提供的API可用于核心业务开发,以实现快速启动和迭代。同时,此功能并不与开发人员使用的云服务互斥。

这是关键点,请圈出以进行测试! 小程序云开发的基本功能

小程序的云开发为我们提供了四个基本功能:云功能,数据库,存储和云调用。

能力功能的描述

云功能

无需构建自己的服务器

在云中运行代码,微信私有协议自然身份验证,开发人员只需要编写自己的业务逻辑代码

数据库

无需构建自己的数据库

一个JSON数据库,可以在小程序的前端进行操作,也可以在云函数中进行读写

存储

无需构建自己的存储和CDN

直接在小程序前端上上传/下载云文件,并在云开发控制台上直观地管理它们

云通话

本地微信服务集成

无需认证即可使用基于云功能的小程序开放接口的能力,包括服务器端调用,对开放数据的访问等。

小程序云开发传递用户信息

小程序云开发实践一、创建小程序云开发项目注:小程序云开发项目与普通的小程序项目结构不同(我们不一样,我们不一样,我们是不同的节奏)。


kanshu/ 项目目录    - cloudfunctions/ 云函数目录     - saveOpenId/ 任意云函数       - index.js       - package.json    - miniprogram/ 小程序端     - pages/ 页面目录       - index/ 首页         - index.js         - index.wxml         - index.wxss         - index.json     - app.js 主入口文件     - app.json 主配置文件     - app.wxss 主样式文件    - README.md    - project.config.json

二、云操作能力1.开放云开发

微信开发人员工具的主面板中,单击“云开发”按钮以启用云开发支持。

注意:打开云开发后,您需要等待大约10分钟; cloud init错误:{errMsg:“无效范围”}可能会出现在立即调用中,并且官方后端此时正在准备服务。2.主入口app.js文件,初始化云调用


//app.js App({    onLaunch: function () {         if (!wx.cloud) {       console.error('请使用 2.2.3 或以上的基础库以使用云能力')     } else {       wx.cloud.init({         // 此处请填入环境 ID, 环境 ID 可打开云控制台查看         env: 'xxoo',         traceUser: true,       })     }     this.globalData = {}    } })

如果要使用云功能,通常在初始化小程序时调用此方法。3.特定业务:注册功能-获取用户的openid和基本用户信息,并将其存储在云数据库中

小程序一侧:


// miniprogram/pages/index/index.js page({    data: {     // 定义数据    },    /**    * onGetUserInfo()    * @description 获取用户登录信息,存储到云数据库    * @param {object} e 获取的用户信息对象    */    onGetUserInfo: function(e) {     if (e.detail.userInfo) {       wx.cloud.callFunction({         name: 'saveUserInfo',         data: {           userInfo: e.detail.userInfo         },         success: (res) => {           console.log(res)           if (res.result && res.result._id) {             wx.showToast({               title: '保存成功',             })           }         },         fail: (err) => {           wx.showToast({             title: '保存失败...',             icon: 'none'           })         }       })     }    } })

请在这里观察


// 云函数调用 wx.cloud.callFunction({    // 云函数名    name: 'saveUserInfo',    // 传参    data: {}

云:云功能


// cloudfunctions/saveUserInfo/index.js // 引入云函数SDK const cloud = require('wx-server-sdk') // 初始化 cloud.init() // 数据库链接 let db = cloud.database() // 云函数入口函数 exports.main = async (event, context) => {    // 全局的工具类,在云函数中获取微信的调用上下文    const wxContext = cloud.getWXContext()    // 云数据库操作    try {     // 实际注册功能时,应先检测该用户是否已经注册         // 此处操作集合时,请预先在数据库中创建该集合users     return await db.collection('users').add({       data: {         created: new Date(),         userInfo: event.userInfo,         openid: wxContext.OPENID       }     })    } catch (e) {     console.error(e)    } }

使用时必须上载和部署云功能。如果是本地化测试,则必须为npm install install package依赖项

云:数据库

单击注册按钮,将在云数据收集用户中创建一条数据

后记

分享