• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

微信小程序云开发

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
 版权声明: https://blog.csdn.net/qq_40999496/article/details/82773484

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

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

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

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

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

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

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

注册

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

  1.  
    var app = getApp();
  2.  
    Page({
  3.  
    data: {
  4.  
    userName: '',
  5.  
    userPassword: '',
  6.  
    userPasswordAgain: '',
  7.  
    checkbox: false,
  8.  
    repetition: false
  9.  
    },
  10.  
    // 返回主页面
  11.  
    backHomeTap: function() {
  12.  
    wx.switchTab({
  13.  
    url: '../index/index',
  14.  
    })
  15.  
    },
  16.  
    // 绑定
  17.  
    bindingTap: function () {
  18.  
    wx.redirectTo({
  19.  
    url: '../login/login',
  20.  
    })
  21.  
    },
  22.  
    // 用户名
  23.  
    userNameInput: function(e) {
  24.  
    this.setData({
  25.  
    userName: e.detail.value
  26.  
    });
  27.  
    },
  28.  
    // 密码
  29.  
    userPasswordInput: function(e) {
  30.  
    this.setData({
  31.  
    userPassword: e.detail.value
  32.  
    });
  33.  
    },
  34.  
    // 再次输入密码
  35.  
    userPasswordAgainInput: function(e) {
  36.  
    this.setData({
  37.  
    userPasswordAgain: e.detail.value
  38.  
    });
  39.  
    },
  40.  
    // 同意
  41.  
    checkboxChange: function() {
  42.  
    if (this.data.checkbox === false) {
  43.  
    this.setData({
  44.  
    checkbox: true
  45.  
    })
  46.  
    } else {
  47.  
    this.setData({
  48.  
    checkbox: false
  49.  
    })
  50.  
    }
  51.  
    var that = this;
  52.  
    var userName = this.data.userName;
  53.  
    // 初始化云
  54.  
    wx.cloud.init({
  55.  
    env: 'wubaib-9543f7',
  56.  
    traceUser: true
  57.  
    });
  58.  
    // 初始化数据库
  59.  
    const db = wx.cloud.database();
  60.  
    const _ = db.command;
  61.  
    db.collection('userInformation').where({
  62.  
    userName: _.eq(userName)
  63.  
    }).get({
  64.  
    success: function (res) {
  65.  
    if (res.data.length === 1) {
  66.  
    that.setData({
  67.  
    repetition: true
  68.  
    })
  69.  
    }
  70.  
    }
  71.  
    })
  72.  
    },
  73.  
    // 下一步,完善个人信息
  74.  
    perfectInforTap: function() {
  75.  
    var userName = this.data.userName;
  76.  
    var userPassword = this.data.userPassword;
  77.  
    var checkbox = this.data.checkbox;
  78.  
    var userPasswordAgain = this.data.userPasswordAgain;
  79.  
    var name = /^[A-Za-z0-9\u4e00-\u9fa5]+$/;
  80.  
    var repetition = this.data.repetition;
  81.  
    if (userName === '') {
  82.  
    wx.showToast({
  83.  
    title: '请输入用户名',
  84.  
    icon: 'none',
  85.  
    duration: 2000,
  86.  
    mask: true
  87.  
    })
  88.  
    } else if (!name.test(userName)) {
  89.  
    wx.showToast({
  90.  
    title: '用户名格式不正确',
  91.  
    icon: 'none',
  92.  
    duration: 2000,
  93.  
    mask: true
  94.  
    })
  95.  
    } else if (repetition === true) {
  96.  
    wx.showToast({
  97.  
    title: '用户名已存在',
  98.  
    icon: 'none',
  99.  
    duration: 2000,
  100.  
    mask: true
  101.  
    })
  102.  
    } else if (userPassword === '') {
  103.  
    wx.showToast({
  104.  
    title: '请输入密码',
  105.  
    icon: 'none',
  106.  
    duration: 2000,
  107.  
    mask: true
  108.  
    })
  109.  
    } else if (userPassword.length < 6) {
  110.  
    wx.showToast({
  111.  
    title: '密码最少6位',
  112.  
    icon: 'none',
  113.  
    duration: 2000,
  114.  
    mask: true
  115.  
    })
  116.  
    } else if (userPassword !== userPasswordAgain) {
  117.  
    wx.showToast({
  118.  
    title: '两次密码输入不一致',
  119.  
    icon: 'none',
  120.  
    duration: 2000,
  121.  
    mask: true
  122.  
    })
  123.  
    } else if (checkbox === false) {
  124.  
    wx.showToast({
  125.  
    title: '请选中已阅读',
  126.  
    icon: 'none',
  127.  
    duration: 2000,
  128.  
    mask: true
  129.  
    })
  130.  
    } else {
  131.  
    wx.redirectTo({
  132.  
    url: 'perfectInfor/perfectInfor',
  133.  
    })
  134.  
    // 保存用户名和密码
  135.  
    app.appData.account = {
  136.  
    userName: userName,
  137.  
    userPassword: userPassword
  138.  
    }
  139.  
    }
  140.  
    }
  141.  
    })

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

  1.  
  2.  
    var app = getApp();
  3.  
    Page({
  4.  
    data: {
  5.  
    userName: '',
  6.  
    userPassword: '',
  7.  
    phone: '',
  8.  
    realName: '',
  9.  
    card: '',
  10.  
    email: '',
  11.  
    },
  12.  
    // 返回主界面
  13.  
    backHomeTap: function() {
  14.  
    wx.switchTab({
  15.  
    url: '../../index/index',
  16.  
    })
  17.  
    },
  18.  
    // 手机号
  19.  
    phoneInput: function(e) {
  20.  
    this.setData({
  21.  
    phone: e.detail.value
  22.  
    });
  23.  
    },
  24.  
    // 真实姓名
  25.  
    nameInput: function(e) {
  26.  
    this.setData({
  27.  
    realName: e.detail.value
  28.  
    });
  29.  
    },
  30.  
    // 身份证
  31.  
    cardInput: function(e) {
  32.  
    this.setData({
  33.  
    card: e.detail.value
  34.  
    })
  35.  
    },
  36.  
    // email
  37.  
    emailInput: function(e) {
  38.  
    this.setData({
  39.  
    email: e.detail.value
  40.  
    })
  41.  
    },
  42.  
    // 下一步完成
  43.  
    registerSuccessTap: function() {
  44.  
    var phone = this.data.phone;
  45.  
    var realName = this.data.realName;
  46.  
    var card = this.data.card;
  47.  
    var email = this.data.email;
  48.  
    var userName = this.data.userName;
  49.  
    var userPassword = this.data.userPassword;
  50.  
    var phonereg = /^1[345789]\d{9}$/;
  51.  
    var namereg = /^[\u4E00-\u9FA5]+$/;
  52.  
    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])$/;
  53.  
    var emailreg = /^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/;
  54.  
    var that = this;
  55.  
    if (phone === '') {
  56.  
    wx.showToast({
  57.  
    title: '请输入手机号',
  58.  
    icon: 'none',
  59.  
    duration: 2000,
  60.  
    mask: true
  61.  
    });
  62.  
    } else if (!phonereg.test(phone)) {
  63.  
    wx.showToast({
  64.  
    title: '请输入正确的手机号',
  65.  
    icon: 'none',
  66.  
    duration: 2000,
  67.  
    mask: true
  68.  
    })
  69.  
    } else if (!namereg.test(realName)) {
  70.  
    wx.showToast({
  71.  
    title: '请输入正确的名字',
  72.  
    icon: 'none',
  73.  
    duration: 2000,
  74.  
    mask: true
  75.  
    })
  76.  
    } else if (card === '') {
  77.  
    wx.showToast({
  78.  
    title: '请输入身份证',
  79.  
    icon: 'none',
  80.  
    duration: 2000,
  81.  
    mask: true
  82.  
    })
  83.  
    } else if (!cardreg.test(card)) {
  84.  
    wx.showToast({
  85.  
    title: '请输入正确的身份证',
  86.  
    icon: 'none',
  87.  
    duration: 2000,
  88.  
    mask: true
  89.  
    })
  90.  
    } else if (email === '') {
  91.  
    wx.showToast({
  92.  
    title: '请输入邮箱',
  93.  
    icon: 'none',
  94.  
    duration: 2000,
  95.  
    mask: true
  96.  
    })
  97.  
    } else if (!emailreg.test(email)) {
  98.  
    wx.showToast({
  99.  
    title: '请输入正确的邮箱',
  100.  
    icon: 'none',
  101.  
    duration: 2000,
  102.  
    mask: true
  103.  
    })
  104.  
    } else {
  105.  
    // 初始化云
  106.  
    wx.cloud.init({
  107.  
    env: 'wubaib-9543f7',
  108.  
    traceUser: true
  109.  
    });
  110.  
    // 初始化数据库
  111.  
    const db = wx.cloud.database();
  112.  
    db.collection('userInformation').add({
  113.  
    // data 字段表示需新增的 JSON 数据
  114.  
    data: {
  115.  
    realName: realName,
  116.  
    userName: userName,
  117.  
    userPassword: userPassword,
  118.  
    phone: phone,
  119.  
    email: email,
  120.  
    card: card
  121.  
    },
  122.  
    success: function(res) {
  123.  
    // res 是一个对象,其中有 _id 字段标记刚创建的记录的 id
  124.  
    console.log(res);
  125.  
    console.log(res.errMsg);
  126.  
    }
  127.  
    })
  128.  
    }
  129.  
    },
  130.  
     
  131.  
    /**
  132.  
    * 生命周期函数--监听页面显示
  133.  
    */
  134.  
    onShow: function() {
  135.  
    this.setData({
  136.  
    userName: app.appData.account.userName,
  137.  
    userPassword: app.appData.account.userPassword
  138.  
    })
  139.  
    },
  140.  
    })
  141.  
     
  142.  

登录

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

  1.  
  2.  
    var app = getApp();
  3.  
    Page({
  4.  
    data: {
  5.  
    bindName: '',
  6.  
    bindPassword: '',
  7.  
    isChecked: false,
  8.  
    userName: '',
  9.  
    phone: '',
  10.  
    realName: '',
  11.  
    card: '',
  12.  
    email: '',
  13.  
    userId: ''
  14.  
    },
  15.  
    // 点击注册账号
  16.  
    registerTap: function() {
  17.  
    wx.redirectTo({
  18.  
    url: '../register/register'
  19.  
    })
  20.  
    },
  21.  
    // 获取用户名
  22.  
    bindNameInput: function(e) {
  23.  
    this.setData({
  24.  
    bindName: e.detail.value
  25.  
    })
  26.  
    var that = this;
  27.  
    if (that.data.bindName.length !== 0 && that.data.bindPassword.length !== 0) {
  28.  
    this.setData({
  29.  
    isChecked: true
  30.  
    })
  31.  
    } else if (that.data.bindName.length === 0) {
  32.  
    this.setData({
  33.  
    isChecked: false
  34.  
    })
  35.  
    }
  36.  
    },
  37.  
    // 获取密码
  38.  
    bindPasswordInput: function(e) {
  39.  
    this.setData({
  40.  
    bindPassword: e.detail.value
  41.  
    })
  42.  
    var that = this;
  43.  
    if (that.data.bindName.length !== 0 && that.data.bindPassword.length !== 0) {
  44.  
    this.setData({
  45.  
    isChecked: true
  46.  
    })
  47.  
    } else if (that.data.bindPassword.length === 0) {
  48.  
    this.setData({
  49.  
    isChecked: false
  50.  
    })
  51.  
    }
  52.  
    },
  53.  
    // 点击登录
  54.  
    bindingSuccess: function() {
  55.  
    var that = this;
  56.  
    var bindName = that.data.bindName;
  57.  
    var bindPassword = that.data.bindPassword;
  58.  
    if (bindName.length !== 0 && bindPassword.length !== 0) {
  59.  
    // 初始化云
  60.  
    wx.cloud.init({
  61.  
    env: 'wubaib-9543f7',
  62.  
    traceUser: true
  63.  
    });
  64.  
    // 初始化数据库
  65.  
    const db = wx.cloud.database();
  66.  
    db.collection('userInformation').where({
  67.  
    userName: bindName
  68.  
    }).get().then(res => {
  69.  
    console.log(res.data);
  70.  
    if (res.data[0].userPassword === bindPassword) {
  71.  
    console.log("登录成功");
  72.  
    // 保存手机号,真实姓名,身份证号,邮箱 保存用户名
  73.  
    that.setData({
  74.  
    userName: res.data[0].userName,
  75.  
    phone: res.data[0].phone,
  76.  
    realName: res.data[0].realName,
  77.  
    card: res.data[0].card,
  78.  
    email: res.data[0].email,
  79.  
    userId: res.data[0]._id

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
Fundebug专业为微信小程序踩坑发布时间:2022-07-18
下一篇:
微信小程序云开发 1发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap