使用CodeArts釋出OBS，函式工作流重新整理CDN快取

華為雲開發者聯盟發表於2023-04-14

函式快取

摘要：上次透過OBS和CDN部署來Hexo網站，但是每次我們不可能都自己編譯然後在上傳到OBS，不然太麻煩了，所以我們需要構建流水線，透過PUSH Markdown來發布文章。

本文分享自華為雲社群《使用軟體開發生產線CodeArts釋出OBS，函式工作流重新整理CDN快取》，作者：熊大不大。

上次透過OBS和CDN部署來Hexo網站，但是每次我們不可能都自己編譯然後在上傳到OBS，不然太麻煩了，所以我們需要構建流水線，透過PUSH Markdown來發布文章，這樣方便又簡單，我們大概流程如此。

好來廢話不多說開幹。

第一步gitee上面擁有一份Hexo程式碼

這個不用多說，申請程式碼倉庫，提交自己部落格程式碼。

第二步華為雲申請CodeArts

這個是免費的，新建一個免費空間最多5人使用，自己使用即可地址 CodeArts地址，先點選新建專案，選擇DevOps全流程示例專案，輸入專案名稱點選OK，返回頁面在點選進去專案，能看到有很多專案流程選單。

第三步新建流水線

新建流水線之前我們先新建編譯構建

1.新建任務，名字取blog

2.選擇原始碼源為碼雲，第一次需要授權，Endpoint例項新建，根據提示授權即可

3.選擇程式碼倉庫，在選擇分支下一步選擇NPM構建然後修改指令碼

export PATH=$PATH:~/.npm-global/bin
 #設定快取目錄
 npm config set cache /npmcache
 npm config set registry https://repo.huaweicloud.com/repository/npm/
 npm config set disturl https://repo.huaweicloud.com/nodejs
 npm config set sass_binary_site https://repo.huaweicloud.com/node-sass/
 npm config set phantomjs_cdnurl https://repo.huaweicloud.com/phantomjs
 npm config set chromedriver_cdnurl https://repo.huaweicloud.com/chromedriver
 npm config set operadriver_cdnurl https://repo.huaweicloud.com/operadriver
 npm config set electron_mirror https://repo.huaweicloud.com/electron/
 npm config set python_mirror https://repo.huaweicloud.com/python
 npm config set prefix '~/.npm-global'
 #如需安裝node-sass
 #npm install node-sass --verbose
 #載入依賴
 npm install --verbose
 #預設構建 以上都是系統預設的 才是自己修改 tar.gz就當做備份
 npm run build
 tar -zcvf blog.tar.gz public
 #這個生成zip包給OBS
 cd public
 zip -r blog.zip *

4.需要新增檔案上傳到OBS上去，主要配置如下：產物路徑配置，桶名配置。

然後儲存執行，看是否有zip產物到OBS桶下面

5.新建流水線配置源，然後新增任務，然後把剛才的編譯構建的任務新增介面，部署不需要，因為這裡是編譯完畢直接上傳obs桶的

第四步開啟資料處理，把zip檔案自動解壓到桶目錄下

如圖下：

新建規則，事件選擇ObjectCreate,字首是包名全程不含字尾，字尾預設zip，解壓路徑預設，IAM委託根據連結新建一個只容許操作OBS的全新。

清除CDN快取, 使用函式工作流來

1.華為雲新增一個函式工作流,函式型別是事件函式、區域我選廣州、函式名自己取blogDeploy，執行時我選來14.18，現在有最新版本16了。

2.編寫程式碼

第一個檔案index.js

const refreshTask = require("./refreshTask")
exports.handler = async (event, context) => {
 const logger = context.getLogger();
 const urls = context.getUserData('urls')
 logger.info(JSON.stringify(event))
    logger.info('重新整理的地址', urls)
 const token = context.getToken()
 const t = await refreshTask(token, urls.split(';'))
 const output =
 {
 'statusCode': 200,
 'headers':
 {
 'Content-Type': 'application/json'
 },
 'isBase64Encoded': false,
 'body': JSON.stringify(t),
 }
 return output;
}

第二個檔案 refreshTask.js

const https = require("https");
function refreshTask(token, urls) {
 return new Promise((resovle) => {
 const data = JSON.stringify({
 refresh_task: {
                type: "directory",
 urls
 }
 });
 const options = {
            port: 443,
            hostname: "cdn.myhuaweicloud.com",
            path: "/v1.0/cdn/content/refresh-tasks",
            method: "POST",
            headers: {
 "X-Auth-Token": token,
 "Content-Type": "application/json",
 "Content-Length": data.length
 }
 };
 const req = https.request(options, (response) => {
 let todo = "";
 // called when a data chunk is received.
 response.on("data", (chunk) => {
 todo += chunk;
 });
 // called when the complete response is received.
 response.on("end", () => {
 console.log(JSON.parse(todo));
 resovle(JSON.parse(todo))
 });
 });
 req.write(data);
 req.on("error", (error) => {
 console.log("Error: " + error.message);
 });
 })
}
module.exports = refreshTask;