乐趣区

关于serverless:2022年你还不会serverless看看这篇保姆级教程下

jiezi

本篇次要演示腾讯云 serverless 部署

Web 函数治理

Web 函数运行原理如下图所示：

用户发送的 HTTP 申请通过 API 网关后，网关侧将原生申请间接透传的同时，在申请头部增加了网关触发函数时须要的函数名、函数地区等内容，并一起传递到函数环境，触发后端函数执行。

函数环境内，通过内置的 Proxy 实现 Nginx 转发，并去除头部非产品标准的申请信息，将原生 HTTP 申请通过指定端口发送给用户的 Web Server 服务。

用户的 Web Server 配置好指定的监听端口 9000 和服务启动文件后部署到云端，通过该端口获取 HTTP 申请并进行解决。

Web 函数申请限度

  • Web 函数只能通过 API 网关调用，不反对通过函数 API 接口触发。

  • 在 Response headers 中有以下限度：

    • 所有 key 和 value 的大小不超过 4KB。
    • body 的大小不超过 6MB。
  • 部署您的 Web 服务时，必须监听指定的 9000 端口，不能够监听外部回环地址 127.0.0.1。
  • 目前 HTTP 申请 Header 里的 Connection 字段不反对自定义配置。

启动文件作用

scf_bootstrap 为 Web Server 的启动文件，保障您的 Web 服务失常启动并监听申请。除此之外，您还能够依据须要在 scf_bootstrap 中自定义实现更多个性化操作：

  • 设定运行时依赖库的门路及环境变量等。
  • 加载自定义语言及版本依赖的库文件及扩大程序等，如仍有依赖文件须要实时拉取，可下载至 /tmp 目录。
  • 解析函数文件，并执行函数调用前所需的全局操作或初始化程序（如开发工具包客户端 HTTP CLIENT 等初始化、数据库连接池创立等），便于调用阶段复用。
  • 启动平安、监控等插件。

应用前提

  • 需具备可执行权限，请确保您的 scf_bootstrap 文件具备 777 或 755 权限，否则会因为权限有余而无奈执行。
  • 可能在 SCF 零碎环境（CentOS 7.6）中运行。
  • 如果启动命令文件是 shell 脚本，第一行需有 #!/bin/bash。
  • 启动命令必须为绝对路径 /var/lang/${specific_lang}${version}/bin/${specific_lang}，否则无奈失常调用，详情请参见 规范语言环境绝对路径。
  • 倡议应用监听地址为 0.0.0.0，不能够应用外部回环地址 127.0.0.1

规范语言环境绝对路径

常见 Web Server 启动命令模版

serverless fromework 及控制台部署

serverless 文档 https://www.serverless.com/cn…

1. 控制台部署

部署 koa2 治理端接口




官网 demo https://github.com/tencentyun…

仓库关联 GitHub，提交 git 代码自动更新

2. 命令行部署 -Serverless Framework 形式

云函数和 serverless 的区别

  • Serverless Framework 是 Serverless 公司推出的一个开源的Serverless 利用开发框架。
  • Serverless Framework是由 Serverless Framework Plugin 和 Serverless Framework Components 组成。
  • Serverless Framework Plugin 实际上是一个函数的管理工具，应用这个工具，能够很轻松的 部署函数、删除函数、触发函数、查看函数信息、查看函数日志、回滚函数、查看函数 数据等。简略的概括就是serverless 其实就云函数的集合体，应用 serverless 后咱们创立的云函数不须要手动去创立触发器等操作。

  • 官网地址

    • serverless官网地址
    • serverless中武官网
    • github地址

Serverless Framework 利用场景

什么场景下须要应用 serverless，而不是应用云函数，其实在理论开发过程中，咱们都是应用serverless 而不去应用云函数，毕竟云函数的应用场景受限，或者说比拟根底。打一个简略的比如，在写 js 操作 dom 的时候，你会抉择用原生 js 还是会应用 jquery 一样的比喻。

  • 基于云函数的命令行开发工具

    • 通过 Serverless Framework，开发者能够在命令行实现函数的开发、部署、调试。还能够联合前端服务、API 网关、数据库等其它云上资源，实现全栈利用的疾速部署。

  • 传统利用框架的疾速迁徙

    • Serverless Framework 提供了一套通用的框架迁徙计划，通过应用 Serverless Framework提供的框架组件(Egg/Koa/Express 等，更多的框架反对能够参考)，原有利用仅需几行代码简略革新，即可疾速迁徙到函数平台。同时反对命令行与控制台的开发方式。

应用 serverless 命令创立第一个利用

全局装置命令

npm install -g serverless 
serverless -v

创立我的项目

在电脑的一个空目录下运行命令

serverless

依据提醒抉择你要创立的模板

控制台输出 serverless

抉择对应的模板

部署上线

serverless deploy



serverless.yml 配置详情

https://github.com/serverless…

部署上线后能够在这里查看你的我的项目

测试部署的我的项目

删除部署的我的项目

3. 在 vscode 中配置插件来开发 serverless

在 vscode 上装置插件

在 vscode 装置后插件登录并且拉取利用

对于登录账号及密钥查看地址

近程拉取代码

下载后的代码如果想上传也能够间接上传的

WebIDE 创立云函数实际


serverless 部署前端我的项目

倡议应用 Serverless Framework CLI，可疾速部署本地云函数

  • 应用命令生成 vue 我的项目文件
  • 间接将代码推送到云端就能够
  • 兴许你会好奇，咱们失常的 vue 我的项目部署都要先 npm run build, 而后将打包后的dist 目录传到服务器上的 nginx 动态目录下，这样能力拜访
  • 留神前端的我的项目部署都是存储到 oss 中的
  • 应用 serverless 默认生成的我的项目是 vue2 版本的，如果你要部署 vue3 的我的项目须要手动构建
# serverless.yml 文件
component: website
name: vue-starter
app: vue-demo-70a4c710

inputs:
  src:
    src: ./src
    # 配置了这个 hook 每次公布的时候会先 build
    hook: npm run build
    dist: ./dist
  bucketName: my-vue-starter
  protocol: https

手动构建一个 vue3 的我的项目

  • 参考文档
  • 应用脚手架创立一个 vue3 我的项目
  • 初始化一个 serverless.yml 文件
serverless init website-starter --name example

将这个 serverless.yml 文件复制到 vue3 我的项目中

简略的批改下

component: website
name: websiteDemo
app: vue3-demo-6cb9842a

inputs:
  src:
    src: ./src
    hook: npm run build
    dist: ./dist
  region: ap-guangzhou
  bucketName: my-website-starter
  protocol: https

部署上线 serverless deploy

手动部署 react 我的项目

手动创立一个 react 我的项目

npx create-react-app react-demo --template typescript

在 react 根目录下创立一个 serverless.yml 的文件

component: website
# 这里批改下
name: react-starter
# 这里批改下
app: reactDemo

inputs:
  src:
    src: ./src
    hook: npm run build
    # 这里要依据你打包后的目录
    dist: ./build
  # 这个定义下
  bucketName: my-react-starter
  protocol: https

推送到云端 serverless deploy

应用动态文件托管来部署前端我的项目

  • 先本地依据我的项目命令打包好
  • 在云产品中抉择动态文件托管

  • 间接将上传你打包后的代码

在 serverless 中连贯 mysql

数据库的筹备

应用 serverless 开发与咱们本人应用云服务器服务器 ECS 不一样的，因为咱们不能在 serverless 上装置软件 (咱们不能装置第三方的mysql、docker、redis) 等软件，因而咱们在应用 serverless 开发的时候，如果咱们我的项目中应用到了比方:mysql、redis、rabbitMQ、RocketMQ类的咱们就须要自行解决。上面介绍几种形式

  1. 本人有一台备用的云服务器 ECS，咱们在下面装置了须要的软件，对外提供了IP 或者域名，在平安组中凋谢了端口号以供咱们在 serverless 中应用。其实如果你本人有云服务器 ECS 可能就不会思考应用 serverless 来开发了

  2. 独自应用第三方付费或者按量免费的数据库，比方:

    • 阿里云的云数据库 RDS MySQL
    • 腾讯云的数据库云数据库
  3. 应用腾讯云官网自带的有收费额度的 NoSQL 数据库参考文档，本训练营会介绍如何应用，然而在我的项目中不会应用。
  4. 我在本人的服务器上应用 docker 搭建了一个 mysql8 版本的数据库，以供大家学习应用，本人依据本人的名字来在下面创立本人的数据库。大家自行保留地址，如果本人有服务器的，能够本人服务器上搭建，就不须要用我这个
# ip 地址
8.129.234.99
# 用户名
root
# 明码
123456

在 serverless 中连贯mysql

本案例只是测试官网案例连贯数据库，不波及什么知识点，依据本身条件抉择是否跳过

在函数服务中抉择 mysql 数据库模板来创立数据库云函数利用。留神抉择的语音和区域

在本人的数据库中创立数据库及数据表

-- 创立数据表 sql
CREATE TABLE `account` (`id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键 id',
  `username` varchar(50) NOT NULL COMMENT '用户名',
  `password` varchar(100) NOT NULL COMMENT '明码',
  `created_at` timestamp(6) NOT NULL DEFAULT CURRENT_TIMESTAMP(6) COMMENT '创立工夫',
  `updated_at` timestamp(6) NOT NULL DEFAULT CURRENT_TIMESTAMP(6) ON UPDATE CURRENT_TIMESTAMP(6) COMMENT '更新工夫',
  `deleted_at` timestamp(6) NULL DEFAULT NULL COMMENT '软删除工夫',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
-- 插入几条数据 sql
insert into account(username, password) values('admin', '123456');
insert into account(username, password) values('张三', '123456');

关上云函数的代码治理批改数据库的连贯配置

进入代码编辑界面的函数代码编辑代码

function wrapPromise(connection, sql) {return new Promise((res, rej) => {connection.query(sql, function(error, results, fields) {if (error) {rej(error)
      }
      res(results)
    })
  })
}
exports.main_handler = async (event, context, callback) => {const mysql = require('mysql');
  const connection = mysql.createConnection({
    host: '8.129.234.99', //  云数据库实例 ip 地址
    user: 'root', // 云数据库用户名，如 root
    password: '123456', // 云数据库明码
    database: 'serverless_nest' //  数据库名称
  });

  connection.connect();
  // 你须要查问的 sql 文件
  const querySql = `SELECT * from account`
  // 查问后果
  let queryResult = await wrapPromise(connection, querySql)
  
  connection.end();

  return queryResult
}

批改实现后点击部署和测试

呈现上面界面示意你曾经在云函数中连贯 mysql 胜利了

如果你想在浏览器上测试拜访，能够点击 触发治理

云开发与 serverless 的区别

  • Serverless Framework 是无服务器利用框架，提供将云函数SCF、API 网关、对象存储 COS、云数据库 DB 等资源组合的业务框架，开发者能够间接基于框架编写业务逻辑，而无需关注底层资源的配置和治理。
  • 云开发（Tencent CloudBase，TCB）是腾讯云提供的云原生一体化开发环境和工具平台，为开发者提供高可用、主动弹性扩缩的后端云服务，蕴含计算、存储、托管等 serverless 化能力，可用于云端一体化开发多种端利用（小程序、公众号、Web 利用、Flutter 客户端等），帮忙开发者对立构建和治理后端服务和云资源，防止了利用开发过程中繁琐的服务器搭建及运维，开发者能够专一于业务逻辑的实现，开发门槛更低，效率更高。
  • 二者最大的区别是：给开发者应用的平台反对不一样，云开发反对 web 端、QQ、微信小程序级动态网站托管等这些平台服务。

应用云开发创立一个 nest 我的项目

在产品中抉择云开发产品

创立一个我的项目, 留神点: 这里要抉择好区域，下次创立了我的项目，区域不一样，可能我的项目就看不到

应用模板创立

查看本人创立利用并且拜访

应用脚手架的形式创立

全局装置脚手架包官网地址

npm i -g @cloudbase/cli

测试装置是否胜利

cloudbase -v

登录

cloudbase login

本地创立我的项目

tcb new <appName> [template] 
# 比方
tcb new nest-cloundbase nest-starter

抉择本人曾经创立的环境, 如果没有就 创立新环境, 这时候会关上浏览器

本地关上我的项目并且装置依赖包

npm run dev

部署到线上

npm run deploy

在云开发中应用NoSQL

在面板上创立一个 NoSQL 的数据库，参考地址

在我的项目中装置连贯数据库的 SDK 参考文档

npm install @cloudbase/node-sdk

初始化数据库连贯参考地址

import cloudbase from '@cloudbase/node-sdk';
  
// 留神以下几个参数是必填的, 文档上说的是非必填
const app = cloudbase.init({
  secretId: 'xx',
  secretKey: 'yy',
  env: 'xx',
  // 依据你创立的区域来写, 目前只有上海(ap-shanghai)、广州(ap-guangzhou)
  region: 'ap-shanghai'
})

// 1. 获取数据库援用
const db = app.database();

对于获取 secretId、secretKey、env 的地址

  • env的获取地址

  • secretId 和 secretKey 获取

  • 点击 test 用户进入

依据文档，咱们将插入一条数据 ( 同样先漠视类型检测)

async createAccount(data: any): Promise<any> {const res = await db.collection('account')
    .add({...data,});
  return res;
}

环境变量的配置

本地开发环境变量的配置

  • 装置依赖包
npm install dotenv
npm install @types/dotenv -D

在我的项目根目录下创立一个 .env 的文件用来存储一些敏感信息

PORT=7000

SECRET_ID = AKIDMfCxx2stVYNUx
SECRET_KEY = d3C7pxxxv1VqiMrBHS
ENV = serverlxxim00f1a872
REGION = ap-guangzhou

在利用中应用应用环境变量的值

const app = cloudbase.init({
  secretId: process.env.SECRET_ID,
  secretKey: process.env.SECRET_KEY,
  env: process.env.ENV,
  // 依据你创立的区域来写, 目前只有上海(ap-shanghai)、广州(ap-guangzhou)
  region: process.env.REGION
})

我是程序员小月，更多干货在公号「前端进阶之旅」分享

退出移动版