在网页浏览器中构建 AI 代理并自动化 UI 工作流 - Amazon Nova Act 与 Kiro

发布: (2025年12月30日 GMT+8 14:42)
8 min read
原文: Dev.to

Source: Dev.to

请提供您希望翻译的完整文本内容,我将为您翻译成简体中文并保持原有的格式、Markdown 语法以及技术术语不变。谢谢!

课程目标

在本课程中,您将学习如何:

  1. 从 UI 自动化工作流构建 AI 代理。
  2. 为 Amazon Nova Act 确定使用案例。

Amazon Nova 家族

AWS 在 Amazon Nova 下推出了一系列 AI 产品,包括:

a) Amazon Nova 2 基础模型

模型描述数据类型
Nova 2 Lite成本效益高的基础模型,适用于构建聊天机器人等推理任务。文本、视频、图像
Nova 2 Pro (预览)用于 AI 任务(如代理式编码)的智能推理模型。文本、视频、图像、语音
Nova 2 Omni (预览)多模态基础模型,能够 … (描述待补充)
Nova 2 Sonic用于对话式 AI 的语音到语音模型。文本、语音
Nova Multimodal Embeddings用于代理式 RAG 和语义搜索的多模态嵌入模型。文本、图像、音频、视频

b) 前沿模型

  • Amazon Nova Forge – 允许您将组织的数据与 Amazon Nova 的精选训练数据相结合。

c) 大规模自动化网页浏览工作流

Amazon Nova Act

Amazon Nova Act 是基于 Nova 2 Lite 架构构建的 AWS 服务,用于创建能够自动化网页浏览器 UI 工作流的 AI 代理。它使您能够:

  • 构建并管理大规模 UI 自动化的 AI 代理,以处理重复性任务。
  • 通过自然语言提示和 Python 代码快速部署代理。

关键特性

  • 从网页中提取信息
  • 确认预订及其他交易。
  • 自动填写表单
  • 执行网页搜索并浏览结果。

好处

  • 完成重复性任务、启动 API 并处理升级。
  • 将原型在数小时内推向生产。
  • 在规模上部署和管理代理舰队。

典型使用场景

使用场景描述
数据录入在无需手动复制粘贴的情况下填充详细信息。
网页 QA 测试直接在浏览器中验证用户旅程工作流(无需单独的测试脚本)。
结账流程自动化购买、退款、验证和 UI 更改。
数据提取浏览站点并从难以导出的非结构化来源中提取数据。

开始使用 Amazon Nova Act

前置条件

  1. Kiro – 具备代理功能的 IDE。
  2. AWS Builders ID(或 IAM 凭证)。

步骤指南

步骤操作
1从桌面启动 Kiro 并使用你的 AWS Builders ID 登录。出现提示时允许 Kiro 访问你的数据。
2在 Kiro 中,前往 Extensions → Search,搜索 Amazon Nova Act 并安装。选择 Trust publisher 并确认安装。
3打开 Amazon Nova Act Playground ( ) 以实验用户旅程并生成 API 密钥。(注意:该 Playground 在某些地区可能不可用,例如悉尼 (ap‑southeast‑2))。
4在 Kiro 终端中安装 Nova Act Python SDK:
bash\npip install --upgrade nova-act\n
5创建一个名为 UTS enrolment folder 的项目文件夹(例如放在 Documents 下)。
6在 Kiro IDE 中:File → Open Folder → UTS enrolment folder
7切换到 Vibe coding 模式,输入以下提示以生成原型:
“Create a prototype for a UTS psychology enrollment workflow that automates the web UI for data entry, form filling, and confirmation.”
8Kiro 将生成文件,包括 uts-psychology-enrollment-workflow.htmlREADME.md。请审阅并与团队共享。
9使用 Kiro 创建 Steering filesSPECS。分阶段的过程会生成:
Requirements
Design document
Acceptance criteria
Implementation plan
这些制品存放在隐藏的 .kiro 子文件夹中。
10打开 Visual Studio Code (VS Code) 并打开同一项目文件夹。
11在 VS Code 聊天窗口(Amazon Q)中粘贴部署提示,以生成部署脚本(见下文)。
12运行生成的脚本,将工作流部署到 AWS(需要已配置的 AWS CLI 凭证)。

部署脚本 (PowerShell)

# UTS Psychology Enrollment - AWS Deployment Script
param(
    [string]$BucketName = "uts-psychology-enrollment",
    [string]$Region     = "us-east-1"
)

Write-Host "=== UTS Psychology Enrollment - AWS S3 Deployment ===" -ForegroundColor Cyan
Write-Host ""

# Verify AWS CLI configuration
Write-Host "Checking AWS CLI configuration..." -ForegroundColor Yellow
aws sts get-caller-identity 2>$null
if ($LASTEXITCODE -ne 0) {
    Write-Host "ERROR: AWS CLI not configured. Run: aws configure" -ForegroundColor Red
    exit 1
}
Write-Host "✓ AWS CLI configured" -ForegroundColor Green

# Create (or confirm) the S3 bucket
Write-Host ""
Write-Host "Creating S3 bucket: $BucketName..." -ForegroundColor Yellow
aws s3 ls "s3://$BucketName" 2>$null
if ($LASTEXITCODE -eq 0) {
    Write-Host "✓ Bucket already exists" -ForegroundColor Green
} else {
    aws s3 mb "s3://$BucketName" --region $Region
    if ($LASTEXITCODE -eq 0) {
        Write-Host "✓ Bucket created successfully" -ForegroundColor Green
    } else {
        Write-Host "ERROR: Failed to create bucket" -ForegroundColor Red
        exit 1
    }
}

# Sync local project files to the bucket
Write-Host ""
Write-Host "Syncing project files to S3..." -ForegroundColor Yellow
aws s3 sync . "s3://$BucketName" --exclude ".git/*" --exclude ".kiro/*"
if ($LASTEXITCODE -eq 0) {
    Write-Host "✓ Sync completed" -ForegroundColor Green
} else {
    Write-Host "ERROR: Sync failed" -ForegroundColor Red
    exit 1
}

Write-Host ""
Write-Host "Deployment finished!" -ForegroundColor Cyan

后续步骤

  • 通过浏览器会话调用生成的 Nova Act 代理来测试已部署的工作流。
  • 通过 Amazon Nova Act 控制台 监控代理性能,并根据需要迭代提示或规范。

PowerShell 部署脚本

# Create the S3 bucket (if it doesn't already exist)
aws s3 mb "s3://$BucketName" --region $Region 2>&1 | Out-Null
if ($LASTEXITCODE -eq 0) {
    Write-Host "✓ Bucket created" -ForegroundColor Green
} else {
    Write-Host "ERROR: Failed to create bucket" -ForegroundColor Red
    exit 1
}

# Enable website hosting
Write-Host ""
Write-Host "Enabling static website hosting..." -ForegroundColor Yellow
aws s3 website "s3://$BucketName" --index-document uts-psychology-enrollment-workflow.html
Write-Host "✓ Website hosting enabled" -ForegroundColor Green

# Set up public access
Write-Host ""
Write-Host "Configuring public access..." -ForegroundColor Yellow

$policy = @"
{
    "Version": "2012-10-17",
    "Statement": [{
        "Sid": "PublicReadGetObject",
        "Effect": "Allow",
        "Principal": "*",
        "Action": "s3:GetObject",
        "Resource": "arn:aws:s3:::$BucketName/*"
    }]
}
"@

$policy | Out-File -FilePath "bucket-policy.json" -Encoding utf8

aws s3api put-public-access-block `
    --bucket $BucketName `
    --public-access-block-configuration "BlockPublicAcls=false,IgnorePublicAcls=false,BlockPublicPolicy=false,RestrictPublicBuckets=false" `
    2>&1 | Out-Null

aws s3api put-bucket-policy `
    --bucket $BucketName `
    --policy file://bucket-policy.json `
    2>&1 | Out-Null

Write-Host "✓ Public access configured" -ForegroundColor Green

# Upload the HTML file
Write-Host ""
Write-Host "Uploading HTML file..." -ForegroundColor Yellow
aws s3 cp uts-psychology-enrollment-workflow.html "s3://$BucketName/" --content-type "text/html"

if ($LASTEXITCODE -eq 0) {
    Write-Host "✓ File uploaded successfully" -ForegroundColor Green
} else {
    Write-Host "ERROR: Upload failed" -ForegroundColor Red
    exit 1
}

# Clean up temporary files
Remove-Item "bucket-policy.json" -ErrorAction SilentlyContinue

# Show results
Write-Host ""
Write-Host "=== Deployment Complete ===" -ForegroundColor Green
Write-Host ""
Write-Host "Website URL:" -ForegroundColor Cyan
Write-Host "  http://$BucketName.s3-website-$Region.amazonaws.com" -ForegroundColor White
Write-Host ""

注意: 已在此过程中创建了 deployment.md 文件。

附加资源

  • Amazon Nova Act CLI – 您也可以使用 Amazon Nova Act 命令行界面部署此工作流。
  • Amazon Nova Act CDK Templates – 可使用 Nova Act CDK 模板构建生产级部署。

文档与指南

  • Amazon Nova Act User Guide
  • Amazon Nova Act API Reference
  • Introducing Amazon Nova Act
  • Amazon Nova Act with SDK
  • Set Python Interpreter (for SDK usage)
  • Amazon Nova Act Extension

在下次更新之前,祝学习愉快! 😀

Back to Blog

相关文章

阅读更多 »

真实世界代理示例与 Gemini 3

2025年12月19日 我们正进入代理式 AI 的新阶段。开发者正超越简单的 notebook,构建复杂、可投入生产的 agentic 工作流……