想做微信小程序云开发内容

本文主要是介绍想做微信小程序云开发内容，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

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

云开发为开发者提供完整的云端支持，弱化后端和运维概念，无需搭建服务器，使用平台提供的 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
})
},
})

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>
<view class='agreeContainer'>
<checkbox class='agreeCheckbox' checked="{{check}}" bindtap="checkboxChange"/>
<text>我已阅读并接受</text>
<text class='clause'>《用户注册条款》</text>
</view>
<view class='nextButton' bindtap='perfectInforTap'>下一步，完善个人信息</view>
<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>
<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>
<view class='nextButton' bindtap='registerSuccessTap'>下一步，完成</view>

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

下载地址：GitHub - wubaibin/wx_yunkaifa: 微信云开发

业务搭载离不了云服务器，选择合适的平台最重要！

从目前国内云计算市场的格局来看，国内云计算前三强分别是阿里云、腾讯云和华为云，阿里云、腾讯云作为背靠互联网平台的企业，更偏向于B端用户；华为与作为传统的通信巨头，更偏向于G端。

本人从事云计算相关工作至今已有多年，国内主流的云平台都接触过，包括他们的销售及技术团队，对各家的产品也小有了解，并且指导过数百家企业迁移上云，对云平台选择也有一定的发言权！

网上有很多评测，评测数据也五花八门，说谁好的都有，这个两篇博文分析汇总的非常详细，分享给大家，文档地址：

博文1：云服务器哪家好！阿里云、腾讯云、华为云的服务器配置及价格对比？

博文2：阿里云服务器突发型t6、n4、s6、c5、c6怎么选？和腾讯云服务器标准型s3、sn3ne、s4、s5、sa2相比哪家好？全面解析

如果是高并发，高IO业务场景，需要确定服务器规格，可让业务应用性能发挥到最佳，参考官方文档：

阿里云服务器规格：规格实例族 - 云服务器 ECS

腾讯云服务器规格：规格实例族 - 云服务器CVM

这篇关于想做微信小程序云开发内容的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

微信公众号开发