本文面向将代码托管在云效的开发者,介绍如何通过云效流水线(Flow)结合 ESA CLI,实现从代码推送到构建部署的全自动化 CI/CD 流程。
概述
云效流水线(Flow)是阿里云提供的一站式持续集成和持续交付(CI/CD)服务,支持自动化构建、测试和部署。ESA CLI 是ESA提供的命令行工具,可用于快速创建 Pages 项目、上传文件和管理版本。
将 ESA CLI 集成到云效流水线中,可以实现以下自动化流程:
代码推送到云效代码库后,自动触发流水线执行构建和部署
构建产物通过 ESA CLI 自动上传至 ESA,生成新版本
新版本自动完成部署发布
前提条件
准备 AccessKey
通过CLI工具进行Pages创建时,需要以AccessKey为您的服务器进行ESA站点操作的授权,因此需要先获取对应的AccessKey信息。由于阿里云账号(主账号)拥有资源的所有权限,其AccessKey一旦泄露风险巨大,所以建议您创建并授权以满足最小化权限需求的RAM用户。
使用RAM管理员账号登录RAM控制台。
在左侧导航栏选择身份管理 > 用户,在用户页面单击创建用户。

填写RAM用户的登录名称,如
esa-cli,勾选使用永久 AccessKey 访问用以自动创建AccessKey信息,单击确定即可。
单击复制按钮保存当前RAM用户的AccessKey ID和AccessKey Secret。

在用户页面,在新建的RAM用户右侧配置项单击添加权限,为RAM用户配置可操作ESA的权限。

在新增授权页面,搜索权限策略关键词
ESA,在搜索结果中勾选AliyunESAFullAccess,单击确认新增授权即可。
开通云效 Flow 服务
登录云效 Flow 控制台。
如首次使用,按页面引导完成服务开通。
在云效流水线中配置 ESA CLI
创建Node.js模板
登录云效 Flow 控制台。
单击新建流水线,选择模板为Node.js,然后在右侧使用默认选项可视化编排下的Node.js · 测试、构建,单击创建。
添加流水线源
在流程配置步骤,单击选择子步骤构建下的添加流水线源。

在右侧配置项中选择代码源为Github,单击添加服务连接。

在新建服务连接页面处单击新建,自动跳转至Github登录页面,完成登录后,单击Authorize Alicloud-DevOps允许授权云效流水线。


完成Github授权后,根据业务代码所在仓库进行配置后单击添加即可。

配置Node环境
在流程配置步骤,单击选择子步骤构建下的Node.js 构建。

单击右侧 编辑 > 任务步骤 > 安装Node环境,按照您的业务需要配置Node环境。

单击右侧 编辑 > 任务步骤 > 构建物上传,单击右侧的
按钮,删除该步骤。
配置构建命令
单击右侧 编辑 > 任务步骤 > 执行命令,可参考下述示例代码在执行命令处进行填写:
npm install && npm run build npm i esa-cli@latest -g esa-cli login esa-cli deploy --name project_name --assets ./dist # ./dist为例举的静态产物目录,按照您实际的框架进行填写
单击右侧 编辑 > 任务步骤 > 执行命令,单击环境变量右侧的添加按钮,单击自定义参数。

添加两个环境变量:
ESA_ACCESS_KEY_ID:填写准备 AccessKey中创建的AccessKey ID。ESA_ACCESS_KEY_SECRET:填写准备 AccessKey中创建的AccessKey Secret。
单击运行并保存即可。
完整的 CI/CD 流程
完成上述配置后,完整的自动化部署流程如下:
代码推送:开发者将代码变更推送到云效代码库的指定分支。
触发流水线:云效 Flow 检测到代码推送,自动触发流水线运行。
构建阶段:流水线执行构建指令,生成构建产物到指定的静态产物目录。
部署阶段:流水线安装并登录 ESA CLI,将指定的静态产物目录中的构建产物部署到 ESA 站点。
验证部署成功
部署完成后,可通过以下方式确认部署是否成功:
在云效流水线首页查看最近运行阶段,构建为绿色图标则表示自动构建成功。

点击流水线名称进入流水线详情,单击构建组件的日志按钮。

在日志详情中选择执行命令,下拉即可找到构建成功的临时访问URL。访问URL即可查看效果。
说明临时链接有效期为1小时,您绑定自定义域名进行生产使用。
















