小程序雲開發攻略,解決最棘手的問題

背景

最近小程序很是的火,應公司業務發展要求,開發維護了幾款小程序,公司開發的小程序都是由後端提供的接口,開發繁瑣而複雜,直到小程序出現了雲開發,仔細研讀了文檔以後,欣喜不已,因而我着手開發了本人的第一款小程序html

分析

雲開發爲開發者提供完整的原生雲端支持和微信服務支持,弱化後端和運維概念,無需搭建服務器,使用平臺提供的 API 進行核心業務開發,便可實現快速上線和迭代,同時這一能力,同開發者已經使用的雲服務相互兼容,並不互斥。前端

優點

  • 無需自建服務器,數據庫,無需自建存儲和CDN
  • 數據庫模型很簡單,就是一個json形式的對象格式
  • 調用服務端雲函數自動獲取openid,再也沒有繁瑣的受權登錄流程了,只要進入小程序就是登錄狀態,體驗真的好
  • 開發迅速,只須要前端就能搞定全部開發工做

須要解決的問題

數據庫切換問題

使用過雲開發的人都發現雲開發切換數據庫環境是最頭疼的,若是手動去切換容易搞錯,不當心在當前環境修改了線上數據庫數據webpack

直到官方出了這個函數問題也就迎刃而解git

cloud.updateConfig({
    env: ENV === 'local' ? 'dev-aqijb' : ENV
  });

我使用的是服務端雲開發功能,爲何要這樣判斷,由於在開發工具中ENV = 'local',因此這麼判斷一下,保證開發工具中使用的是測試環境數據庫github

使用taro多端開發框架,藉助於webpack,還能夠經過process.env.NODE_ENV值區分當前代碼開發環境web

await Taro.cloud.init({
        env: `${process.env.NODE_ENV === 'development' ? 'dev-aqijb' : 'pro-hljv7'}`
        /* env: 'pro-hljv7' */
      });

這樣能夠保證開發環境和線上環境可使用對應環境的數據庫typescript

數據庫字段定義問題

由於JS是弱類型語言,不能像typescript那樣靜態定義變量類型,這樣添加到數據庫的字段數量和字段類型都沒法控制數據庫

我不想用typescript,能不能實現這樣的功能呢,能夠用superstruct庫來實現這個功能json

詳細使用案例見下方代碼小程序

函數文件太多的問題

官方和他人教程的例子都是一個文件對應一個雲函數,經過開發體驗我發現這樣作並很差,當項目有多個表的時候,找個函數文件真的太難了
咱們能夠將一個表的增刪改查函數所有寫入一個文件中

教程: 首先每一個雲函數文件中package.json引入superstruct

{
  "dependencies": {
    "wx-server-sdk": "latest",
    "superstruct": "latest"
  }
}

如下代碼是一個完整的雲函數例子

const cloud = require('wx-server-sdk');
const { struct, superstruct } = require('superstruct');
cloud.init();
//小區信息
const Model = () => {
  const db = cloud.database();
  const _ = db.command;
  const collection = db.collection('address');
  return {
    async add(data) {
      try {
        data = struct({
          name: 'string', //名字
          phone: 'string',
          unit: 'number', //樓單元號
          doorNumber: 'string', //門號
          communityId: 'string', //小區id
          _openid: 'string' //用戶的id
          //isDefault: 'boolean' //是否默認地址
        })(data);
      } catch (e) {
        const { path, value, type } = e;
        const key = path[0];

        if (value === undefined) {
          const error = new Error(`${key}_required`);
          error.attribute = key;
          throw error;
        }

        if (type === undefined) {
          const error = new Error(`attribute_${key}_unknown`);
          error.attribute = key;
          throw error;
        }
        const error = new Error(`${key}_invalid`);
        error.attribute = key;
        error.value = value;
        throw error;
      }
      let res = await this.getList({ _openid: data._openid });
      if (res.data.length >= 1) {
        return { msg: '當前只支持保存一個地址' };
      }
      res = await collection.add({
        data,
        createTime: db.serverDate(),
        updateTime: db.serverDate()
      });
      return res;
    },
    async getAdressById({ _openid, _id }) {
      const user = await collection
        .where({
          _openid,
          _id: _.eq(_id)
        })
        .get();
      return user;
    },
    //更新指定的id 先判斷手機號修改沒,沒修改直接就改數據,修改過判斷一下庫中有沒有這條數據
    async update(data) {
      //更新表的操做
    },
    //刪除指定id的shop
    async remove({ _id, _openid }) {
      //刪除表的操做
    },
    /**
     * 獲取商列表
     * @param {*} option {category 類別, pagenum 頁碼}
     */
    async getList({ _openid }) {
      const shopList = await collection
        .where({
          _openid
        })
        .get();

      return shopList;
    }
  };
};

exports.main = async (event, context) => {
  const { func, data } = event;
  const { ENV, OPENID } = cloud.getWXContext();
  // 更新默認配置,將默認訪問環境設爲當前雲函數所在環境
  console.log('ENV', ENV);
  cloud.updateConfig({
    env: ENV === 'local' ? 'dev-aqijb' : ENV
  });
  let res = await Model()[func]({ ...data, _openid: OPENID });
  return {
    ENV,
    data: res
  };
};

函數使用方式

wx.cloud.callFunction({
      'address', //雲函數文件名
      data: {
        func: 'add', //雲函數中定義的方法
        data: {} //須要上傳的數據
      }
    });

圖片 視頻等文件

直接打開雲開發控制檯選擇存儲直接上傳文件,複製url地址就能夠放到代碼中使用了

掃碼體驗個人小程序:
垃圾分類

相關文章
相關標籤/搜索