前言
serverless，如果百度一下，你会发现一堆的针对于serverless讲概念，讲原理的文章，什么无运维，FaaS(函数既服务)，BaaS(后端既服务)等等，我觉得这些文章写的都挺好，但是看完这些文章后。我只想说道理我都懂了，那我要怎么做呢？这里我就从微信小程序作为切入点，来让我们实实在在的来一把serverless开发
我认为的serverless
微信小程序出现后，我们发现原来我们开发前端应用还可以寄放在别人那里。我们小程序开发完后，只要去开发者平台点下上传就完成了前端部署，我们要做的只是部署后端服务。
但是后端服务运维是一件很麻烦的事情，我们能不能懒一点，把这个后端服务也部署到别人那里，当然有，那就是阿里云，腾讯云。我们要做的只是把我们本地调试好的后台服务部署上去
但是我们能不能更懒一点，就别去部署了，直接就在别人那里开发前端和后端的应用，我们要做的就是按照别人定的规则来开发前后端应用就好，开发完后直接把两个都上传上去就行了。基于这种想法云开发serverless云端一体化就应运而生了。
其实这种想法大大的降低了前端开发人员进入后端开发的门槛，和前端开发人员中所谓的全栈工程师不谋而合。
小程序中的serverless
在微信小程序中我们能非常简单的建立起一个serverless应用，只要在新建项目时候选择小程序云开发即可，如下图
这样新建的项目中除了我们常规的小程序目录以外会多一个cloudfunctions目录，顾名思义就是云函数目录，所谓的云函数可以理解成我们前端开发中调用的接口，也就是后台服务处理函数
有了这个目录后，我们需要去创建一个应用，把这个目录部署上去，很简单，点击微信开发工具左上角第四个图标，云开发
按照引导一直点到开通，给你的应用起个名字，这些做完后右键点击cloudfunctions目录，选择你创建的那个环境，然后点开app.js文件把你的应用ID配置进去。
到这里你们的serverless应用已经建立起来了。可以在云开发控制台工具里看看你的后端服务:日志，数据库，文件存储功能都有
剩下的就是按照微信小程序的规则来进行开发即可，项目本身就自带实例。
函数开发完成后右键点击cloudfunctions下面的对应的函数文件夹比如这里使用实例自带的login函数就是login文件夹，选择上传，这个函数就会变成云函数，可以在云开发控制台的云函数列表里看见，然后就可以在前端代码里通过
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',
})
}
})
这种方式来调用云函数，具体可以看项目里的官方实例。
调用文件系统，数据库等都有对应的API，可以查看微信官方文档
现在再回过头来看看FaaS和BaaS的概念就会更清晰了，所有的服务都是通过函数来调用，所有的后端都是服务
其他各端的serverless
上面只是说了小程序端的serverless，其他端的呢，比如web端，app端。就我目前来看国内其他各端的云开发serverless云端一体化方案较为成熟的还是Dcloud，它和阿里云和腾讯云都有合作，而且提供了uni-app多端打包方案
可以根据它的官方教程建立serverless云项目，必须要用它提供的开发工具HBuilderX，建立出来的项目目录几乎和微信小程序建立出来的一模一样
然后创建应用，然后右键cloudfunctions选择你的应用
做好上面的步骤，我们来用它开发一个最简单的注册页面
1.建立数据库表
右键点击编辑器里的cloudfunctions文件夹选择"打开uniCloud Web控制台"，在控制台里点击"云数据库"，新建一个表名字就叫userData吧
2.建立云函数
右键点击编辑器里的cloudfunctions文件夹选择"新建云函数"起名字叫login，它会自动生成index.js，修改这个文件代码如下
'use strict';
const db = uniCloud.database() //连接数据库
exports.main = async (event, context) => {
const collection = db.collection('userData') //获取数据库里的userData表
const res = await collection.add(event) //接受客户端传来的用户数据,往表里查一条
if(res){// 状态返回
return {
status:'sucess'
}
} else {
return {
status:'fail'
}
}
};
然后右键点击login目录，选择上传部署看编辑器下面控制台提示完成即可
3.做个注册页面
uniapp是基于vue的所以，修改page/index.vue文件代码如下
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<view class="title">{{title}}</view>
<input type="text" v-model="username" placeholder="用户名" />
<input type="text" v-model="password" placeholder="密码" password />
<button @click='onButtonClick'>注册</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: '注册页面',
username:'',
password:''
}
},
onLoad() {
},
methods: {
async onButtonClick(){
const { username,password } = this
const res = await uniCloud.callFunction({
name:"login",
data:{
username,
password
}
})
console.log(res)
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
input{
display: block;
border-bottom: 1px solid #f4f4f4;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
}
.text-area {
display: flex;
flex-direction: column;
justify-content: center;
}
.title {
font-size: 36rpx;
color: #8f8f94;
}
</style>
其实就是做一个简单的注册页面，重点是onButtonClick方法，通过uniCloud.callFunction调用云函数login，传入用户名和密码
4.调试
点编辑器里的预览会有一个页面
填好信息点注册，然后到uniCloud Web控制台里的云数据库里看一下，表里增加了一条信息
这样一个最简单的注册功能就完成了。
PS：其实像注册/登陆这种常用功能Dcloud已经集成好了，我们直接按照官方文档提供的api来实现就行了
最后
通过云开发serverless云端一体化，我们能像上面那样非常简单的实现业务功能，不再需要考虑这个服务怎么配置，那个服务怎么配置，对于开发人员来说真的很方便了。而且对于前端开发人员转全栈算是提供了一条捷径
不过我暂时还没在dcloud上找到像redis，消息队列等服务调用的文档。不知道以后会不会有
