注意:
- 此教程需要访问 Oracle Cloud。要注册免费账户,请参阅开始使用 Oracle Cloud Infrastructure Free Tier 。
- 它使用 Oracle Cloud Infrastructure 身份证明、租户和区间示例值。完成实验室时,请将这些值替换为特定于云环境的值。
使用 OCI DevOps 服务和 OCI 对象存储简化前端 CI/CD
简介
此教程:设置 Oracle Cloud Infrastructure (OCI) 对象存储和 Oracle API Gateway for Static Website Hosting 介绍了如何在 OCI 对象存储和 Oracle API Gateway 上利用提前 (AOT) 编译托管静态编译的 JavaScript 应用程序。
为了建立完整的生产工作流,在本教程中,我们将指导您使用 Oracle Cloud Infrastructure DevOps 服务为静态前端网站设置强大的 CI/CD DevOps 管道。
OCI DevOps 服务是一个面向开发人员的端到端连续集成和持续交付 (CI/CD) 平台。使用此服务,DevOps 工程师可以在 Oracle Cloud 上轻松构建、测试和部署软件和应用。DevOps 构建和部署管道可减少变更驱动的错误,并缩短客户构建和部署版本的时间。该服务还提供专用 Git 资源库来存储代码并支持与外部代码资源库的连接。
目标
- 使用 OCI DevOps 服务和 OCI Object Storage 为静态前端网站设置强大的 CI/CD DevOps 管道。
先决条件
- 访问 Oracle Cloud 租户。
任务 1:创建 OCI 对象存储桶
在 OCI 对象存储中创建新的存储桶。此存储桶将用于托管静态网站,如为静态网站托管设置 OCI 对象存储和 Oracle API Gateway 中所述。

任务 2:创建 DevOps 项目
导航到 Developer Services(开发人员服务)、DevOps 、 Projects(项目),单击 Create Devops project(创建开发运维项目),输入项目名称,选择通知主题,然后单击 Create(创建)。
注:如果您尚未创建新通知主题,则必须创建新通知主题。

任务 3:建立代码资料档案库
您可以选择创建新的专用 Git 资料档案库或镜像 OCI 代码资料档案库中的现有资料档案库。
注:按照以下文档操作:设置资料档案库以与代码资料档案库交互。
使用以下代码在资料档案库中创建 build_spec.yaml 文件。这可用作 DevOps 构建的构建规范。
version: 0.1
component: build
timeoutInSeconds: 1000
shell: bash
env:
variables:
# exportedVariables are made available to use as parameters in sucessor Build Pipeline stages
# For this Build to run, the Build Pipeline needs to have a BUILDRUN_HASH parameter set
exportedVariables:
- BUILDRUN_HASH
steps:
- type: Command
name: "Define unique build tag"
timeoutInSeconds: 140
command: |
echo "OCI_BUILD_RUN_ID: ${OCI_BUILD_RUN_ID}"
export BUILDRUN_HASH=`echo ${OCI_BUILD_RUN_ID} | rev | cut -c 1-7`
echo "BUILDRUN_HASH: " $BUILDRUN_HASH
- type: Command
name: "Install Nodejs"
command: |
sudo yum install -y oracle-nodejs-release-el7 oracle-release-el7
echo "Installation Complete..."
- type: Command
name: "Frontend build"
command: |
npm install
npm run build
echo "Build Done..."
- type: Command
name: "Zip build files"
command: |
cd dist
zip -r -j build.zip angular-conduit/*
echo "Zip complete"
f
outputArtifacts:
- name: static-website-build # Change this to your artifact name.
type: BINARY
location: dist/build.zip
任务 4:建立构件注册表
OCI Artifact Registry 是用于存储、共享和管理软件包的系统信息库服务。使用构件注册表,您可以管理构件以使构件不可变,识别具有安全散列的构件,添加版本,上载和下载,提取最新以及控制可见性和权限。有关更多信息,请参阅对象注册表
-
要创建构件注册表,请导航到 OCI 控制台、开发人员服务、容器和构件、构件注册表,然后单击创建资料档案库,输入以下详细信息并单击创建。这将创建空构件注册表以存储构件。


-
要创建部署构件,我们将使用 DevOps Shell 容器运行时将构建构件部署到 OCI 对象存储。为此,我们将创建部署规范。有关详细信息,请参阅部署规范。
命令规范 -
deployemnt_spec.yamlversion: 0.1 component: command timeoutInSeconds: 6000 shell: bash inputArtifacts: - name: "static-artifact" type: GENERIC_ARTIFACT registryId: "<Artifact Registry OCID>" # replace this with your Artifact Registry OCID path: "build/static-website.zip" # replace this with your Build Artifact Path version: ${version} location: /workspace/input/build.zip steps: - type: Command timeoutInSeconds: 600 name: "unzip artifact" command: | echo "unzipping..." ls -latr /workspace/input mkdir -p /workspace/output unzip /workspace/input/build.zip -d /workspace/output ls -latr /workspace/output - type: Command name: "Bucket cleanup" timeoutInSeconds: 140 command: | oci os object bulk-delete --force --bucket-name <bucket_name> # replace this with your bucket name. echo "delete complete..." - type: Command name: "Static Website Deployment" timeoutInSeconds: 140 command: | oci os object bulk-upload --bucket-name <bucket_name> --content-type auto --src-dir /workspace/output/ # replace this with your bucket name. echo "deployment complete..."注::-content-type 自动参数确定并设置要上载的文件的内容类型(如果未指定),则已上载文件的内容类型设置为 octet-stream。
-
导航到 OCI 控制台、开发人员服务、构件注册表,选择在步骤 1 中创建的注册表,单击上载构件,然后输入构件路径名称作为下载构件,版本作为 1 ,然后单击上载上载部署规范。

任务 5:建立构建和部署管道
构建管道:在此处编译、测试和打包应用代码。在 OCI DevOps 中,您可以定义构建管道,以指定构建应用所需的步骤。这通常包括运行自动测试以确保代码质量。
部署管道:将构建的对象部署到各种环境,例如测试、暂存和生产环境。在 OCI DevOps 中,部署管道允许您定义部署应用的流程,包括指定不同部署策略(例如蓝绿色或金丝雀部署)的功能。我们将继续设置构建和部署管道。
-
访问构件注册表和 IAM 策略。
您可以从 DevOps 服务访问存储在构件注册表中的构件。您可以在构件注册表中创建对三种类型的构件的引用:实例组部署配置、常规构件和 Kubernetes 清单。管理员必须向管道资源授予读取的所有对象权限。
我们需要添加多个 IAM 策略,以便 DevOps 服务构建和部署管道和容器服务可以访问构件注册表来上载和下载构件。有关详细信息,请参阅 DevOps IAM 策略
-
创建工作版本管道。有关 OCI 构建管道的更多信息,请参阅管理构建管道。
-
导航到 OCI 控制台、开发人员服务、DevOps ,选择项目,选择构建管道并单击创建构建管道,然后打开您创建的管道。

-
要管理构建,请单击添加阶段、托管构建、下一步,输入以下详细信息,然后单击添加。
-
阶段名称:
npm build -
构建运行程序配置:
Default Shape -
基本容器映像:
Oracle Linux 7 x86_64 standard:1.0(您可以根据需要进行更改) -
构建规范文件路径:
build_spec.yaml主代码资料档案库 - 单击“选择源连接”类型 - OSI 代码资料档案库,在表中选择资料档案库, -
分支:
main。注意:您可以根据需要更改构建计算机。



-
-
添加另一个阶段提供构件。单击“托管构建”阶段下面的加号,选择提供构件,然后单击下一步。

输入阶段名称作为保存对象,单击创建对象并输入以下详细信息。
-
名称:
save-artifacts -
类型:
General Artifact -
对象位置:
Set a custom artifact location and Version -
对象路径:
build/static-website.zip -
version :
${version} -
在将构建构件与构建结果关联下,输入构建配置/生成构件名称作为
static-website-build,然后单击添加。

注::确保构建构件名称与“构建规范输出构件”阶段中的名称相同。
-
-
-
创建部署管道。有关部署管道的更多信息,请参阅管理部署管道。
-
导航到 DevOps ,选择您的项目,选择部署管道,单击创建部署管道,输入所需的信息,然后单击创建。

-
单击添加阶段并选择集成作为“执行 Shell 命令”,然后单击下一步,输入阶段名称并将我们在任务 4.2 中创建的工件设置为命令规范。

-
选择部署规范,我们在任务 4.2 中上载到构件注册表。

-
选择 shell 阶段的容器实例配置和大小,然后单击添加。

-
-
触发部署管道阶段。我们已创建构建和部署管道,需要从构建管道触发部署管道。为此,我们将返回到构建阶段并添加类型为触发器部署的其他阶段。
-
要添加阶段,请单击提供构件下面的加号,然后选择触发部署。

-
输入阶段名称作为部署到 oss ,选择选择部署管道,然后单击添加。

我们为部署管道添加了触发器。现在,我们的构建和部署管道已完成。

-
任务 6:添加参数
我们将构建版本添加到参数中,以便使用各个构建版本号跟踪各个构建版本。导航到我们在任务 5.1 中创建的构建管道,转到参数,将名称添加为“版本”,将默认值添加为“0”,将说明添加为“对象的版本”,然后单击加号以将参数添加到构建。

任务 7:测试
转到我们创建的构建管道,然后单击开始手动运行。

您可以按如下所示查看运行日志。

注:
如果收到“未找到构件”错误,请确保您具有所有必需的 IAM 策略,并且构件路径和版本正确。
确保构建和下载规范中的构件名称与构件注册表中相同。
相关链接
确认
- 作者 - Mayank Kakani(OCI 云架构师)
更多学习资源
浏览 docs.oracle.com/learn 上的其他实验室,或者通过 Oracle Learning YouTube 频道访问更多免费学习内容。此外,请访问 education.oracle.com/learning-explorer 以成为 Oracle Learning Explorer。
有关产品文档,请访问 Oracle 帮助中心。
Streamline Frontend CI/CD with OCI DevOps Service and OCI Object Storage
F90963-01
December 2023
Copyright © 2023, Oracle and/or its affiliates.