前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >云开发基础

云开发基础

原创
作者头像
张世强
修改2020-04-30 18:01:56
1.2K0
修改2020-04-30 18:01:56
举报
文章被收录于专栏:zhang

1.什么是微信小程序云开发?

官方的介绍

开发者可以使用云开发开发微信小程序、小游戏,无需搭建服务器,即可使用云端能力。

云开发为开发者提供完整的原生云端支持和微信服务支持,弱化后端和运维概念,无需搭建服务器,使用平台提供的 API 进行核心业务开发,即可实现快速上线和迭代,同时这一能力,同开发者已经使用的云服务相互兼容,并不互斥。

云开发提供了几大基础能力支持:

能力

作用

说明

云函数

无需自建服务器

在云端运行的代码,微信私有协议天然鉴权,开发者只需编写自身业务逻辑代码

数据库

无需自建数据库

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

存储

无需自建存储和 CDN

在小程序前端直接上传/下载云端文件,在云开发控制台可视化管理

云调用

原生微信服务集成

基于云函数免鉴权使用小程序开放接口的能力,包括服务端调用、获取开放数据等能力

官方对云开发的含义其实描述得非常形象准确了,其实云开发可以理解为一个全托管的nodejs云端环境,是一个全方位的服务端解决方案,从功能上来讲他帮助企业简化了开发流程,降低了人员配置复杂度,是一个不错的功能;但个人觉得,这种数据全方位托管的方式可能仅仅针对某些小型企业有较大利用价值,大企业是不会将代码、数据放在云端的,都是自建服务器的模式。

2.怎样实现一个云开发项目? 第一步:实现云开发项目前的准备工作,包括如下步骤

第二步:开启云开发控制台

经过第一步的操作之后,我已经得到了一个普通的小程序项目,项目结构如下

此时,我的首先要先开通云开发控制台,什么意思呢?就是为我这个APPID的小程序在云端创建一套云开发环境管理系统,用于管理我的云端Demo,开通云开发控制台的方式如下:

开通之后,会默认展示当前云端环境的各项数据指标,后续可以在这里查看,控制台的模块分布,可以参考官网: https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/console.html

第三步:配置并创建本地云开发代码目录

云开发控制台也开通了,我们现在肯定要在本地创建一个代码空间来实现本地和云端代码的同步,因为不可能本地的所有文件都可以往云端同步,肯定是某个特殊目录下的数据才能向云端同步,这是架构的基本逻辑思想。

在小程序项目根目录下创建本地云函数根目录functions,在项目根目录找到 project.config.json 文件,新增 cloudfunctionRoot 字段,值为刚才创建的本地云函数根目录名称

我们在项目根目录找到 project.config.json 文件,新增 cloudfunctionRoot 字段,指定"functions"目录作为云函数的本地根目录;我们可以看到"functions"这个目录创建之后就被一个蓝色的图标所标记了,说明这是小程序所认可的一个可用于本地和云端实现代码同步的;

代码语言:javascript
复制
"cloudfunctionRoot": "./functions/"

第四步:创建测试云函数"test"并安装依赖

我们可以看到云函数根目录下新增了一个名称为我们定义的云函数名称的目录,我们称之为云函数目录,关注点是云函数目录名=云函数名;云函数目录下有三个文件,含义分别如下:

  • config.json

云函数API配置文件

  • index.js

云函数的入口文件,就是云函数的执行文件

  • package.json

云函数的依赖包配置文件

我们创建完云函数之后,需要根据自己项目的需求添加一些依赖,然后要安装依赖,例如我这里需要添加一个最新版本的腾讯云SDK作为依赖,我们应该这样做:

代码语言:javascript
复制
"dependencies": {
    "wx-server-sdk": "~1.8.3",
    "tencentcloud-sdk-nodejs": "latest"
  }

在"test"云函数目录上右键选择在"在终端中打开"

安装过程如下

代码语言:javascript
复制
F:\cloud-dev\functions\test>npm install
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142

> protobufjs@6.8.8 postinstall F:\cloud-dev\functions\test\node_modules\protobufjs
> node scripts/postinstall

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN test@1.0.0 No description
npm WARN test@1.0.0 No repository field.

added 101 packages from 194 contributors and audited 186 packages in 13.213s

1 package is looking for funding
  run `npm fund` for details

found 0 vulnerabilities

我们可以去"test"云函数目录下查看安装的nodejs依赖包,其中包括了众多的基础依赖包,当然也包括package.json中的依赖包

第五步:有了依赖包了,我们应该开始编写"index.js"这个入口文件中的云函数功能代码块了

如下图,红框中的代码就是你的云函数主体功能代码块了

云函数的传入参数有两个,一个是event对象,一个是context对象。event指的是触发云函数的事件,当小程序端调用云函数时,event就是小程序端调用云函数时传入的参数,外加后端自动注入的小程序用户的 openid 和小程序的 appid。context对象包含了此处调用的调用信息和运行状态,可以用它来了解服务运行的情况。在模板中也默认requirewx-server-sdk,这是一个帮助我们在云函数中操作数据库、存储以及调用其他云函数的微信提供的库,关于wx-server-sdk的使用我们在另一个章节讲述。

这里我们自定义一个功能代码块

代码语言:javascript
复制
// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
  return {
   describe: event.desc
  }
}

上传此云函数到云端

然后新建一个页面来调用这个云函数

创建页面

然后完善代码及配置文件

cloud.js

代码语言:javascript
复制
// pages/cloud/cloud.js
Page({
  clickMe: function() {
    var that=this
    wx.cloud.init()
    wx.cloud.callFunction({
      // 云函数名称
      name: 'test',
      // 传给云函数的参数
      data: {
        desc: "Tencent cloud is number one",
      },
      success: function(res) {
        console.log(res.result.desc) // 3
        that.setData({
        message: res.result.desc
        })
      },
      fail: console.error
    })
  }
})

cloud.json

代码语言:javascript
复制
{
  "navigationBarTitleText": "云函数测试",
  "backgroundColor": "#eeeeee"
}

cloud.xml

代码语言:javascript
复制
<!--pages/cloud/cloud.wxml-->
<view>{{ message }}</view>
<button bindtap="clickMe">点击我</button>

cloud.wxss

代码语言:javascript
复制
/* pages/cloud/cloud.wxss */

app.json

代码语言:javascript
复制
{
  "pages": [
    "pages/cloud/cloud",
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle": "black"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

打开模拟器、调试器,然后点击"编译"观察调试器控制台是否报错

点击触发事件绑定去调用云函数

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1.什么是微信小程序云开发?
  • 2.怎样实现一个云开发项目? 第一步:实现云开发项目前的准备工作,包括如下步骤
    • 第二步:开启云开发控制台
    • 第三步:配置并创建本地云开发代码目录
    • 第四步:创建测试云函数"test"并安装依赖
    • 第五步:有了依赖包了,我们应该开始编写"index.js"这个入口文件中的云函数功能代码块了
    相关产品与服务
    云函数
    云函数(Serverless Cloud Function,SCF)是腾讯云为企业和开发者们提供的无服务器执行环境,帮助您在无需购买和管理服务器的情况下运行代码。您只需使用平台支持的语言编写核心代码并设置代码运行的条件,即可在腾讯云基础设施上弹性、安全地运行代码。云函数是实时文件处理和数据处理等场景下理想的计算平台。
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档