全部产品
弹性计算 会员服务 网络 安全 移动云 数加·大数据分析及展现 数加·大数据应用 管理与监控 云通信 阿里云办公 培训与认证 更多
存储与CDN 数据库 域名与网站(万网) 应用服务 数加·人工智能 数加·大数据基础服务 互联网中间件 视频服务 开发者工具 解决方案 物联网 智能硬件
云效

使用自定义脚本发布静态资源

更新时间:2018-04-17 14:51:38

本文描述如何在云效上使用自定义脚本任务发布静态资源。

背景

Web应用程序会包含相关的静态资源(html,css,js)。为了加速这些静态资源的访问,通常会将它们放在CDN上。在阿里云上,您可以参考OSS加CDN的方案。

示例

基于上面的方案,我们需要一个流程来将静态资源进行打包,并发布到OSS上。下面会给出一个完整的代码库及流水线配置的示例。

创建代码库

示例代码库。本文使用一个静态的代码库作为示例,您可以clone该代码并push到您自己的仓库中。

  1. $ tree
  2. .
  3. ├── assets
  4. ├── css
  5. └── index.css
  6. ├── image
  7. └── home.png
  8. └── js
  9. └── index.js
  10. └── frontend.release

其中assets目录下是静态资源的源码,frontend.release构建配置的示例,内容如下:

  1. code.language=node8.x
  2. build.output=assets

创建应用

应用是研发活动的载体,从分支合并到线上发布,都会在应用的上下文中进行,详情请了解:应用新建向导开发模式概述

所以您需要创建一个应用以进行静态资源的发布。

使用创建应用向导,并填入自己的代码库地址,以完成应用的创建及构建配置文件的自动生成。生成您的<应用名>.release文件之后,请保证内容和frontend.release的内容相同。

OSS与RAM设置

创建一个OSS的bucket。在本例中,bucket名为frontend-cdn,地址为frontend-cdn.oss-cn-beijing.aliyuncs.com

接下来创建一个RAM用户,勾选“为该用户自动生成AccessKey”,以便用该用户的AcessKey来发布静态资源:

ram

然后给该用户赋予frontend-cdn这个bucket的权限:

ram

流水线

然后开始在云效上配置流水线:

构建

使用自定义脚本任务上传静态资源到OSS:上传

完整的脚本如下:

  1. # 配置OSS AccessKey
  2. ossutil config -e oss-cn-beijing.aliyuncs.com -i <your access key id> -k <your access key secret>
  3. # 使用jq(https://stedolan.github.io/jq/tutorial/)来解析环境变量中的JSON信息,并下载上一步构建中产生的软件包(JSON信息详情请参看https://help.aliyun.com/document_detail/69663.html)
  4. echo $PACKAGES | jq '.[0].fileUrl' | xargs wget -O assets.tgz
  5. tar zxf assets.tgz
  6. # 获取完整版本号(版本号JSON信息详情请参看https://help.aliyun.com/document_detail/69663.html)
  7. fullVersion=`echo $VERSION | jq '.[0].versionNumber' -r`
  8. echo static resource version is $fullVersion
  9. echo uploading to oss...
  10. # 使用ossutil上传静态资源到指定版本的OSS目录中
  11. ossutil cp -rf assets oss://frontend-cdn/$fullVersion

运行一次看看:运行时

到OSS上进行查看:OSS上传成功

可以看到该流程根据云效提供的版本号,创建了OSS上的目录,并把当前版本静态资源上传其中。

本文导读目录