微信小程序云开发使用方法新手初体验


Posted in Javascript onMay 16, 2019

今天看到微信推送了一条小程序云上线通知,作为一个前端er,满怀期待的去看了看,很不错先看看文档上怎么说的:

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

云开发为开发者提供完整的云端支持,弱化后端和运维概念,无需搭建服务器,使用平台提供的 API 进行核心业务开发,即可实现快速上线和迭代,同时这一能力,同开发者已经使用的云服务相互兼容,并不互斥。(就是说以后老板让你做小程序,连个后台的人都不用给你配了,自己搞定就行了)。

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

  • 云函数:在云端运行的代码,微信私有协议天然鉴权,开发者只需编写自身业务逻辑代码
  • 数据库:一个既可在小程序前端操作,也能在云函数中读写的 JSON 数据库
  • 存储:在小程序前端直接上传/下载云端文件,在云开发控制台可视化管理

说白了就是,云函数就是后端代码,现在叫云函数,自己写,自己上传,数据库没什么好说的,就是数据库,不过这个数据库是json数据库,很方便,怎么个方便法呢,看下图:

传统数据库以mysql为例子:

微信小程序云开发使用方法新手初体验

看到int..这么多类型是不是很烦躁,取的时候再合并多个表也很麻烦

小程序云json数据库:

微信小程序云开发使用方法新手初体验

看到这些类型是不是很亲切,大大降低了新手对数据库理解,不用学黑窗口,sql命令,还可以导入josn数据,很是方便。

现在走一遍流程:

1、创建带小程序云模板的小程序:

微信小程序云开发使用方法新手初体验

----新建一个空的文件夹,填入你的appId(必须),官方说 :勾选创建 “云开发 QuickStart 项目”,实际上是"建立云开发快速启动模板",有点坑哦,同学要注意,点击确定 ==>

2.看到这么多是不是有点方  - -!,看到多了一个东西,点击创建自己的环境,,具体就是写个名字,创个一个环境,官方上说是最好创建俩个环境,一个是开发环境,一个是线上环境。

微信小程序云开发使用方法新手初体验

不做赘述,都是免费的

微信小程序云开发使用方法新手初体验

看这配置给的也挺良心,一般人真的不用升级配置 ==>

3.选择环境,环境创建好了,不过还没有使用上

微信小程序云开发使用方法新手初体验

对第一个文件夹点右键,选择你要使用的环境,下面则是你的云函数,就是跑在服务器上的。

对login文件夹点右键,选择上传并部署,ps:不上传部署怎么使用呀,所以没毛病。==>

4.先别急上传个login是怎么使用的,我们先去看点击获取openid是事件,发现,这里只有个name对应上上传的云函数事件名,而云函数直接就返回了openid,看看云函数是怎么实现的

wx.cloud.callFunction({
 name: 'login',
 data: {},
 success: res => {
 console.log('[云函数] [login] user openid: ', res.result.openid)
 app.globalData.openid = res.result.openid
 wx.navigateTo({
  url: '../userConsole/userConsole',
 })
 },
 fail: err => {
 console.error('[云函数] [login] 调用失败', err)
 wx.navigateTo({
  url: '../deployFunctions/deployFunctions',
 })
 }
})
// 云函数模板
// 部署:在 cloud-functions/login 文件夹右击选择 “上传并部署”
 
/**
 * 这个示例将经自动鉴权过的小程序用户 openid 返回给小程序端
 * 
 * event 参数包含
 * - 小程序端调用传入的 data
 * - 经过微信鉴权直接可信的用户唯一标识 openid 
 * 
 */
exports.main = (event, context) => {
 console.log(event)
 console.log(context)
 
 // 可执行其他自定义逻辑
 // console.log 的内容可以在云开发云函数调用日志查看
 
 return {
 openid: event.userInfo.openId,
 }
}

云函数里,直接就能拿到用户的openid和appid并返回,所以在前端上拿到了openid,真的是很方便。==>

微信小程序云开发使用方法新手初体验

5.关于数据库,数据库那边每一个表都有权限设置,好好看一下。

创建很简单,读取也很简单,很像slq语句。

先创建一个db对象,然后直接走collection('表名字').where({条件}).get().then(res=>{}) ,我这里使用的是Promise风格,当然也可以使用回调的方式,就可以把表里的数据都取出来在页面上展示了。

const db = wx.cloud.database();
 db.collection('todos').where({
 _id: 'W5c0IDWesyZkco4t'
 }).get().then(res => {
 this.setData({
 dataList: res.data
 })
 })

更多api还是得看接口

感觉还可以继续完善,使用起来感觉很好,把一切变的简单。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
关于UTF-8的客户端用AJAX方式获取GB2312的服务器端乱码问题的解决办法
Nov 30 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
Jul 29 Javascript
JavaScript实现点击按钮字体放大、缩小
Feb 29 Javascript
javascript基本数据类型及类型检测常用方法小结
Dec 14 Javascript
浅谈vuex之mutation和action的基本使用
Aug 29 Javascript
BetterScroll 在移动端滚动场景的应用
Sep 18 Javascript
Thinkjs3新手入门之如何使用静态资源目录
Dec 06 Javascript
深入理解ES6之数据解构的用法
Jan 13 Javascript
elementui的默认样式修改方法
Feb 23 Javascript
JS 实现缓存算法的示例(FIFO/LRU)
Mar 20 Javascript
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
安装多版本Vue-CLI的实现方法
Mar 24 Javascript
angular多语言配置详解
May 16 #Javascript
详解基于mpvue微信小程序下载远程图片到本地解决思路
May 16 #Javascript
Django模板继承 extend标签实例代码详解
May 16 #Javascript
vue视图不更新情况详解
May 16 #Javascript
详解如何写出一个利于扩展的vue路由配置
May 16 #Javascript
Vue中props的详解
May 16 #Javascript
使用Vue实现移动端左滑删除效果附源码
May 16 #Javascript
You might like
PHP删除特定数组内容并且重建数组索引的方法.
2011/03/25 PHP
php中将地址生成迅雷快车旋风链接的代码[测试通过]
2011/04/20 PHP
ThinkPHP实现附件上传功能
2017/04/27 PHP
thinkphp5修改view到根目录实例方法
2019/07/02 PHP
node.js chat程序如何实现Ajax long-polling长链接刷新模式
2012/03/13 Javascript
点击显示指定元素隐藏其他同辈元素的方法
2014/02/19 Javascript
Egret引擎开发指南之创建项目
2014/09/03 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
2015/07/28 Javascript
NodeJs——入门必看攻略
2016/06/27 NodeJs
浅谈js的url解析函数封装
2016/06/28 Javascript
Bootstrap框架安装使用详解
2017/01/21 Javascript
微信小程序 ecshop地址三级联动实现实例代码
2017/02/28 Javascript
微信JS-SDK选取手机照片上传功能
2017/04/21 Javascript
angular.js指令中的controller、compile与link函数的不同之处
2017/05/10 Javascript
JavaScript满天星导航栏实现方法
2018/03/08 Javascript
浅谈webpack4 图片处理汇总
2018/09/12 Javascript
[01:07:53]RNG vs VG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
[01:08:24]DOTA2-DPC中国联赛 正赛 RNG vs Phoenix BO3 第一场 2月5日
2021/03/11 DOTA
Python自动化构建工具scons使用入门笔记
2015/03/10 Python
探究Python的Tornado框架对子域名和泛域名的支持
2015/05/02 Python
Python常见加密模块用法分析【MD5,sha,crypt模块】
2017/05/24 Python
python模块smtplib学习
2018/05/22 Python
Python基于多线程实现抓取数据存入数据库的方法
2018/06/22 Python
解决Python3.5+OpenCV3.2读取图像的问题
2018/12/05 Python
使用Python的SymPy库解决数学运算问题的方法
2019/03/27 Python
Django 大文件下载实现过程解析
2019/08/01 Python
使用Tensorflow实现可视化中间层和卷积层
2020/01/24 Python
python 将视频 通过视频帧转换成时间实例
2020/04/23 Python
基于python实现ROC曲线绘制广场解析
2020/06/28 Python
HTML5 Canvas draw方法制作动画效果示例
2013/07/11 HTML / CSS
html5 canvas移动浏览器上实现图片压缩上传
2016/03/11 HTML / CSS
Html5页面获取微信公众号的openid的方法
2020/05/12 HTML / CSS
Unix里面如何在后台运行程序
2016/10/14 面试题
学校安全工作汇报材料
2014/08/16 职场文书
服务明星事迹材料
2014/12/29 职场文书
团支部书记竞选稿
2015/11/21 职场文书