云开发模型
云用开发
华为云解决方案

云用开发
云这两年是一个火爆的技术，那么如何开发云产品。从技术角度上讲，技术没有很大的革新，只是开拓了应用方式，因此要介入云产品开发，了解云的构建模式和一定的开发模型即可。当然核心部分，还是有不少技术挑战。
我的一点云理解：

1、服务器从私有变为共有

2、共享经济带来性的业务模式，有实力的公司把核心技术打包，搭建平台，给有产品能力、核心技术不强的小型公司快速落地产品。

3、书业有专攻，公共云的存在促进领域行业的快速发展和资源的充分利用。

华为云解决方案
服务器搭建隔离环境：kubernetes + ISTIO



新老系统数据共享与方案迁移：打破数据孤岛



云端解决方案，促进产品快速落地



5G解决方案，物联网形态



特定场景解决方案，成熟度高

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

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

目前提供三大基础能力支持：

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

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

           3、存储：在小程序前端直接上传/下载云端文件，在云开发控制台可视化管理

具体的可以去小程序文档上查看，下面用一个登录注册的案例来演示小程序云开发数据库的运用

注册



在创建的时候，要在点下一步的时候，调数据库来看用户名有没有重复的。在点击同意的时候来调用数据库，然后把所有的判断放到下一步来判断。所有条件都满足就将用户名和密码放到全局变量中。

var app = getApp();
Page({
  data: {
    userName: '',
    userPassword: '',
    userPasswordAgain: '',
    checkbox: false,
    repetition: false
  },
  // 返回主页面
  backHomeTap: function() {
    wx.switchTab({
      url: '../index/index',
    })
  },
  // 绑定
  bindingTap: function () {
    wx.redirectTo({
      url: '../login/login',
    })
  },
  // 用户名
  userNameInput: function(e) {
    this.setData({
      userName: e.detail.value
    });
  },
  // 密码
  userPasswordInput: function(e) {
    this.setData({
      userPassword: e.detail.value
    });
  },
  // 再次输入密码
  userPasswordAgainInput: function(e) {
    this.setData({
      userPasswordAgain: e.detail.value
    });
  },
  // 同意
  checkboxChange: function() {
    if (this.data.checkbox === false) {
      this.setData({
        checkbox: true
      })
    } else {
      this.setData({
        checkbox: false
      })
    }
    var that = this;
    var userName = this.data.userName;
    // 初始化云
    wx.cloud.init({
      env: 'wubaib-9543f7',
      traceUser: true
    });
    // 初始化数据库
    const db = wx.cloud.database();
    const _ = db.command;
    db.collection('userInformation').where({
      userName: _.eq(userName)
    }).get({
      success: function (res) {
        if (res.data.length === 1) {
          that.setData({
            repetition: true
          })
        }
      }
    })
  },
  // 下一步，完善个人信息
  perfectInforTap: function() {
    var userName = this.data.userName;
    var userPassword = this.data.userPassword;
    var checkbox = this.data.checkbox;
    var userPasswordAgain = this.data.userPasswordAgain;
    var name = /^[A-Za-z0-9\u4e00-\u9fa5]+$/;
    var repetition = this.data.repetition;
    if (userName === '') {
      wx.showToast({
        title: '请输入用户名',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (!name.test(userName)) {
      wx.showToast({
        title: '用户名格式不正确',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (repetition === true) {
      wx.showToast({
        title: '用户名已存在',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (userPassword === '') {
      wx.showToast({
        title: '请输入密码',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (userPassword.length < 6) {
      wx.showToast({
        title: '密码最少6位',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (userPassword !== userPasswordAgain) {
      wx.showToast({
        title: '两次密码输入不一致',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (checkbox === false) {
      wx.showToast({
        title: '请选中已阅读',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else {
      wx.redirectTo({
        url: 'perfectInfor/perfectInfor',
      })
      // 保存用户名和密码
      app.appData.account = {
        userName: userName,
        userPassword: userPassword
      }
    }
  }
})

在完善信息的时候获取所有的变量（用户名和密码也在内），然后在点击下一步完成按钮将数据上传到数据库。

​
var app = getApp();
Page({
  data: {
    userName: '',
    userPassword: '',
    phone: '',
    realName: '',
    card: '',
    email: '',
  },
  // 返回主界面
  backHomeTap: function() {
    wx.switchTab({
      url: '../../index/index',
    })
  },
  // 手机号
  phoneInput: function(e) {
    this.setData({
      phone: e.detail.value
    });
  },
  // 真实姓名
  nameInput: function(e) {
    this.setData({
      realName: e.detail.value
    });
  },
  // 身份证
  cardInput: function(e) {
    this.setData({
      card: e.detail.value
    })
  },
  // email
  emailInput: function(e) {
    this.setData({
      email: e.detail.value
    })
  },
  // 下一步完成
  registerSuccessTap: function() {
    var phone = this.data.phone;
    var realName = this.data.realName;
    var card = this.data.card;
    var email = this.data.email;
    var userName = this.data.userName;
    var userPassword = this.data.userPassword;
    var phonereg = /^1[345789]\d{9}$/;
    var namereg = /^[\u4E00-\u9FA5]+$/;
    var cardreg = /^\d{6}(18|19|20)?\d{2}(0[1-9]|1[012])(0[1-9]|[12]\d|3[01])\d{3}(\d|[xX])$/;
    var emailreg = /^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/;
    var that = this;
    if (phone === '') {
      wx.showToast({
        title: '请输入手机号',
        icon: 'none',
        duration: 2000,
        mask: true
      });
    } else if (!phonereg.test(phone)) {
      wx.showToast({
        title: '请输入正确的手机号',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (!namereg.test(realName)) {
      wx.showToast({
        title: '请输入正确的名字',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (card === '') {
      wx.showToast({
        title: '请输入身份证',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (!cardreg.test(card)) {
      wx.showToast({
        title: '请输入正确的身份证',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (email === '') {
      wx.showToast({
        title: '请输入邮箱',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else if (!emailreg.test(email)) {
      wx.showToast({
        title: '请输入正确的邮箱',
        icon: 'none',
        duration: 2000,
        mask: true
      })
    } else {
      // 初始化云
      wx.cloud.init({
        env: 'wubaib-9543f7',
        traceUser: true
      });
      // 初始化数据库
      const db = wx.cloud.database();
      db.collection('userInformation').add({
        // data 字段表示需新增的 JSON 数据
        data: {
          realName: realName,
          userName: userName,
          userPassword: userPassword,
          phone: phone,
          email: email,
          card: card
        },
        success: function(res) {
          // res 是一个对象，其中有 _id 字段标记刚创建的记录的 id
          console.log(res);
          console.log(res.errMsg);
        }
      })
    }
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {
    this.setData({
      userName: app.appData.account.userName,
      userPassword: app.appData.account.userPassword
    })
  },
})

​

登录

在登录页面，先获取用户输入的用户名和密码。在点击登录的时候，先根据userName调数据库的密码和用户输入的密码是否相等。如果相等将用户的信息保存到全局变量中。

​
var app = getApp();
Page({
  data: {
    bindName: '',
    bindPassword: '',
    isChecked: false,
    userName: '',
    phone: '',
    realName: '',
    card: '',
    email: '',
    userId: ''
  },
  // 点击注册账号
  registerTap: function() {
    wx.redirectTo({
      url: '../register/register'
    })
  },
  // 获取用户名
  bindNameInput: function(e) {
    this.setData({
      bindName: e.detail.value
    })
    var that = this;
    if (that.data.bindName.length !== 0 && that.data.bindPassword.length !== 0) {
      this.setData({
        isChecked: true
      })
    } else if (that.data.bindName.length === 0) {
      this.setData({
        isChecked: false
      })
    }
  },
  // 获取密码
  bindPasswordInput: function(e) {
    this.setData({
      bindPassword: e.detail.value
    })
    var that = this;
    if (that.data.bindName.length !== 0 && that.data.bindPassword.length !== 0) {
      this.setData({
        isChecked: true
      })
    } else if (that.data.bindPassword.length === 0) {
      this.setData({
        isChecked: false
      })
    }
  },
  // 点击登录
  bindingSuccess: function() {
    var that = this;
    var bindName = that.data.bindName;
    var bindPassword = that.data.bindPassword;
    if (bindName.length !== 0 && bindPassword.length !== 0) {
      // 初始化云
      wx.cloud.init({
        env: 'wubaib-9543f7',
        traceUser: true
      });
      // 初始化数据库
      const db = wx.cloud.database();
      db.collection('userInformation').where({
        userName: bindName
      }).get().then(res => {
        console.log(res.data);
        if (res.data[0].userPassword === bindPassword) {
          console.log("登录成功");
          // 保存手机号，真实姓名，身份证号，邮箱 保存用户名
          that.setData({
            userName: res.data[0].userName,
            phone: res.data[0].phone,
            realName: res.data[0].realName,
            card: res.data[0].card,
            email: res.data[0].email,
            userId: res.data[0]._id
          })
          app.appData.userinfo = {
            phone: that.data.phone,
            realName: that.data.realName,
            card: that.data.card,
            email: that.data.email
          }
          app.appData.account = {
            userName: that.data.userName
          }
          app.appData.userId = {
            userId: that.data.userId
          }
          wx.switchTab({
            url: '../personalCenter/personalCenter',
          })
        } else {
          wx.showToast({
            title: '用户名或密码错误',
            icon: 'none',
            duration: 2000
          })
        }
      })
    }
  },
})

​

登录WXML

<view class='phoneNumberContainer'>
  <input placeholder='用户名' maxlength='11' bindinput="bindNameInput"></input>
</view>
<view class='passwordContainer'>
  <input placeholder='密码' password="true" bindinput="bindPasswordInput"></input>
</view>
<view class="{{isChecked?'bindingChecked':'bindingNormal'}}" bindtap='bindingSuccess'>立即登录</view>
<view class='registerContainer' bindtap='registerTap'>注册账号</view>

注册第一步的WXML

<!--返回主页  -->
<view class='backHome' bindtap='backHomeTap'>
  <image src='/images/homeIcon.png' class='backHomeImg'></image>
</view>
<!--头部  -->
<view class='headerContainer'>
  <!--创建账户  -->
  <view class='headerListContainer headerListActive'>
    <view class='headerListView'>1</view>
    <text class='headerListText'>创建账户</text>
  </view>
  <!--完善个人信息  -->
  <view class='headerListContainer'>
    <view class='headerListView'>2</view>
    <text class='headerListText'>完善个人信息</text>
  </view>
  <!--注册成功  -->
  <view class='headerListContainer'>
    <view class='headerListView'>3</view>
    <text class='headerListText'>注册成功</text>
  </view>
  <view class='transverseLineLeft'></view>
  <view class='transverseLineright'></view>
</view>
<view class='mainContainer'>
  <!--用户名  -->
  <view class='mainListContainer'>
    <view class='mainListText'>用户名</view>
    <input class='mainListInput' placeholder='请输入数字,字母或中文' maxlength='25' bindinput='userNameInput'></input>
  </view>
  <!--密码  -->
  <view class='mainListContainer'>
    <view class='mainListText'>密码</view>
    <input class='mainListInput' placeholder='长度6~14位' password='true' maxlength='14' bindinput='userPasswordInput'></input>
  </view>
  <!--确认密码  -->
  <view class='mainListContainer'>
    <view class='mainListText'>确认密码</view>
    <input class='mainListInput' placeholder='请再次输入密码' password='true' maxlength='14' bindinput='userPasswordAgainInput'></input>
  </view>
</view>
<!--agree  -->
<view class='agreeContainer'>
  <checkbox class='agreeCheckbox' checked="{{check}}" bindtap="checkboxChange"/>
  <text>我已阅读并接受</text>
  <text class='clause'>《用户注册条款》</text>
</view>
<!--nextButton  -->
<view class='nextButton' bindtap='perfectInforTap'>下一步，完善个人信息</view>
<!--binding  -->
<view class='bindingContainer'>
  <text>已有账号</text>
  <text class='binding' bindtap='bindingTap'>请绑定</text>
</view>

注册第二步WXML

<!--返回主页  -->
<view class='backHome' bindtap='backHomeTap'>
  <image src='/images/homeIcon.png' class='backHomeImg'></image>
</view>
<!--头部  -->
<view class='headerContainer'>
  <!--创建账户  -->
  <view class='headerListContainer headerListOldActive'>
    <view class='headerListView'>1</view>
    <text class='headerListText'>创建账户</text>
  </view>
  <!--完善个人信息  -->
  <view class='headerListContainer headerListActive'>
    <view class='headerListView'>2</view>
    <text class='headerListText'>完善个人信息</text>
  </view>
  <!--注册成功  -->
  <view class='headerListContainer'>
    <view class='headerListView'>3</view>
    <text class='headerListText'>注册成功</text>
  </view>
  <view class='transverseLineLeft'></view>
  <view class='transverseLineright'></view>
</view>
<!--main  -->
<view class='mainContainer'>
  <!--手机  -->
  <view class='mainListContainer'>
    <view class='mainListText'>手机</view>
    <input class='mainListInput' placeholder='请输入手机号码' maxlength="11" bindinput='phoneInput'></input>
  </view>
  <!--真实姓名  -->
  <view class='mainListContainer'>
    <view class='mainListText'>真实姓名</view>
    <input class='mainListInput' placeholder='请输入真实姓名' maxlength='25' bindinput='nameInput'></input>
  </view>
  <!--证件类型  -->
  <view class='mainListContainer'>
    <view class='mainListText'>证件类型</view>
    <view class='cardText'>中华人民共和国居民身份证</view>
  </view>
  <!--证件号码  -->
  <view class='mainListContainer'>
    <view class='mainListText'>证件号码</view>
    <input class='mainListInput' type='idcard' placeholder='请输入身份证号码' maxlength="18" bindinput='cardInput'></input>
  </view>
  <!--邮箱  -->
  <view class='mainListContainer'>
    <view class='mainListText'>邮箱</view>
    <input class='mainListInput' placeholder='请输入常用的邮箱地址' bindinput='emailInput'></input>
  </view>
</view>
<!--nextButton  -->
<view class='nextButton' bindtap='registerSuccessTap'>下一步，完成</view>

好多人问我要源码，我就不一个一个发了。要源码的自己git下载吧

下载地址：https://github.com/wubaibin/wx_yunkaifa.git

在云控制台操作云数据库，即创建数据库和插入数据等操作。

云开发数据库提供的数据类型：string、number、object、array、bool、GeoPoint(地理位置点)、Date（时间）、Null

其中的Date表示时间，精确到毫秒。小程序端用Javascript内置Date对象创建的时间是客户端时间，在需要用服务端时间的时候，用API中提供的serverDate对象来创建服务端当前的时间标记。

GeoPoint:用于表示地理位置点，经纬度唯一标记一个点，可以把这个地理位置理解为平面直角坐标系，这样就更容易理解地理位置点了。

和平常操作数据库类似。在对数据库进行增删查改之前，先连接数据库。对小程序云数据库进行操作的时候，先获取数据库的引用。

const db = wx.cloud.database({

   env:"test25"

});

要操作数据库的一个集合时。也是需要先获取该集合的引用。

const table = db.collection('todos');

现在就可以往集合 todos 添加一条json数据了。

const db = wx.cloud.database({});

const table = db.collection('todos');

table.add({

data: {

description: "我正在学习云开发！",

due: new Date(),

tags: [

"cloud",

"database"

],

},

success: function(res) {

console.log(res._id)

}

});

在云开发控制台查看，是否添加成功

最下面的数据就是刚刚添加的数据。



 

读取数据： 现在读取数据库中刚刚插入的一条数据，doc就是对应的key的值。

table.doc("W54MA0XodRKIs7ZO").get({

success:function(res){

console.log(res.data)

}

})；

 

获取的结果如下：



读取多条数据 ：要读取多条数据时，就在获取集合后添加where判断。

const db = wx.cloud.database({});

const table = db.collection('todos');

table.where({

_openid: 'o_ggh0cxzVwcLNSZTyOlAF_iyNKs'

}).get({

success:function(res){

console.log(res.data)

}

});

 

效果如图：



更改数据：使用update方法来更新一个记录或一个集合，其他数据不会受到影响。

如要修改ID为W54MA0XodRKIs7ZO的记录，

table.doc("W54MA0XodRKIs7ZO").update({

data: {

description: "很好"

},

success: function (res) {

console.log(res)

}

})



 

删除数据：用remove函数来删除数据库中的一条数据，如果要删除多条数据的话，就必须在server端进行操作（就是云函数）

const db = wx.cloud.database({});

const table = db.collection('todos');

table.doc("W54MA0XodRKIs7ZO").remove({

success:function(res){

console.log(res)

}

})



 

 

 

 

 

 

 

【小程序-云开发】手把手教你使用云开发（云储存开发）
    话说上次程序员哥哥,教会美工妹妹创建小程序云开发的环境后;发现在云开发环境中竟然送了一个5G的储存空间。于是琢磨来琢磨去反正白用白不用，这5G储存空间用来做什么好呢?终于灵光一闪,做个私有的照片储存小程序吧！毕竟5G的空间可以储存2000张左右的照片，刚好可以把手机重要的照片保存一下。

    在写这个照片储存小程序前先要理清这个小程序的思路，当运行这个小程序后需有一个按钮,点击这个按钮自动调出本地相册或相机,当调用成功后就直接把照片上传到云开发环境中的储存空间。

我们这个照片储存小程序只需要使用两个API:
    一个wx.chooseImage用于调出本地相册或相机，另一个就是云开发中的wx.cloud.uploadFile用于将照片上传到云储存空间。

思路理清,API也知道了;那我们开始动手吧!Let’s do it!
调出我们熟悉的微信开发工具。

图1
注意，在建立云开发快速启动模板前的勾不用选择【图1】
进入开发界面，这时候默认只有一个project.config文件 ，所以我们还需要创建 app.js 和 app.json 及相关的基本页面(图2)进行补齐。

图2
我们只是做一个简单的页面，页面上就一个上传按钮，点击这个按钮就调出之前我们构思好的两个API，因此只需要在index.wxml里写入一个按钮就可以了(图3)。

图3
接下来就是用户使用时点击按钮的脚本调用，这里我们只要在index.js里写入相关 API的代码就可以了；图4相关代码。

图4
到这里我们的照片储存小程序就基本已开发完毕了，赶紧点击模拟器中的【上传按钮】，测试一下吧~
如提示上传成功，我们就可以点击【云开发】打开【云开发控制台】中的【储存管理】中看到我们上传的文件（图5）。

图5
是不是很简单只要几步就能创建一个属于自己的小程序，如果在以前确实挺复杂繁琐的，既要设置上传服务器和开通相关的权限,但现在有了小程序云开发后这些事情就so easy！赶紧自己动手做一个属于你自己的小程序吧!
注：该文已首发于[微信公开课+]中的[小程序社区]
更多技术文章可以扫描以下方二维码加入微信公开课+