开发小程序

最近更新时间:2019-05-05 21:13:52

操作场景

当开发者已经拥有小程序账号,并已开通了云开发服务创建了云开发环境后,接下来就是开发小程序的客户端及服务端。

操作步骤

客户端使用云开发能力

客户端,这里指在小程序端中。如果您需要使用云开发能力,请做以下配置:

  • 在 app.json / game.json 中, 中增加字段 "cloud": true
  • project.config.json 中增加了字段 cloudfunctionRoot 用于指定存放云函数的目录。

客户端代码,均是用户使用IDE工具完成的前端代码。

初始化云开发能力

此段代码需要加入在 IDE 中的 app.js 中,如下图所示:

//app.js
App({
  onLaunch: function () {
    wx.cloud.init({
        traceUser: true
    });
  }
});

详情请参考 初始化能力文档

说明:

在用户管理中会显示使用云能力的小程序的访问用户列表,默认以访问时间倒叙排列,访问时间的触发点是在小程序端调用 wx.cloud.init 方法,且其中的 traceUser 参数传值为 true。

小程序操作存储资源

初始化完成后,客户端代码即可通过 SDK 对云开发的后台资源进行访问与操作。下述的是一个典型的存储资源的操作示例代码,您可以在您的前端代码中进行更多的存储类操作。

// 选择图片
wx.chooseImage({
    success: dRes => {
        // 上传图片
        const uploadTask = wx.cloud.uploadFile({
            cloudPath: `${Date.now()}-${Math.floor(Math.random(0, 1) * 10000000)}.png`, // 随机图片名
            filePath: dRes.tempFilePaths[0], // 本地的图片路径
            success: console.log,
            fail: console.error
        });
    },
    fail: console.error,
});

更多详情请参考 存储文档

小程序操作数据库

同样的,初始化完成后,客户端代码即可通过 SDK 对云开发的提供的数据库进行资源操作。下述的是一个典型的数据库操作示例代码,您可以在您的前端代码中进行更多的数据库操作。

const db = wx.cloud.database();

db.collection('blog').get().then((res) => {
    let data = res.data;
    console.log(data);
});

更多详情请参考 数据库文档

小程序调用云函数

当您的小程序需要计算能力/后台处理能力时,则需要在前端代码中调用云开发提供的函数能力。下述代码为典型的在客户端调用云函数的示例代码。

wx.cloud.callFunction({
    name: 'addblog', // 云函数名称
    data: { // 传到云函数处理的参数
        title: '云开发 CloudBase',
        content: '存储、数据库存、云函数'
    }
}).then(res => {
    console.log(res)
}).catch((err) => {
    console.error(err);
});

更多详情请参考 云函数文档

服务端使用云开发能力

在很多应用场景中,后台也需要对存储、数据库等资源进行操作,如果您想在云函数中,操作文件、数据库和云函数资源,您可以使用我们提供的服务端 SDK 来进行开发。首先,进入到您的某个云函数中,安装以下依赖包:

npm i --save tcb-admin-node

注意:

服务端下述的所有代码,均需要用户部署在云函数中。这里的示例均为使用云开发的服务端 SDK。同时也可以使用 wx-server-sdk,与 tcb-admin-nod 提供同样的能力,若使用 wx-server-sdk 则请参考 云开发 Server API 文档

在云函数中初始化

// 初始化示例
const app = require('tcb-admin-node');

// 初始化资源
// 云函数下不需要secretId和secretKey。
// env如果不指定将使用默认环境
app.init({
  secretId: 'xxxxx',
  secretKey: 'xxxx', 
  env: 'xxx'
});

//云函数下使用默认环境
app.init()

//云函数下指定环境
app.init({
  env: 'xxx'
});

详情请参考 初始化文档

服务端操作文件资源

const app = require('tcb-admin-node');
app.init();

app.uploadFile({
    cloudPath: "cover.png",
    fileContent: fs.createReadStream(`${__dirname}/cover.png`)
}).then((res) => {
    console.log(res);
}).catch((err) => {
    console.error(err);
});;

详情请参考 存储文档

服务端操作数据库

const app = require('tcb-admin-node');
app.init();
const db = app.database();

db.collection('blogs').limit(10).get().then((res) => {
    console.log(res);
}).catch((err) => {
    console.error(err);
});;

详情请参考 数据库文档

服务端调用云函数

const app = require("tcb-admin-node");
app.init();

app.callFunction({
    name: 'addblog', // 云函数名称
    data: { // 传到云函数处理的参数
        title: '云开发 CloudBase',
        content: '存储、数据库存、云函数'
    }
}).then((res) => {
    console.log(res);
}).catch((err) => {
    console.error(err);
});

详情请参考 云函数文档

语法糖

大部分的接口,目前都支持两种写法,分别是 Promise 和 Async/Await。Async/Await 本质上是基于 Promise 的一种语法糖,它只是把 Promise 转换成同步的写法而已。

Promise

const app = require("tcb-admin-node");
app.init();

exports.main = async (event, context) => {
    return new Promise((resolve, reject) => {
    // 在 3 秒后返回结果给调用方(小程序 / 其他云函数)
    setTimeout(() => {
      resolve('hello world');
    }, 3000)
  });

Async/Await

const app = require("tcb-admin-node");
app.init();

exports.main = async (event, context) => {
    let result = null;

    try {
        result = await app.callFunction({
            name: 'addblog', // 云函数名称
            data: { // 传到云函数处理的参数
                title: '云开发 CloudBase',
                content: '存储、数据库存、云函数'
            }
        });
    }
    catch (e) {
        return e;
    }

    return result;
};