看文章之前,希望各位读者能先点个赞和关注,创作不易。如果实验过程中有什么问题也可私信,看到了一定回

Serverless应用构建

以下实验内容皆参考Build On实验手册

零售创新应用是如何运作的?

零售创新应用流程如下:
1、头顶显示器显示一个 QR 码,每 5 分钟更改一次。客户扫描此 QR 码以使用他们的移动设备下订单。二维码适用于 5 分钟内的 10 杯饮品,一旦没有更多饮品,二维码就会从屏幕上消失。这有助于防止商家被订单淹没!

2、客户在二维码加载的网络应用程序上下订单。后端验证订单,创建订单号,并将其提供给商家。

3、商家看到订单出现在他们自己的应用程序上。他们可以更改订单的状态,以指示订单的制作时间、完成时间或是否需要取消订单。

4、客户在其移动设备上看到所有商家更新。头顶上的监视器还显示即将到来和已完成的饮料的状态。

二、项目应用结构

接下来您将创建将现有前端与后端无服务器应用程序集成的各种微服务。您将使用 亚马逊云科技 Step Functions 处理编排,使用 Amazon EventBridge 处理编排。

前端

前端已经部署。构建后端后,您将向前端提供环境变量以使它们能够连接。三个前端是:

  • 显示应用程序:这显示在头顶监视器上。它提供条形码供客户扫描下订单,并显示即将到来和已完成的饮料订单的实时队列。
  • 商家应用程序:这在商家使用的平板电脑上运行。该应用程序允许商家更改饮料订单的状态,或在需要时取消订单。此应用程序的更新会传播到其他应用程序。
  • 订购应用程序:客户使用此应用程序下订单。它旨在在移动设备上运行。当您今天进行测试时,您将使用带有此应用程序的移动设备下订单。

后端

后端应用程序架构使用Amazon Step FunctionsAmazon EventBridgeAmazon LambdaAmazon API GatewayAmazon S3Amazon DynamoDBAmazon Cognito

JavaScript 在前端浏览器应用程序中执行,向使用 API Gateway 构建的后端 API 发送和接收数据。DynamoDB 提供 API 使用的持久性数据存储层。使用 Amazon IoT CoreLambda 将事件路由回前端应用程序。

有关完整架构,请参见下图。
在这里插入图片描述

实验开始
建议以下所用服务直接在AWS服务搜索框搜索
例如,step functions

1.部署模板创建堆栈

  1. 启动 AWS CloudFormation 模板
  2. 美国东部(弗吉尼亚北部) us-east-1 构建环境

可以点击上述超链接直接进行快速创建 也可以使用进入CouldFormation进行堆栈创建

快速创建模板和进入CloudFormation创建模板二选一即可

1.1快速创建模板(二选一)

快速创建只需要修改name为

serverless-workshop

并勾选如下功能,最后创建堆栈

请添加图片描述

1.2进入CloudFormation创建堆栈(二选一)

以下是创建堆栈使用的模板

模板 URL
https://ee-assets-prod-us-east-1.s3.amazonaws.com/modules/67b03f2bcecc4fafb15053897585b61f/v1/cloudformationvLatest.yml
堆栈描述
Serverlesspresso core stack.

堆栈名称

serverless-workshop

在这里插入图片描述

堆栈的参数是模板设置好的,无需改动

接下来点击下一步跳过配置堆栈选项到审核serverless-workshop

在这里插入图片描述

到最下方勾选功能最后直接提交

如下图创建完成

在这里插入图片描述

2.构建工作流程 第1部分

2.1创建step functions下的状态机
2.1.1进入step functions

首先确保地区正确

再点击左边红框标记处

在这里插入图片描述

出现如下选项 点击状态机

在这里插入图片描述

2.1.2点击创建状态机

左边可以看见处于创建工作流的哪个步骤

在这里插入图片描述

2.1.3选择创作方法
  • 对于选择创作模式,选择直观的设计工作流
  • 类型选择标准。
  • 然后选择下一步
2.1.4设计工作流

左边搜索pass 拖动到中间工作区的Start的下一个状态

结果如下

在这里插入图片描述

2.1.5检查生成的代码

检查生成的代码不做任何配置,继续点击下一步

在这里插入图片描述

2.1.6指定状态机设置

名称

对于状态机名称,输入OrderProcessorWorkflow(中文翻译为订单处理流程)

权限

选择现有角色包含

01OrderProcessorRole的角色

在这里插入图片描述

其他参数注释

对于Logging,在下拉菜单中保持OFF。如果您启用此功能,Step Functions 会将执行历史记录记录到 CloudWatch Logs
对于Tracing,请保持禁用状态。当您启用此选项时,Step Functions 会向 AWS X-Ray 发送跟踪信息,以帮助在您的工作负载中提供可观察性
2.1.7最后创建状态机

至此,创建状态机成功

如何测试状态机工作流是否正常这里我们放在所有的咖啡店流程设置完成后再进行统一测试

状态机工作流总揽

接下来正式配置工作流,打开之前建立的状态机,将起工作流设计成如下图所示。

工作流名称汇总

1 DynamoDB Get Shop status
2 Shop Open?
3 Emit-Shop not ready
4 ListExecutions
5 Is capacity available
6 Emit - Workflow Started TT
7 Generate Order Number
8 Emit-Awaiting Completion TT
9 Pass
10 Barista timedout
11 Customer timedout
12 Emit-order finished
13 Emit - error timeout

在这里插入图片描述

其中序号6和8的Catch #1分支 为正在处理错误选项卡,添加新的捕获器中

会出现一个新Catch #1的分支

例如

序号1参数

配置

  • 状态名称:DynamoDB Get Shop status

  • API参数

    {
      "TableName": "serverlesspresso-config-table",
      "Key": {
        "PK": {
          "S": "config"
        }
      }
    }
    
  • 下一个状态,Shop Open?

输出

$.GetStore

在这里插入图片描述

序号2参数

选中Shop Open

点击增添一条新规则

对于rule1

在这里插入图片描述

在这里插入图片描述

  • 对于Not,在下拉列表中选择NOT。
  • 对于变量,输入 $.GetStore.Item.storeOpen.BOOL。此 JSONPath 语法指定来自 DynamoDB 查询响应的 storeOpen 布尔属性。
  • 对于 Operator选择is equal to
  • 对于Value,选择布尔常量,然后选择true作为值。
  • 选择保存条件

在这里插入图片描述

序号3参数

确保下一个状态为到末尾

在这里插入图片描述

确保等待回调不勾选

在这里插入图片描述

  • 对于API 参数,粘贴以下 JSON
{
  "Entries": [
    {
      "Detail": {
        "Message": "The Step functions workflow checks if the shop is open and has capacity to serve a new order by invoking a Lambda function that queries the Shop config service. The shop was not ready, and so a 'not ready' event is emitted to cancel the current order.",
        "userId.$": "$.detail.userId"
      },
      "DetailType": "OrderProcessor.ShopUnavailable",
      "EventBusName": "Serverlesspresso",
      "Source": "awsserverlessda.serverlesspresso"
    }
  ]
}
序号4参数

先将之前的工作流编辑保存退出

复制好

在这里插入图片描述

复制好后重新进入

序号4进入配置选项

对于 API Parameters,粘贴以下 JSON,替换YOUR_STATE_MACHINE_ARN 为您之前复制的 ARN。

{
  "StateMachineArn": "YOUR_STATE_MACHINE_ARN",
  "MaxResults": 100,
  "StatusFilter": "RUNNING"
}

对于输出

$.isCapacityAvailable

在这里插入图片描述

对于下一个状态

在这里插入图片描述

序号5参数

同上添加新规则并设置rule1

其中一个参数$.isCapacityAvailable.Executions[20]

其他如图

在这里插入图片描述

在这里插入图片描述

确保then next state is一样

序号6参数

API参数

{
  "Entries": [
    {
      "Detail": {
        "Message": "The workflow waits for your order to be submitted. It emits an event with a unique 'task token'. The token is stored in an Amazon DynamoDB table, along with your order ID.",
        "TaskToken.$": "$$.Task.Token",
        "orderId.$": "$.detail.orderId",
        "userId.$": "$.detail.userId"
      },
      "DetailType": "OrderProcessor.WorkflowStarted",
      "EventBusName": "Serverlesspresso",
      "Source": "awsserverlessda.serverlesspresso"
    }
  ]
}

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

修改捕获器

  • 对于备注,输入 Customer timed out
  • 对于错误,选择 States.Timeout
  • 对于回退状态,选择Customer timedout
  • 选择关闭

在这里插入图片描述

如图 修改心跳为300

在这里插入图片描述

序号7参数

API参数

{
  "TableName": "serverlesspresso-counting-table",
  "Key": {
    "PK": {
      "S": "orderID"
    }
  },
  "UpdateExpression": "set IDvalue = IDvalue + :val",
  "ExpressionAttributeValues": {
    ":val": {
      "N": "1"
    }
  },
  "ReturnValues": "UPDATED_NEW"
}

下图配置参数如下

  • 使用 ResultSelector 选中转换结果框。
  • 在值文本框中,输入:
{
  "orderNumber.$": "$.Attributes.IDvalue.N"
}
  • 选中使用 ResultPath 将原始输入添加到输出框。
  • 确保下拉菜单设置为将原始输入与结果组合。
  • 在值文本框中,输入 $.Order.Payload

在这里插入图片描述

序号8参数

API参数

{
  "Entries": [
    {
      "Detail": {
        "Message": "You pressed 'submit order'. The workflow resumes using the stored 'task token', it generates your order number. It then pauses again, emitting an event with a new 'task token'.",
        "TaskToken.$": "$$.Task.Token",
        "orderId.$": "$.detail.orderId",
        "orderNumber.$": "$.Order.Payload.orderNumber",
        "userId.$": "$.detail.userId"
      },
      "DetailType": "OrderProcessor.WaitingCompletion",
      "EventBusName": "Serverlesspresso",
      "Source": "awsserverlessda.serverlesspresso"
    }
  ]
}

等待回调以及下一个状态

在这里插入图片描述

输出参数$.order

在这里插入图片描述

  • 对于备注,输入 Barista timed out
  • 对于错误,选择 States.Timeout
  • 对于回退状态,选择添加新状态
  • 对于 ResultPath,输入 $.comment
  • 选择关闭
  • 最后再下方 心跳900

在这里插入图片描述

序号9参数

在这里插入图片描述

序号10参数

在这里插入图片描述

  • $.cause
  • Output 选项卡中,对于 Result,输入 "Barista timedout"

在这里插入图片描述

序号11参数

在这里插入图片描述

输出参数

  • 输出 选项卡中,对于 Result,输入"Customer timedout"(包括引号)。
  • 选择使用 ResultPath 将原始输入添加到输出
  • 在输入字段中输入 $.ca00use

在这里插入图片描述

序号12参数
  • 确保未选中等待回调。
  • 对于 API 参数,粘贴以下 JSON
{
  "Entries": [
    {
      "Detail": {
        "Message": "The order has reached the end of the workflow, and so a final event is emitted to alert other services to this.",
        "userId.$": "$.detail.userId",
        "orderId.$": "$.detail.orderId"
      },
      "DetailType": "OrderProcessor.orderFinished",
      "EventBusName": "Serverlesspresso",
      "Source": "awsserverlessda.serverlesspresso"
    }
  ]
}

在这里插入图片描述

序号13参数
  • 确保未选中等待回调。
  • 对于 API 参数,粘贴以下 JSON
{
  "Entries": [
    {
      "Detail": {
        "Message": "The order timed out. Step Functions waits a set amount of time (5 minutes for a customer, 15 minutes for a barista), no action was taken and so the order is ended.",
        "userId.$": "$.detail.userId",
        "orderId.$": "$.detail.orderId",
        "cause.$": "$.cause"
      },
      "DetailType": "OrderProcessor.OrderTimeOut",
      "EventBusName": "Serverlesspresso",
      "Source": "awsserverlessda.serverlesspresso"
    }
  ]
}

在这里插入图片描述

使用 EventBridge 路由事件

创建“全部记录”规则

转到 EventBridge 控制台

选择规则。选择创建规则

  • 对于名称,输入 logAll

  • 对于事件总线,输入 Serverlesspresso

  • 选择下一步。

  • 对于事件源,选择其他

  • 忽略示例事件面板。

  • 在事件模式面板中,粘贴以下内容:

  • 选择下一步

    {
      "source": ["awsserverlessda.serverlesspresso"]
    }
    
  • Target 1 面板中,选择AWS 服务。

  • 在选择目标下拉列表中,选择CloudWatch 日志组

  • 在日志组字段中,输入 serverlesspressoEventBus。

  • 在向导的第 4 步中,选择 Next

  • 在向导的第 5 步中,检查事件总线所在的定义规则详细信息面板。选择创建规则。

创建“新订单”规则

回到EventBridge

选择规则。选择创建规则。

在向导的第 1 步中:

  • 对于名称,输入 NewOrder
  • 对于事件总线,输入 Serverlesspresso
  • 选择下一步

在向导的第 2 步中:

  • 对于事件源,选择其他
  • 忽略示例事件面板。
  • 在事件模式面板中,粘贴以下内容:
  • 选择下一步
{
  "detail-type": ["Validator.NewOrder"],
  "source": ["awsserverlessda.serverlesspresso"]
}

在向导的第 3 步中

  • Target 1 面板中,选择 AWS 服务。
  • 在选择目标下拉列表中,选择 Step Functions 状态机
  • 在状态机下拉列表中,选择 OrderProcessorWorkflow。提示:您可以开始 OrderProcessor 在搜索框中输入内容以查找工作流程。
  • 对于 Execution role,确保选中 Create a new role for the specific resource
  • 选择下一步

在向导的第 4 步中,选择Next

在向导的第 5 步中,检查事件总线所在的定义规则详细信息面板。选择创建规则。

创建工作流程开始规则

1、转到 EventBridge 控制台

2、选择规则。选择创建规则。

3、在向导的第 1 步中:

  • 对于名称,输入WorkflowStarted
  • 对于事件总线,输入Serverlesspresso
  • 选择下一步。

4、在向导的第 2 步中:

  • 对于事件源,选择其他

  • 忽略示例事件面板。

  • 在事件模式面板中,粘贴以下内容:

  • 选择下一步

    {
      "detail-type": ["OrderProcessor.WorkflowStarted"],
      "source": ["awsserverlessda.serverlesspresso"]
    }
    

5、在向导的第 3 步中:

  • Target 1面板中,选择 AWS 服务。
  • 在选择目标下拉列表中,选择 Lambda
  • 在函数 WorkflowStarted 下拉列表中, 从函数下拉列表中选择包含名称的 Lambda 函数。这是由设置模块中的核心堆栈部署的。提示:您可以开始在字段中输入“WorkflowStarted”来查找功能。
  • 选择下一步

6、在向导的第 4 步中,选择Next

7、在向导的第 5 步中,检查事件总线所在的定义规则详细信息面板。选择创建规则。Serverlesspresso

创建“等待完成”规则

1、转到 EventBridge 控制台。

2、选择规则。选择创建规则

3、在向导的第 1 步中:

  • 对于名称,输入 WaitingCompletion
  • 对于事件总线,输入 Serverlesspresso
  • 选择下一步

4、在向导的第 2 步中:

  • 对于事件源,选择其他
  • 忽略示例事件面板。
  • 在事件模式面板中,粘贴以下内容:
  • 选择下一步
{
  "detail-type": ["OrderProcessor.WaitingCompletion"],
  "source": ["awsserverlessda.serverlesspresso"]
}

5、在向导的第 3 步中:

  • Target 1面板中,选择 AWS 服务。
  • 在选择目标下拉列表中,选择 Lambda
  • Function下拉列表中,选择包含 nameServerlesspresso 函数 WaitingCompletion。提示:您可以开始在字段中输入“WaitingCompletion”来查找函数。
  • 选择下一步

6、在向导的第 4 步中,选择Next

7、在向导的第 5 步中,检查事件总线所在的定义规则详细信息面板。选择创建规则

配置前端

1、在 AWS 管理控制台的搜索栏中输入 CloudShell,然后从搜索选项中选择 CloudShell

2、选择Close,以超越欢迎警报:

3、在 CloudShell 终端中,输入以下命令以检索该 poolId 值:

aws cognito-identity list-identity-pools --max-results 10

4、运行此命令以检索host值:

aws iot describe-endpoint --endpoint-type iot:Data-ATS
显示应用Display App

Display App 在咖啡吧上方的显示器上运行。它提供了即将到来的和已完成的饮料列表。它还显示客户扫描以开始订单的二维码。这是您将设置的三个前端中的第一个。

此前端已部署并在

https://workshop-display.serverlesscoffee.com/
上以托管 UI 的形式呈现。

  • 当您首次访问此 URL 时,托管 UI 会显示一个配置页面。
  • 输入配置设置后,它将这些存储在浏览器的本地缓存中。
  • 访问同一 URL 的任何其他人都看不到您使用的设置。

大多数前端配置已经为您输入,您必须通过从 Cloud Formation 模板输出中选择显示应用程序 URL 来加载这些配置:

1、在 AWS 管理控制台中,搜索“Cloud Formation”,然后从结果列表中选择“Cloud Formation”。

2、从堆栈列表中,选择应该命名为mod-67b03f2bcecc4faf的核心堆栈。

3、选择输出选项卡。

4、找到名为 DisplayAppURI 的输出并选择预先创建的 URL,在新选项卡中打开此链接。

5、这将打开显示应用程序 UI,其中预填充了除 2 个之外的所有配置。

  • PoolId:输入之前CloudShell中查找设置poolId中的值…
  • 主机:输入之前CloudShell中查找设置host中的值。

6、选择保存并重新加载

设置用户帐户

Serverlesspresso 应用程序支持用户和管理员帐户。管理员帐户可以登录 DisplayBarista 应用程序,而用户只能登录 Customer 应用程序。在本节中,您将创建一个管理员用户来登录所有应用程序。

1、选择创建帐户选项卡。输入您在研讨会期间可以访问的有效电子邮件以及密码。选择创建帐户

2、输入电子邮件中的验证码,然后选择Confirm

3、在单独的浏览器选项卡中,导航到 Cognito 控制台。选择ServerlesspressoUserPool

4、选择 Groups 选项卡,然后选择 Create group

5、在 Create group 页面中,输入 adminGroup name 并选择 Create group

6、选择用户选项卡,然后选择您创建的用户。

7、在 Group members中,选择 Add user to group。选择管理员并选择添加

8、返回显示显示应用程序的浏览器选项卡。使用您创建的用户登录,现在显示显示应用程序。
应用程序如下图
在这里插入图片描述

请注意右上角提供的 4 个管理按钮:

  • 配置咖啡师应用程序:在本节后面使用它来将设置传输到咖啡师应用程序。
  • 配置订单应用程序:在本节后面使用它来将设置传输到订单应用程序。
  • 清除设置:清空本地设置缓存并清除后端设置。这会导致在下次重新加载页面时显示“设置”页面。如果您想更改后端设置,请使用此选项。
  • 退出:从前端退出 Cognito 用户并返回登录页面。

显示的二维码将每五分钟更改一次,并将订单总数限制为屏幕上显示的值(默认为 10)。稍后,在端到端测试中,您将扫描此二维码以开始订购流程。

在浏览器选项卡中保持显示应用程序打开。

咖啡师应用程序Barista 应用程序

咖啡师应用程序在咖啡吧旁边的平板电脑上运行,由咖啡师操作。它提供了即将到来的订单列表,并使咖啡师能够将收到的订单标记为已完成或已取消。

此前端已部署并在
https://workshop-barista.serverlesscoffee.com/
上以托管 UI 的形式呈现。

  • 当您首次访问此 URL 时,托管 UI 会显示一个配置页面。
  • 输入配置设置后,它将这些存储在浏览器的本地缓存中。
  • 访问同一 URL 的任何其他人都看不到您使用的设置。

1、您可以从 Display App 传输配置,以避免手动输入设置。如果您已配置 Display App,请在浏览器中切换到该选项卡,或导航至https://workshop-display.serverlesscoffee.com/。选择工具栏中的配置 Barista 应用程序按钮。

2、这将在新窗口中打开 Barista 应用程序配置页面,并将后端设置嵌入到 URL 查询字符串中。

3、选择保存并重新加载

4、选择登录选项卡。输入您在上一节中配置的帐户的电子邮件和密码。选择登录

5、显示咖啡师应用程序

在这里插入图片描述

请注意工具栏上提供的三个管理按钮:

  • 打开商店:这会在打开和关闭之间切换商店打开状态。当商店关闭时,订单应用程序无法下任何新订单。
  • 清除设置:清空本地设置缓存并清除后端设置。这会导致在下次重新加载页面时显示“设置”页面。如果您想更改后端设置,请使用此选项。
  • 退出:从前端退出 Cognito 用户并返回登录页面。

保持 Barista App 在浏览器选项卡中打开。

设置订单应用程序。

客户应用程序在客户的智能手机上运行。当他们第一次使用智能手机扫描二维码时,URL 会将浏览器重定向到此 Web 应用程序。

本节内

此前端已部署并在
https://workshop-order.serverlesscoffee.com/
上以托管 UI 的形式呈现。

  • 当您首次访问此 URL 时,托管 UI 会显示一个配置页面。
  • 输入配置设置后,它将这些存储在浏览器的本地缓存中。
  • 访问同一 URL 的任何其他人都看不到您使用的设置。
设置客户应用程序

7.6.2 步骤说明

1、您可以从 Display App 传输配置,以避免在智能手机上手动输入设置。如果您已配置 Display App,请在浏览器中切换到该选项卡,或导航至https://workshop-display.serverlesscoffee.com/。选择工具栏中的配置订单应用程序按钮。

2、这将打开一个包含 QR 码的弹出窗口,它将后端设置嵌入到查询字符串中。

在这里插入图片描述

3、在您的智能手机上,使用条形码扫描仪应用程序扫描此 QR 码。这将打开配置设置页面并使用后端设置填充字段。

在这里插入图片描述

4、选择保存并重新加载。暂时关闭此选项卡。

最后测试

1、确保 Display AppBarista App 在两个单独的浏览器选项卡中打开。

2、打开智能手机上的条形码扫描仪。某些手机型号可能需要使用免费的 QR 扫描仪应用程序,而不是默认的条形码扫描仪。扫描显示应用程序上的二维码。如果由于屏幕处于超时期间而当前未显示条码,请等到计时器结束并且条码重新出现。

3、使用您在上一节中创建的帐户登录应用程序。

4、令牌验证后,选择要订购的饮品,然后选择 Order Now

在这里插入图片描述

5、验证 DisplayBarista 应用程序以查看新订单到达。

最后验证一共有三个前端界面,
一是显示应用Display App,用于显示商店下单二维码
二是咖啡师应用程序Barista 应用程序 用于接单 制作饮料流程确认等等
三是客户端,手机扫描Display App下单二维码后进入下单APP界面进行下单

serverless更多是一种思想和架构,使用无服务器架构,直接运行提供对应服务函数,而不是整个服务器,使用Gateway API 进行服务调度,实现事件由lambda服务实现
如下 一个简单的架构图(自己画的如有错误请指正)
在这里插入图片描述
最后以上的相关服务看状态机工作流总览理解或者自行上AWS官网了解

Logo

亚马逊云科技开发者 Build On 是由亚马逊团队策划、开发者社区联合打造的动手实操系列活动。

更多推荐