摘要:上次通過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 =https://www.cnblogs.com/huaweiyun/archive/2023/04/14/ 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;
3.設定環境變數和觸發器,環境變數設定為urls,值為https://www.webfan.cn/;https://webfan.cn/你需要重繪你的域名
觸發器設定為OBS觸發,桶名:放博客的桶,事件是ObjectCreated,名字自取,前綴index,后綴html,我們只識別index.html即可,
4.設定權限托管,我們OBS需要獲取token來請求CDN服務,所以需要委托代理授權,
點擊權限—創建委托,委托名字自己取,委托型別選云服務,云服務選擇搜索函式作業流,持續時間永久,
然后下一步選擇授權專案CDN RefreshAndPreheatAccess,點擊完成,可以查看到自己權限可以使用 CDN RefreshAndPreheatAccess,
然后在選擇委托保存,
然后在自己配置測驗OBS,
查看日志
好來一個完整的發布流程完整來,在本地我們寫來一份MD,然后通過PUSH之后,過幾分鐘則可以看到自己寫的內容已經自動部署到OBS了,然后網站自動重繪快取,非常方便,
點擊關注,第一時間了解華為云新鮮技術~
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/550147.html
標籤:其他
