阅读 800

云开发踩坑-详解小程序云开发步骤、云数据库操作、云函数对接腾讯短信服务

主要重点介绍小程序云开发步骤、云数据库操作、云函数对接腾讯短信服务

一、云开发步骤

1. 新建云开发小程序

新建项目 appId需要是注册好的 不能使用测试号

2. 开通云开发后台

点击云开发

开通云开发后台

3.环境设置

新建云环境 小程序允许建两个环境,一般一个用于正式环境,一个用于测试。 如果新建了测试环境的话,一定要在小程序中声明测试环境的环境ID,否则小程序默认使用第一个环境。 新建环境

环境配置

4.环境选择

项目目录 现在回到项目目录,其中cloudfunctions为云函数的文件夹,miniprogram为小程序页面目录。 可以看到cloudfunctions显示未选择环境,右键此目录选择环境。

选择了之后可以看到会生成几个默认的云函数,一般login是比较常用的云函数。可以获取openId等数据。 app.js配置 在app.js中设置使用的环境ID。一定要声明环境 否则云函数返回的数据为null

5.新建云函数

右键cloudfunctions文件夹即可【新建Node.js云函数】,新建云函数会默认生成几个文件,我们只需要在index.js中写函数内容即可。 默认生成的index.js 如果需要操作数据库则需要声明 image.png

//云函数主体
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()  //获取小程序的信息,如OPENID等
  const _ = db.command;
  try {
    return await db.collection('address').add({
      data: {
        userid: wxContext.OPENID,   //用户唯一id从wxContext获取
        name: event.name,   //云函数入参从event传入
        phone: event.phone,
        province: event.province,
        city: event.city,
        district: event.district,
        detail: event.detail,
        isdefault: event.isdefault,
        createTime:db.serverDate()
      },
      success: function(res) { 
      }, fail: err => {
      }
    })
  } catch(e) {}
}
复制代码
6.上传云函数

写完云函数后需要上传云函数才能在小程序中调用 上传云函数

7.调用云函数
 wx.cloud.callFunction({
      name: 'addcart',   //云函数名字
      data: {
        goodsid: goodsid,  //云函数入参
      },
      success(res) {
        console.log(res)
        Toast.clear();
      },
      fail(err) {
        Toast.clear();
        console.log(err);
        wx.showToast({
          icon: 'none',
          title: '出错啦!请稍后重试'
        })
      }
    })
复制代码

二、云数据库操作

1.新建数据库

新建集合 云数据库采用的是NoSql,表即是集合 增加一列数据 会自动生成_id作为主键

2.增

不推荐直接在小程序中不通过云函数操作数据库,会有很多限制,(如:查询的条数,直接操作数据库最多只能20条),所以后续的数据库操作都是基于云函数中的。

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
const db = cloud.database({
  env: cloud.DYNAMIC_CURRENT_ENV
})

// 添加商品到购物车
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()
    try {
      return await db.collection('cart').add({    //会默认添加_id字段作为主键
        data: {
          userid: wxContext.OPENID,
          goodsid: event.goodsid,
          amount: 1,
          selected: true,
          createTime:db.serverDate()
        },
        success: function(res) {    
        }, fail: err => {
        }
      })
    } catch(e) {
      console.log(e);
    }
}
复制代码
2.删
// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
const db = cloud.database({
  env: cloud.DYNAMIC_CURRENT_ENV
})

// 云函数入口函数
exports.main = async (event, context) => {
  try {
    return await db.collection('address').doc(event._id).remove({  //根据传入的主键删除
      success: function(res) {     
      }, fail: err => {
      }
    })
  } catch(e) {
    console.log(e);
  }
}
复制代码
3.改
// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
const db = cloud.database({
  env: cloud.DYNAMIC_CURRENT_ENV
})

// 更新收货地址
exports.main = async (event, context) => {
  const _ = db.command;
  try {
    return await db.collection('address').doc(event._id).update({
      data: {
        name: event.name,
        phone: event.phone,
        province: event.province,
        city: event.city,
        district: event.district,
        detail: event.detail,
        isdefault: event.isdefault,
      },
      success: function(res) {
       
      }, fail: err => {

      }
    })
  } catch(e) {
    console.log(e);
  }
}
复制代码
4.查
// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
const db = cloud.database({
  env: cloud.DYNAMIC_CURRENT_ENV
})

// 获取当前用户的地址
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext()
  const _ = db.command;  //引入查询指令
  try {
    return await db.collection('address').where({
      userid: _.eq(wxContext.OPENID)    //eq查询指令 表示等于
    }).orderBy('createTime','desc').get()   //按时间排序
  } catch(e) {
    console.log(e);
  }
}
复制代码

limit(10) 表示取前10条数据 加在get前 支持的查询指令 developers.weixin.qq.com/miniprogram…

5.多表查询
 return await db.collection('cart').aggregate()
    .match({
      userid: wxContext.OPENID,
      selected: true
    }).lookup({
        from: 'goods',   //关联的表名
        localField: 'goodsid',  //关联表名的字段
        foreignField: '_id',   //源表的字段
        as: 'info'   //组装成的对象
      }).end()
复制代码

注:where()和aggregate()不能共存,where()最后接get(),aggregate()最后接end()

6.模糊查询
db.collection('goods').where(_.or([  //or表示接受多个查询条件
{
      name: db.RegExp({       //模糊查询   
        regexp: '.*' + event.name,
        options: 'i',
      })
    },
    {
      subtitle: db.RegExp({  //组装成正则
        regexp: '.*' + event.name, // 正则表达式,字符串形式
        options: 'i',   //表示忽略大小写
      })
    }
    ])).get()
复制代码
7.分页查询
db.collection('todos').skip(10)   //指定查询返回结果时从指定序列后的结果开始返回
  .get()
  .then(console.log)
  .catch(console.error)
复制代码

三、对接腾讯云短信服务

腾讯短信服务控制台 console.cloud.tencent.com/smsv2 短信Api cloud.tencent.com/document/pr… (控制台里面居然找不到api的入口)

短信介绍 进入接口调试页面

image.png 在腾讯云控制台找到对应的参数,添加,然后在线调用成功之后就可以直接复制代码

测试的时候需要在本地安装一下依赖,右键云函数文件夹->在外部终端窗口打开-> 运行 npm install tencentcloud-sdk-nodejs --save 即可,上传云函数时,依然可以选择云端安装依赖

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()

const tencentcloud = require("tencentcloud-sdk-nodejs")


// 短信通知下单信息
exports.main = async (event, context) => {
  const SmsClient = tencentcloud.sms.v20190711.Client;
  const clientConfig = {
    credential: {     //api的秘钥id和密码    https://console.cloud.tencent.com/cam/capi  中生成
      secretId: "",     
      secretKey: "",
    },
    region: "",
    profile: {
      httpProfile: {
        endpoint: "sms.tencentcloudapi.com",
      },
    },
  };
  
  const client = new SmsClient(clientConfig);
  const params = {
      "PhoneNumberSet": [    //发送的号码
          "86187xxxxxxxx"     //国内的号码需要加 86
      ],
      "TemplateParamSet": [  //发送的参数 对应模板中的{1} {2}
          " ",
          " "
      ],
      "TemplateID": "xxx",    //短信模板ID
      "SmsSdkAppid": "xxxx",   //SDKAppID  在短信的应用列表中获取   https://console.cloud.tencent.com/smsv2/app-manage
      "Sign": "xxx"    //短信签名内容  即模板中【】中的内容
  };
  client.SendSms(params).then(
    (data) => {
      console.log(data);
      return data
    },
    (err) => {
      console.error("error", err);
      return err
    }
  );
}
复制代码

四、云开发的优缺点

**优点:**利用云函数可以很轻松的获取用户OPENID,操作数据库这些,省了https配置。 缺点: 云函数访问速度很慢,不知道等5g普及之后会不会改变

最后,云小程序有提供CMS,还没用过,不知道好不好用。

文章分类
前端