使用 GenAI 实现 JIRA 用户故事

1. 概览

在本实验中，您将构建一个解决方案，使用 GenAI 自动实现 JIRA 使用故事。

5351e028356cd3ac.png

学习内容

本实验包含多个主要部分：

  • 部署 Cloud Run 应用以集成 Gemini API
  • 创建和部署适用于 JIRA 的 Atlassian Forge 应用
  • 用于 GitLab 任务自动化的 LangChain ReAct 代理

前提条件

  • 本实验假设您熟悉 Cloud 控制台和 Cloud Shell 环境。

2. 设置和要求

Cloud 项目设置

  1. 登录 Google Cloud 控制台，然后创建一个新项目或重复使用现有项目。如果您还没有 Gmail 或 Google Workspace 账号，则必须创建一个。

fbef9caa1602edd0.png

a99b7ace416376c4.png

5e3ff691252acf41.png

  • 项目名称是此项目参与者的显示名称。它是 Google API 尚未使用的字符串。您可以随时对其进行更新。
  • 项目 ID 在所有 Google Cloud 项目中是唯一的，并且是不可变的（一经设置便无法更改）。Cloud 控制台会自动生成一个唯一字符串；通常情况下，您无需关注该字符串。在大多数 Codelab 中，您都需要引用项目 ID（通常用 PROJECT_ID 标识）。如果您不喜欢生成的 ID，可以再随机生成一个 ID。或者，您也可以尝试自己的项目 ID，看看是否可用。完成此步骤后便无法更改该 ID，并且此 ID 在项目期间会一直保留。
  • 此外，还有第三个值，即部分 API 使用的项目编号，供您参考。如需详细了解所有这三个值，请参阅文档。
  1. 接下来，您需要在 Cloud 控制台中启用结算功能，以便使用 Cloud 资源/API。运行此 Codelab 应该不会产生太多的费用（如果有的话）。若要关闭资源以避免产生超出本教程范围的结算费用，您可以删除自己创建的资源或删除项目。Google Cloud 新用户符合参与 300 美元免费试用计划的条件。

环境设置

打开 Gemini Chat。

bc3c899ac8bcf488.png

或者，在搜索栏中输入“询问 Gemini”。

e1e9ad314691368a.png

启用 Cloud AI Companion API：

66cb6e561e384bbf.png

点击“Start chatting”，然后按照其中一个示例问题操作，或输入您自己的问题进行试用。

5482c153eef23126.png

建议尝试的提示：

  • 通过 5 个要点介绍 Cloud Run。
  • 您是 Google Cloud Run 产品经理，需要用 5 个关键要点向学生简要介绍 Cloud Run。
  • 您是 Google Cloud Run 产品经理，需要向一名经过认证的 Kubernetes 开发者简要说明 5 个 Cloud Run 要点。
  • 您是 Google Cloud Run 产品经理，请用 5 个关键要点向一名高级开发者说明何时使用 Cloud Run 而非 GKE。

如需详细了解如何撰写更优质的提示，请参阅提示指南。

Google Cloud 专用 Gemini 如何使用您的数据

Google 的隐私保护承诺

Google 是业界首家发布 AI/机器学习隐私权承诺的公司之一，该承诺概述了我们的信念：客户应拥有最高级别的安全性，并能够控制其在云中存储的数据。

您提交和接收的数据

您向 Gemini 提出的问题（包括您提交给 Gemini 以供分析或完成的任何输入信息或代码）称为“提示”。您从 Gemini 收到的答案或代码补全项称为“回答”。Gemini 不会将您发送的提示或得到的回答用作模型训练数据。

提示的加密

当您向 Gemini 提交问题时，系统会在传输过程中对您的数据进行加密，以便将其作为输入提供给 Gemini 中的底层模型。

通过 Gemini 生成的节目数据

Gemini 使用第一方 Google Cloud 代码以及部分第三方代码进行训练。您负责代码的安全性、测试和有效性，包括 Gemini 为您提供的任何代码补全、生成或分析。

详细了解 Google 如何处理你的提示。

3. 用于测试提示的选项

您可以通过多种方式测试提示。

Vertex AI Studio 是 Google Cloud 的 Vertex AI 平台的一部分，专为简化和加速生成式 AI 模型的开发和使用而设计。

Google AI Studio 是一款基于网络的工具，可用于对问题生成技术和 Gemini API 进行原型设计和实验。

Google Gemini Web 应用 (gemini.google.com) 是一款基于 Web 的工具，旨在帮助您探索和利用 Google 的 Gemini AI 模型的强大功能。

4. （可选部分）创建服务账号

这些步骤已在实验室设置期间执行，您无需运行这些步骤。

这些步骤旨在展示如何设置服务账号和 IAM 角色。

返回 Google Cloud 控制台，然后点击搜索栏右侧的图标激活 Cloud Shell。

3e0c761ca41f315e.png

在打开的终端中，运行以下命令以创建新的服务账号和密钥。

您将使用此服务账号从 Cloud Run 应用对 Vertex AI Gemini API 进行 API 调用。

使用您的 Qwiklabs 项目详细信息配置项目详细信息。

示例：qwiklabs-gcp-00-2c10937585bb

gcloud config set project YOUR_QWIKLABS_PROJECT_ID

创建服务账号并授予角色。

PROJECT_ID=$(gcloud config get-value project)
SERVICE_ACCOUNT_NAME='vertex-client'
DISPLAY_NAME='Vertex Client'
KEY_FILE_NAME='vertex-client-key'

gcloud iam service-accounts create $SERVICE_ACCOUNT_NAME --project $PROJECT_ID --display-name "$DISPLAY_NAME"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/aiplatform.admin"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/aiplatform.user"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/cloudbuild.builds.editor"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/artifactregistry.admin"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/storage.admin"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/run.admin"

gcloud projects add-iam-policy-binding $PROJECT_ID --member="serviceAccount:$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com" --role="roles/secretmanager.secretAccessor"


gcloud iam service-accounts keys create $KEY_FILE_NAME.json --iam-account=$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com

如果系统提示您授权，请点击“授权”以继续。

6356559df3eccdda.png

启用所需服务以使用 Vertex AI API 和 Gemini 聊天功能。

gcloud services enable \
    generativelanguage.googleapis.com \
    aiplatform.googleapis.com \
    cloudaicompanion.googleapis.com \
    run.googleapis.com \
    cloudresourcemanager.googleapis.com

启用所需服务以使用 Vertex AI API 和 Gemini 聊天功能。

gcloud services enable \
    artifactregistry.googleapis.com \
    cloudbuild.googleapis.com \
    runapps.googleapis.com \
    workstations.googleapis.com \
    servicemanagement.googleapis.com \
    secretmanager.googleapis.com \
    containerscanning.googleapis.com

(END OF OPTIONAL SECTION)

5. 授予对 Cloud Workstations 的访问权限

在 Cloud 控制台中打开 Cloud Workstations。

为已预配的 Qwiklabs 学生授予对 Cloud Workstation 的访问权限。

复制为此项目创建的 Qwiklabs 用户名/电子邮件地址，并使用它添加正文。选择工作站，然后点击“PERMISSIONS”。

详情请参见下文。

5cbb861e4f272f7.png

点击“ADD PRINCIPAL”按钮。

粘贴 Qwiklabs 学员的电子邮件地址，然后选择“Cloud Workstations User”角色。

dfe53b74453d80b1.png

依次点击“Start”和“Launch”以打开工作站，然后使用内置终端继续执行以下步骤。

62dccf5c78880ed9.png

克隆 GitHub 代码库

创建一个文件夹并克隆 GitHub 代码库。

mkdir github
cd github
git clone https://github.com/GoogleCloudPlatform/genai-for-developers.git

使用“File / Open Folder”菜单项打开“github/genai-for-developers”。

6. 启用 Gemini Code Assist

点击“Gemini”图标，然后点击右下角的“Login to Google Cloud”。

4a7f4640f66037f.png

8d31b61e23ebeea2.png

点击终端中的链接以开始授权流程。

d8575b4066f67745.png

点击“打开”以访问链接。

3a7272fcb985ff5.png

选择您的 Qwiklabs 学员账号，然后点击下一个屏幕上的“登录”。

79dc63009ce0ed49.png

复制验证码：

403845a5abc53635.png

返回终端并粘贴代码。

5931f639fe69f5cb.png

等待身份验证完成，然后点击“选择 Google 项目”。

614beb055f7aa5e8.png

在弹出式窗口中，选择您的 Qwiklabs 项目。

示例：

70ae6837db397e2a.png

打开文件“devai-api/app/routes.py”，然后右键点击文件中的任意位置，并从上下文菜单中选择“Gemini > Explain this"”。

32b902134440b7c3.png

查看 Gemini 对所选文件的说明。

f78bfee770f6be93.png

7. LangChain 工具包

LangChain 工具包是一组工具，旨在简化和增强使用 LangChain 开发应用的效率。它们提供的功能因具体工具包而异，但通常有助于：

  • 连接到外部数据源：访问 API、数据库和其他外部来源中的信息，并将其纳入 LangChain 应用。
  • 高级提示技巧：利用预构建的提示或创建自定义提示，以优化与语言模型的互动。
  • 创建和管理链：轻松构建复杂的链，并高效地进行管理。
  • 评估和监控：分析 LangChain 应用和链的性能。

一些热门的 LangChain 工具包包括：

  • 代理执行器工具包：用于开发可通过网络浏览或代码执行等操作与真实世界互动的代理的工具。
  • 提示工程工具包：一系列用于设计有效提示的资源。

GitLab Toolkit

在本实验中，您将使用 GitLab 工具包自动创建 GitLab 合并请求。

Gitlab 工具包包含一些工具，可让 LLM 代理与 gitlab 代码库进行交互。该工具是 python-gitlab 库的封装容器。

GitLab 工具包可以执行以下任务：

  • 创建文件 - 在代码库中创建新文件。
  • 读取文件 - 从代码库中读取文件。
  • 更新文件 - 更新代码库中的文件。
  • 创建拉取请求 - 从聊天机器人的工作分支创建一个拉取请求，将其发送到基础分支。
  • Get Issue - 从代码库中提取问题。
  • Get Issue - 提取有关特定问题的详细信息。
  • 对问题发表评论 - 针对特定问题发表评论。
  • 删除文件 - 从代码库中删除文件。

8. GitLab 代码库和工具包配置

打开 GitLab，创建一个新的公共项目，然后在“Settings / Access Tokens”下设置项目访问令牌。

请使用以下详细信息：

  • 令牌名称：devai-api-qwiklabs
  • 角色：Maintainer
  • 选择范围：api

112008c7894c3a19.png

将访问令牌值复制并粘贴到笔记本电脑上的临时文件中，以便在后续步骤中使用。

9. 准备在 Cloud Run 上部署应用

返回 Cloud Workstations 实例，然后使用现有终端或打开新终端。

9f9682d2b7317e66.png

通过基于 Web 的授权流程获取用户账号的访问凭据。

点击链接，然后按照相应步骤生成验证码。

gcloud auth login

使用您的 Qwiklabs 项目详细信息配置项目详细信息。

示例：qwiklabs-gcp-00-2c10937585bb

gcloud config set project YOUR-QWIKLABS-PROJECT-ID

设置其余的环境变量：

export PROJECT_ID=$(gcloud config get-value project)
export LOCATION=us-central1
export REPO_NAME=devai-api
export SERVICE_NAME=devai-api

设置 GitLab 集成所需的环境变量。

export GITLAB_PERSONAL_ACCESS_TOKEN=gitlab-token

为避免在终端中泄露敏感信息，最佳做法是使用 read -s，这是设置环境变量的安全方式，不会在控制台的命令历史记录中显示值。运行该脚本后，您必须粘贴值并按 Enter 键。

此命令要求您更新 GitLab 用户 ID 和代码库名称。

示例：export GITLAB_REPOSITORY="gitrey/qwiklabs-test"

119489def27115c8.png

export GITLAB_REPOSITORY="USERID/REPOSITORY"

设置其余的环境变量：

export GITLAB_URL="https://gitlab.com"
export GITLAB_BRANCH="devai"
export GITLAB_BASE_BRANCH="main"

10. LangSmith LLM 跟踪配置

创建 LangSmith 账号，然后在“设置”部分生成 Service API 密钥。https://docs.smith.langchain.com/

设置 LangSmith 集成所需的环境变量。

export LANGCHAIN_TRACING_V2=true
export LANGCHAIN_ENDPOINT="https://api.smith.langchain.com"

export LANGCHAIN_API_KEY=langchain-service-api-key

11. JIRA 配置

本实验不会使用这些值，因此您无需在执行命令之前将其更新为您的特定 JIRA 项目值。

设置 Cloud Run 服务部署所需的环境变量。

export JIRA_API_TOKEN=jira-token
export JIRA_USERNAME="YOUR-EMAIL"
export JIRA_INSTANCE_URL="https://YOUR-JIRA-PROJECT.atlassian.net"
export JIRA_PROJECT_KEY="YOUR-JIRA-PROJECT-KEY"
export JIRA_CLOUD=true

12. 将 Devai-API 部署到 Cloud Run

检查您是否位于正确的文件夹中。

cd ~/github/genai-for-developers/devai-api

在本实验中，我们将遵循最佳实践，使用 Secret Manager 在 Cloud Run 中存储和引用访问令牌和 LangChain API 密钥值。

将 JIRA 访问令牌存储在 Secret Manager 中。

echo -n $JIRA_API_TOKEN | \
 gcloud secrets create JIRA_API_TOKEN \
 --data-file=-

将 GitLab 访问令牌存储在 Secret Manager 中。

echo -n $GITLAB_PERSONAL_ACCESS_TOKEN | \
 gcloud secrets create GITLAB_PERSONAL_ACCESS_TOKEN \
 --data-file=-

将 LangChain API 密钥存储在 Secret Manager 中。

echo -n $LANGCHAIN_API_KEY | \
 gcloud secrets create LANGCHAIN_API_KEY \
 --data-file=-

将应用部署到 Cloud Run。

gcloud run deploy "$SERVICE_NAME" \
  --source=. \
  --region="$LOCATION" \
  --allow-unauthenticated \
  --service-account vertex-client \
  --set-env-vars PROJECT_ID="$PROJECT_ID" \
  --set-env-vars LOCATION="$LOCATION" \
  --set-env-vars GITLAB_URL="$GITLAB_URL" \
  --set-env-vars GITLAB_REPOSITORY="$GITLAB_REPOSITORY" \
  --set-env-vars GITLAB_BRANCH="$GITLAB_BRANCH" \
  --set-env-vars GITLAB_BASE_BRANCH="$GITLAB_BASE_BRANCH" \
  --set-env-vars JIRA_USERNAME="$JIRA_USERNAME" \
  --set-env-vars JIRA_INSTANCE_URL="$JIRA_INSTANCE_URL" \
  --set-env-vars JIRA_PROJECT_KEY="$JIRA_PROJECT_KEY" \
  --set-env-vars JIRA_CLOUD="$JIRA_CLOUD" \
  --set-env-vars LANGCHAIN_TRACING_V2="$LANGCHAIN_TRACING_V2" \
  --update-secrets="LANGCHAIN_API_KEY=LANGCHAIN_API_KEY:latest" \
  --update-secrets="GITLAB_PERSONAL_ACCESS_TOKEN=GITLAB_PERSONAL_ACCESS_TOKEN:latest" \
  --update-secrets="JIRA_API_TOKEN=JIRA_API_TOKEN:latest" \
  --min-instances=1 \
  --max-instances=3

回答 Y 以创建 Artifact Registry Docker 代码库。

Deploying from source requires an Artifact Registry Docker repository to store built containers. A repository named [cloud-run-source-deploy] in 
region [us-central1] will be created.

Do you want to continue (Y/n)?  y

请查看下面的 gcloud run deploy SERVICE_NAME --source=. 流程。了解详情。

5c122a89dd11822e.png

在后台，此命令使用 Google Cloud 的 buildpacks 和 Cloud Build 从源代码自动构建容器映像，而无需在机器上安装 Docker 或者设置 Buildpack 或 Cloud Build。也就是说，上述单个命令完成了本来还需要执行 gcloud builds submit 和 gcloud run deploy 命令才能完成的任务。

如果您提供了 Dockerfile（我们在本代码库中就提供了），Cloud Build 将使用该文件构建容器映像，而不是依赖于 buildpack 自动检测和构建容器映像。如需详细了解 Buildpack，请参阅文档。

在 Cloud 控制台中查看 Cloud Build 日志。

在 Artifact Registry 中查看创建的 Docker 映像。

打开 cloud-run-source-deploy/devai-api 并查看自动检测到的漏洞。查看可修复的问题，并根据说明了解如何进行修复。

d00c9434b511be44.png

在 Cloud 控制台中查看 Cloud Run 实例详情。

运行 curl 命令来测试端点。

curl -X POST \
   -H "Content-Type: application/json" \
   -d '{"prompt": "Create HTML, CSS and JavaScript using React.js framework to implement Login page with username and password fields, validation and documentation. Provide complete implementation, do not omit anything."}' \
   $(gcloud run services list --filter="(devai-api)" --format="value(URL)")/generate

（可选部分）设置 Cloud Workstation

Cloud Workstations 在 Google Cloud 上提供代管式开发环境，内置安全机制，并提供预配置但可自定义的开发环境。您可以创建工作站配置，以便以可重现的方式指定环境，而无需开发者安装软件和运行设置脚本。对工作站配置所做的任何更新都会在工作站下次启动时自动应用。开发者可以通过基于浏览器的 IDE、多个本地代码编辑器（例如 VSCode 或 JetBrains IDE，例如 IntelliJ IDEA Ultimate 和 PyCharm Professional）或 SSH 访问工作站。

Cloud Workstations 使用以下 Google Cloud 资源来管理您的开发环境：

  • 工作站集群定义了特定区域中的一组工作站及其所连接的 VPC 网络。工作站集群与 Google Kubernetes Engine (GKE) 集群无关。
  • 工作站配置充当着工作站的模板。工作站配置定义了工作站虚拟机 (VM) 实例类型、持久性存储空间、容器映像定义环境、要使用的 IDE 或代码编辑器等详细信息。管理员和平台团队还可以使用 Identity and Access Management (IAM) 规则向团队或个别开发者授予访问权限。
  • 工作站是预配置的开发环境，提供 Cloud IDE、语言工具、库等。工作站可按需启动或停止，并在项目中的 Compute Engine 虚拟机上运行，并附加一个永久性磁盘以在会话之间存储数据。

管理员和平台团队创建工作站配置，并与开发团队共享。每个开发者都会根据工作站配置创建工作站。

810ae08acb671f4c.png

在本实验中，您将使用基于浏览器的 IDE，但 Cloud Workstations 还支持其他常见的开发界面：

  • 您可以通过 JetBrains Gateway 使用自己的本地 JetBrains IDE
  • 如果您使用 Local VSCode，还可以通过 SSH 访问工作站以进行远程开发。
  • 您还可以从本地计算机设置到工作站的 SSH 隧道，甚至 TCP 隧道

fc95816682f1e3b0.png

（可选部分）创建 Workstations 集群

这些步骤已在实验室设置期间执行，您无需运行这些步骤。

这些步骤旨在展示如何设置 Cloud Workstations 集群、配置和工作站。

查看本部分，然后前往“Forge 平台”部分。

创建 Workstations 集群：

gcloud workstations clusters create ws-cluster --region=us-central1

创建 Workstations 配置

gcloud workstations configs create devai-config \
--cluster=ws-cluster \
--machine-type=e2-standard-8 \
--region=us-central1 \
--running-timeout=21600 \
--idle-timeout=1800 \
--container-predefined-image=codeoss \
--pd-disk-size=200 \
--pd-disk-type=pd-standard \
--service-account=$SERVICE_ACCOUNT_NAME@$PROJECT_ID.iam.gserviceaccount.com \
--pool-size=1

创建工作站

gcloud workstations create devai-workstation \
--cluster=ws-cluster \
--config=devai-config \
--region=us-central1

在 Cloud 控制台中查看可用的工作站。启动并运行“devai-workstation”。

e44784811890cfc8.png

启用右下角的“Gemini”，然后在新的浏览器标签页中按照登录流程操作，并将生成的代码复制回控制台以完成登录。

打开左侧面板中的“Gemini”聊天功能，然后向 Gemini 提问：

“You are a Cloud Workstations Product Manager, tell me about Cloud Workstations”。

“You are Cloud Workstations Product Manager, Can I create my custom Cloud Workstations image with my company tools so new developers can onboard in minutes?”。

8c3af1ad4e612f15.png

(END OF OPTIONAL SECTION)

13. Forge 平台

Forge 是一个平台，可让开发者构建可与 Atlassian 产品（例如 Jira、Confluence、Compass 和 Bitbucket）集成的应用。

eda6f59ff15df25e.png

安装 Forge CLI

在终端中运行以下命令。

下载 Node Version Manager ( nvm)，并将其放置在当前终端会话的路径中。

cd ~/github/genai-for-developers

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash


export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion

安装 nvm。

在终端中运行以下命令，选择最新的 Node.js LTS 版本：

nvm install --lts
nvm use --lts

运行以下命令以全局安装 Forge CLI：

npm install -g @forge/cli

在本实验中，我们将使用环境变量进行登录。

e4e4e59cf8622e3f.png

设置 JIRA 项目

使用您的个人账号创建/查看 JIRA 项目。

查看您现有的 JIRA 项目：https://admin.atlassian.com/

使用您的个人账号创建一个新的 JIRA 项目。

前往 https://team.atlassian.com/your-work，点击 8654143154cb8665.png，然后选择 47b253090a08932.png。然后，依次选择“JIRA Software”-“立即试用”。按照提示完成项目/网站的创建。

5bab2a96e3b81383.png

选择 JIRA Software。

785bc4d8bf920403.png

创建新项目。

8a6e7cdc8224ffa0.png

14. Atlassian API 令牌

创建或使用现有的 Atlassian API 令牌登录 CLI。

CLI 在运行命令时会使用您的令牌。

  1. 前往 https://id.atlassian.com/manage/api-tokens。
  2. 点击 Create API token（创建 API 令牌）。
  3. 输入一个标签来描述您的 API 令牌。例如，forge-api-token。
  4. 点击创建。
  5. 点击复制到剪贴板，然后关闭对话框。

在 Cloud Workstations 终端中运行以下命令。

登录 Forge CLI 即可开始使用 Forge 命令。

设置您的 JIRA/FORGE 电子邮件地址。请将此处的 替换为您的电子邮件地址。

export FORGE_EMAIL=your-email

设置 Forge API 令牌。请将其替换为您的 JIRA API 令牌。

export FORGE_API_TOKEN=your-jira-api-token

运行以下命令，测试 Forge CLI。当系统要求收集分析数据时，回答“No”。

forge settings set usage-analytics false

检查您是否已登录。

forge whoami

示例输出。

Logged in as John Green (johngreen@email.com)
Account ID: 123090:aaabbcc-076a-455c-99d0-d1aavvccdd

创建 Forge 应用

检查您是否位于“~/github/genai-for-developers”文件夹中。

运行命令以创建 Forge 应用。

forge create

出现提示时，请使用以下值：

  • 应用名称：devai-jira-ui-qwiklabs
  • 选择一个类别：UI Kit
  • 选择产品：Jira
  • 选择模板：jira-issue-panel

bc94e2da059f15cf.png

切换到应用文件夹。

cd devai-jira-ui-qwiklabs/

运行部署命令。

forge deploy

示例输出：

Deploying your app to the development environment.
Press Ctrl+C to cancel.

Running forge lint...
No issues found.

✔ Deploying devai-jira-ui-qwiklabs to development...

ℹ Packaging app files
ℹ Uploading app
ℹ Validating manifest
ℹ Snapshotting functions
ℹ Deploying to environment

✔ Deployed

Deployed devai-jira-ui-qwiklabs to the development environment.

安装应用。

forge install

出现提示时，请使用以下值：

  • 选择产品：Jira
  • 输入网站网址：your-domain.atlassian.net

示例输出：

Select the product your app uses.

? Select a product: Jira

Enter your site. For example, your-domain.atlassian.net

? Enter the site URL: genai-for-developers.atlassian.net

Installing your app onto an Atlassian site.
Press Ctrl+C to cancel.

? Do you want to continue? Yes

✔ Install complete!

Your app in the development environment is now installed in Jira on genai-for-developers.atlassian.net

打开您的 JIRA 网站，然后创建一个新的 JIRA 任务，并添加以下说明：

Create HTML, CSS and JavaScript using React.js framework to implement Login page with username and password fields, validation and documentation. Provide complete implementation, do not omit anything.

打开任务后，您会看到“devai-jira-ui-qwiklabs”按钮。

点击该按钮，然后在界面中查看更改。

88f6dd543827543.png

查看 Forge 后端日志。

forge logs

Atlassian 开发者控制台

您还可以在 Atlassian Developer Console 中查看和管理已部署的应用。

6a0e6ea177054fe6.png

查看日志 - 切换到 Development 环境，

56a7f74de6d2a01d.png

查看 Forge 应用清单和源代码

打开“devai-jira-ui-qwiklabs/manifest.yml”文件，然后使用 Gemini Code Assist 对其进行解释。

4a4377922ab9a927.png

查看说明。

5dd53138212dc686.png

打开以下文件，并让 Gemini Code Assist 对其进行解释：

  • devai-jira-ui-qwiklabs/src/frontend/index.jsx
  • devai-jira-ui-qwiklabs/src/resolvers/index.js

c99f48a5bf624501.png

使用 DevAI API Cloud Run 端点更新 Forge 应用

检查是否已设置 GCP 项目 ID：

gcloud config get project

如果没有，请使用 Qwiklabs 实验页面中的项目 ID 设置您的 GCP 项目：

示例：qwiklabs-gcp-00-2c10937585bb

gcloud config set project YOUR_QWIKLABS_PROJECT_ID

设置 Cloud Run 服务网址：

export DEVAI_API_URL=$(gcloud run services list --filter="(devai-api)" --format="value(URL)")

forge variables set DEVAI_API_URL $DEVAI_API_URL

运行以下命令进行确认：

forge variables list

示例输出

fb337c19c9009ac5.png

更新 Forge 应用清单和代码

您可以在代码库的 sample-devai-jira-ui 文件夹下找到这些代码段。

在编辑器中打开清单文件：devai-jira-ui-qwiklabs/manifest.yml

将以下代码行添加到文件末尾，并将 Cloud Run 端点替换为您部署的端点。

permissions:
  scopes:
    - read:jira-work
    - write:jira-work
  external:
    fetch:
      client:
        - devai-api-gjerpi6qqq-uc.a.run.app/generate # replace with YOUR CLOUD RUN URL

在编辑器中打开解析器/索引文件：devai-jira-ui-qwiklabs/src/resolvers/index.js

将以下代码行添加到现有 getText 函数后面。

resolver.define('getApiKey', (req) => {
  return process.env.LLM_API_KEY;
});

resolver.define('getDevAIApiUrl', (req) => {
  return process.env.DEVAI_API_URL;
});

在编辑器中打开 frontend/index 文件：devai-jira-ui-qwiklabs/src/frontend/index.jsx

将 index.jsx 替换为以下内容。更新指向您的 GitLab 用户 ID/代码库的链接。

您需要在两个位置更新 YOUR-GIT-USERID 和 YOUR-GIT-REPO。

在文件中搜索此行并进行更改：

https://gitlab.com/YOUR-GIT-USERID/YOUR-GIT-REPO/-/merge_requests

import React from 'react';
import ForgeReconciler, { Text, Link, useProductContext } from '@forge/react';
import { requestJira } from '@forge/bridge';
import { invoke } from '@forge/bridge';
import api, { route, assumeTrustedRoute } from '@forge/api';

// const apiKey = await invoke("getApiKey")
const devAIApiUrl = await invoke("getDevAIApiUrl")


const App = () => {
  const context = useProductContext();

  const [description, setDescription] = React.useState();

  const fetchDescriptionForIssue = async () => {
    const issueId = context?.extension.issue.id;
  
    const res = await requestJira(`/rest/api/2/issue/${issueId}`);
    const data = await res.json();
    
    // const genAI = new GoogleGenerativeAI(apiKey);
    // const model = genAI.getGenerativeModel({ model: "gemini-pro"});
    // const prompt = `You are principal software engineer at Google and given requirements below to implement.\nPlease provide implementation details and documentation.\n\nREQUIREMENTS:\n\n${data.fields.description}`
    // const result = await model.generateContent(prompt);
    // const text = result.response.text();
    // const jsonText = JSON.stringify(text);

    const bodyGenerateData = `{"prompt": ${JSON.stringify(data.fields.description)}}`;

    const generateRes = await api.fetch(devAIApiUrl+'/generate',
      {
        body: bodyGenerateData,
        method: 'post',
        headers: { 'Content-Type': 'application/json' },
      }
    )


    const resData = await generateRes.text();
    const jsonText = JSON.stringify(resData);

    const bodyData = `{
      "body": ${jsonText}
    }`;

    console.log("bodyData", bodyData)
    // Add Gemini response as a comment on the JIRA issue
    await requestJira(`/rest/api/2/issue/${issueId}/comment`, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: bodyData
    });
    // Add link to the GitLab merge request page as a comment
    await requestJira(`/rest/api/2/issue/${issueId}/comment`, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: `{"body": "[GitLab Merge Request|https://gitlab.com/YOUR-GIT-USERID/YOUR-GIT-REPO/-/merge_requests]"}`
    });


    return "Response will be added as a comment. Please refresh in a few moments.";
  };

  React.useEffect(() => {
    if (context) {
      fetchDescriptionForIssue().then(setDescription);
    }
  }, [context]);

  return (
    <>
      <Text>{description}</Text>
      <Link href='https://gitlab.com/YOUR-GIT-USERID/YOUR-GIT-REPO/-/merge_requests' openNewTab={true}>GitLab Merge Request</Link>
    </>
  );
};

ForgeReconciler.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

重新部署 Forge 应用

在 package.json 文件中添加依赖项：

"@forge/api": "4.0.0",

安装依赖项：

npm install

部署更新后的应用：

forge deploy

示例输出：

ℹ Uploading app
ℹ Validating manifest
ℹ Snapshotting functions
ℹ Deploying to environment

✔ Deployed

Deployed devai-jira-ui-qwiklabs to the development environment.

We've detected new scopes or egress URLs in your app.
Run forge install --upgrade and restart your tunnel to put them into effect.

安装更新后的应用：

forge install --upgrade

ef17c7da9b2962d8.png

示例输出：

Upgrading your app on the Atlassian site.

Your app will be upgraded with the following additional scopes:
- read:jira-work
- write:jira-work

Your app will exchange data with the following urls:
- devai-api-7su2ctuqpq-uc.a.run.app

? Do you want to continue? Yes

✔ Upgrade complete!

Your app in the development environment is now the latest in Jira on genai-for-developers.atlassian.net.

Test Forge 应用

在 JIRA 项目中打开现有 JIRA 任务或创建新任务。

如果您之前添加了面板，则需要将其移除。

点击“...”，然后从菜单中选择“移除”。之后，您可以再次点击该按钮。

1adca6205af0f0c6.png

查看 Jira 评论

收到 DEVAI API 的响应后，系统会在 JIRA 问题中添加两条评论。

  • GitLab 合并请求
  • Gemini 用户故事实现详情

在“History”和“Comments”标签页之间切换以刷新视图。

e3f38114330d504f.png

启用 GitLab 合并请求创建功能

打开 devai-api/app/routes.py 文件，然后取消备注 generate_handler 方法中的以下代码行：

print(f"{response.text}\n")

    # resp_text = response.candidates[0].content.parts[0].text

    # pr_prompt = f"""Create GitLab merge request using provided details below.
    # Create new files, commit them and push them to opened merge request.
    # When creating new files, remove the lines that start with ``` before saving the files.

    # DETAILS: 
    # {resp_text}
    # """

    # print(pr_prompt)
    # agent.invoke(pr_prompt)

重新部署 Cloud Run 应用

检查您是否位于正确的文件夹中。

cd ~/github/genai-for-developers/devai-api

如果您使用的是同一终端会话，则可能仍设置了所有环境变量。

您可以在终端中运行“echo $GITLAB_REPOSITORY”进行检查。

如果打开了新的终端会话，请按照以下步骤重置它们。

请务必先重置所需的环境变量，然后再重新部署应用。

此命令要求您更新 GitLab 用户 ID 和代码库名称。

export GITLAB_REPOSITORY="USERID/REPOSITORY"

设置其余的环境变量：

export GITLAB_URL="https://gitlab.com"
export GITLAB_BRANCH="devai"
export GITLAB_BASE_BRANCH="main"

export LANGCHAIN_TRACING_V2=true
export LANGCHAIN_ENDPOINT="https://api.smith.langchain.com"

export LOCATION=us-central1
export REPO_NAME=devai-api
export SERVICE_NAME=devai-api
export PROJECT_ID=$(gcloud config get-value project)

export JIRA_USERNAME="YOUR-EMAIL"
export JIRA_INSTANCE_URL="https://YOUR-JIRA-PROJECT.atlassian.net"
export JIRA_PROJECT_KEY="YOUR-JIRA-PROJECT-KEY"
export JIRA_CLOUD=true

GitLab 工具包将使用“devai”分支推送合并请求的更改。

请验证您是否已创建该分支。

将应用部署到 Cloud Run。

gcloud run deploy "$SERVICE_NAME" \
  --source=. \
  --region="$LOCATION" \
  --allow-unauthenticated \
  --service-account vertex-client \
  --set-env-vars PROJECT_ID="$PROJECT_ID" \
  --set-env-vars LOCATION="$LOCATION" \
  --set-env-vars GITLAB_URL="$GITLAB_URL" \
  --set-env-vars GITLAB_REPOSITORY="$GITLAB_REPOSITORY" \
  --set-env-vars GITLAB_BRANCH="$GITLAB_BRANCH" \
  --set-env-vars GITLAB_BASE_BRANCH="$GITLAB_BASE_BRANCH" \
  --set-env-vars JIRA_USERNAME="$JIRA_USERNAME" \
  --set-env-vars JIRA_INSTANCE_URL="$JIRA_INSTANCE_URL" \
  --set-env-vars JIRA_PROJECT_KEY="$JIRA_PROJECT_KEY" \
  --set-env-vars JIRA_CLOUD="$JIRA_CLOUD" \
  --set-env-vars LANGCHAIN_TRACING_V2="$LANGCHAIN_TRACING_V2" \
  --update-secrets="LANGCHAIN_API_KEY=LANGCHAIN_API_KEY:latest" \
  --update-secrets="GITLAB_PERSONAL_ACCESS_TOKEN=GITLAB_PERSONAL_ACCESS_TOKEN:latest" \
  --update-secrets="JIRA_API_TOKEN=JIRA_API_TOKEN:latest" \
  --min-instances=1 \
  --max-instances=3

验证端到端集成

再次点击该按钮，从 JIRA 任务启动流程，然后在 GitLab 代码库的“Merge request”部分下，验证 LangSmith 的输出。

GitLab 合并请求详情。

1cd438a10b4ce2b3.png

db6dc6c9a46e8f7b.png

LangSmith LLM 轨迹

打开 LangSmith 门户，然后查看 JIRA 问题创建调用的 LLM 轨迹。

LangSmith LLM 轨迹示例。

1ae0f88ab885f69.png

（可选部分）将更改推送到 GitHub 代码库

前往 GitHub 网站，创建一个新代码库，以将本实验的更改推送到您的个人代码库。

返回 Cloud Workstations 实例，然后在终端中设置 Git 用户名和电子邮件地址。

请先更新值，然后再运行命令。

git config --global user.name "Your Name"
git config --global user.email "your_email@example.com"

生成 SSH 密钥并将其添加到 GitHub 代码库中。

请先更新您的电子邮件地址，然后再运行命令。

请勿输入口令，然后按 Enter 键多次以完成密钥生成。

ssh-keygen -t ed25519 -C "your-email-address"

eval "$(ssh-agent -s)"

ssh-add ~/.ssh/id_ed25519

cat ~/.ssh/id_ed25519.pub

将生成的公钥添加到您的 GitHub 账号。

打开 https://github.com/settings/keys，然后点击“New SSH key”。

使用“qwiklabs-key”作为键名称，然后复制/粘贴上一个命令的输出。

返回终端，提交并推送更改。

cd ~/github/genai-for-developers

git remote rm origin

使用上面创建的代码库设置远程源代码。

请将其替换为您的代码库网址。

git remote add origin git@github.com:YOUR-GITHUB-USERID/YOUR-GITHUB-REPO.git

添加、提交并推送更改。

git add .

git commit -m "lab changes"

git push -u origin main

15. 恭喜！

恭喜，您已完成此实验！

所学内容：

  • 如何部署 Cloud Run 应用以与 Gemini API 集成。
  • 如何为 JIRA 创建和部署 Atlassian Forge 应用。
  • 如何使用 LangChain ReAct Agent 实现 GitLab 任务自动化。
  • 如何在 LangSmith 中查看 LLM 轨迹。

后续步骤：

  • 我们将推出更多实操课程，敬请期待！

清理

为避免因本教程中使用的资源导致您的 Google Cloud 账号产生费用，请删除包含这些资源的项目，或者保留项目但删除各个资源。

删除项目

若要避免产生费用，最简单的方法是删除您为本教程创建的项目。

©2024 Google LLC 保留所有权利。Google 和 Google 徽标是 Google LLC 的商标。其他所有公司名称和产品名称可能是其各自相关公司的商标。