教程:使用事件网格自动调整上传图像的大小

Azure 事件网格是一项用于云的事件处理服务, 可使你创建由 Azure 服务或第三方资源引发的事件的订阅。

本教程是存储教程系列中的第二部分。 它扩展了以前的存储教程,以添加使用 Azure 事件网格和 Azure Functions 自动生成无服务器缩略图的功能。 事件网格可使 Azure Functions 响应 Azure Blob 存储事件,并生成上传图像的缩略图。 针对 Blob 存储创建事件会创建一个事件订阅。 当将 blob 添加到特定 Blob 存储容器时,将调用一个函数终结点。 从事件网格传递到函数绑定的数据用于访问 blob 并生成缩略图。

可以使用 Azure CLI 和 Azure 门户将调整大小功能添加到现有图像上传应用。

在本教程中,你将了解如何执行以下操作:

  • 创建 Azure 存储帐户
  • 使用 Azure Functions 部署无服务器代码
  • 在事件网格中创建 Blob 存储事件订阅

先决条件

备注

本文已经过更新,以便使用 Azure Az PowerShell 模块。 若要与 Azure 交互,建议使用的 PowerShell 模块是 Az PowerShell 模块。 若要开始使用 Az PowerShell 模块,请参阅安装 Azure PowerShell。 若要了解如何迁移到 Az PowerShell 模块,请参阅 将 Azure PowerShell 从 AzureRM 迁移到 Az

为完成此教程:

创建 Azure 存储帐户

Azure Functions 需要一个常规存储帐户。 除了在上一教程中创建的 Blob 存储帐户之外,请在资源组中再另外创建一个单独的常规存储帐户。 存储帐户名称必须为 3 到 24 个字符,并且只能包含数字和小写字母。

请设置变量,以保存你在上一教程中创建的资源组的名称、要创建的资源的位置,以及 Azure Functions 所需新存储帐户的名称。 然后,请为 Azure 函数创建存储帐户。

使用 New-AzStorageAccount 命令。

  1. 为资源组指定名称。

    $resourceGroupName="myResourceGroup"
    
  2. 指定存储帐户的位置。

    $location="chinanorth"    
    
  3. 指定该函数要使用的存储帐户的名称。

    $functionstorage="<name of the storage account to be used by the function>"    
    
  4. 创建存储帐户。

    New-AzStorageAccount -ResourceGroupName $resourceGroupName -AccountName $functionstorage -Location $location -SkuName Standard_LRS -Kind StorageV2        
    

创建函数应用

必须使用 Function App 托管函数的执行。 Function App 提供一个环境,以便在不使用服务器的情况下执行函数代码。

在以下命令中,请提供你自己的唯一的函数应用名称。 函数应用名称用作该函数应用的默认 DNS 域,因此,该名称需要在 Azure 的所有应用中保持唯一。

为将要创建的函数应用指定名称,然后创建 Azure 函数。

通过使用 New-AzFunctionApp 命令来创建函数应用。

  1. 指定该函数应用的名称。

    $functionapp="<name of the function app>"    
    
  2. 创建函数应用。

    New-AzFunctionApp -Location $location -Name $functionapp -ResourceGroupName $resourceGroupName -Runtime PowerShell -StorageAccountName $functionstorage    
    

现在配置函数应用,以连接到你在上一教程中创建的 Blob 存储帐户。

配置函数应用

该函数需要 Blob 存储帐户的凭据,你可以使用 az functionapp config appsettings setUpdate-AzFunctionAppSetting 命令将这些凭据添加到函数应用的应用程序设置。

storageConnectionString=$(az storage account show-connection-string --resource-group $resourceGroupName --name $blobStorageAccount --query connectionString --output tsv)

az functionapp config appsettings set --name $functionapp --resource-group $resourceGroupName --settings AzureWebJobsStorage=$storageConnectionString THUMBNAIL_CONTAINER_NAME=thumbnails THUMBNAIL_WIDTH=100 FUNCTIONS_EXTENSION_VERSION=~2
$storageConnectionString=$(az storage account show-connection-string --resource-group $resourceGroupName --name $blobStorageAccount --query connectionString --output tsv)

Update-AzFunctionAppSetting -Name $functionapp -ResourceGroupName $resourceGroupName -AppSetting AzureWebJobsStorage=$storageConnectionString THUMBNAIL_CONTAINER_NAME=thumbnails THUMBNAIL_WIDTH=100 FUNCTIONS_EXTENSION_VERSION=~2

FUNCTIONS_EXTENSION_VERSION=~2 设置使函数应用在 Azure Functions 运行时的 2.x 版上运行。

现在可以将函数代码项目部署到此函数应用。

部署函数代码

GitHub 上提供示例 C# 重设大小函数。 使用 az functionapp deployment source config 命令将此代码项目部署到函数应用。

az functionapp deployment source config --name $functionapp --resource-group $resourceGroupName --branch master --manual-integration --repo-url https://github.com/Azure-Samples/function-image-upload-resize

图像大小调整函数由事件网关服务发送的 HTTP 请求触发。 可以通过创建事件订阅来告知事件网格:你需要在函数的 URL 处获取这些通知。 在本教程中,你订阅到 Blob 创建的事件。

从事件网格通知传递到函数的数据包括 Blob 的 URL。 该 URL 反过来传递到输入绑定,以便从 Blob 存储获取上传的图像。 该函数生成缩略图,并将生成的流写入 Blob 存储中的单独容器。

此项目使用 EventGridTrigger 作为触发器类型。 建议使用事件网格触发器而不是泛型 HTTP 触发器。 事件网格会自动验证事件网格函数触发器。 使用泛型 HTTP 触发器时,必须实现验证响应

若要详细了解此函数,请参阅 function.json 和 run.csx 文件

函数项目代码直接从公共示例存储库部署。

创建事件订阅

事件订阅指示要发送到特定终结点的提供程序生成的事件。 在这种情况下,终结点由函数公开。 使用以下步骤创建一个事件订阅,以便向 Azure 门户中的函数发送通知:

  1. Azure 门户中,在页面顶部搜索并选择 Function App,然后选择刚才创建的函数应用。 选择“函数”,然后选择“Thumbnail”函数。

    在门户中选择 Thumbnail 函数

  2. 选择“集成”,然后依次选择“事件网格触发器”和“创建事件网格订阅”。

    在 Azure 门户中导航到“添加事件网格订阅”

  3. 使用表中指定的事件订阅设置。

    基于 Azure 门户中的函数创建事件订阅

    设置 建议的值 说明
    名称 imageresizersub 标识新事件订阅的名称。
    主题类型 存储帐户 选择存储帐户事件提供程序。
    订阅 Azure 订阅 默认情况下,选择当前的 Azure 订阅。
    资源组 myResourceGroup 选择“使用现有”,然后选择此教程中使用的资源组。
    资源 你的 Blob 存储帐户 使用你创建 Blob 存储帐户。
    系统主题名称 imagestoragesystopic 指定系统主题的名称。 要了解系统主题,请参阅系统主题概述
    事件类型 已创建 blob 除“已创建 Blob”以外,取消选中所有其他类型。 只有 Microsoft.Storage.BlobCreated 的事件类型传递给函数。
    终结点类型 自动生成 预定义为 Azure Function
    终结点 自动生成 函数的名称。 在本例中,它是 Thumbnail
  4. 切换到“筛选器”选项卡,然后执行以下操作:

    1. 选择“启用主题筛选”选项。

    2. 对于“主题开头为”,输入以下值:/blobServices/default/containers/images/。

      指定事件订阅筛选器

  5. 选择“创建”以添加事件订阅。 这将创建一个事件订阅,当将一个 blob 添加到 images 容器时,该事件订阅将触发 Thumbnail 函数。 此函数重设图像大小,然后将图像添加到 thumbnails 容器。

至此,已配置后端服务,可在示例 Web 应用中测试调整图像大小功能。

测试示例应用

要在 Web 应用中测试调整图像大小功能,请浏览到已发布应用的 URL。 Web 应用的默认 URL 为 https://<web_app>.chinacloudsites.cn

单击“上传照片”区域,选择并上传文件。 或者,也可以将照片拖动到此区域。

请注意,上传的图像消失后,上传图像的副本将显示在“生成的缩略图”轮播中。 此图像在通过函数重设大小后会被添加到 thumbnails 容器中,再由 Web 客户端下载。

屏幕截图显示了 .NET v12 SDK 在浏览器中发布的标题为“ImageResizer”的 Web 应用。

后续步骤

在本教程中,你了解了如何执行以下操作:

  • 创建常规 Azure 存储帐户
  • 使用 Azure Functions 部署无服务器代码
  • 在事件网格中创建 Blob 存储事件订阅

请继续学习存储教程系列的第三部分,了解如何安全访问存储帐户。