Update fetched posts.

_posts/zmediumtomarkdown/2025-01-11-4cb4437818f2.md

@@ -2,12 +2,12 @@
 title: "使用 Google Apps Script Web App 表單串接 Github Action CI/CD 工作"
 author: "ZhgChgLi"
 date: 2025-01-11T11:19:43.066+0000
-last_modified_at: 2025-01-11T11:42:31.984+0000
+last_modified_at: 2025-01-11T16:32:30.680+0000
 categories: "ZRealm Dev."
 tags: ["ios-app-development","google-apps-script","github-actions","slack","github"]
 description: "Github Action Workflow 表單優化與整合其他工作流程工具(Jira, Asana, Slack..)提升開發效率。"
 image:
-  path: /assets/4cb4437818f2/1*xlRuXyKS5vJigUKUoy0bEA.png
+  path: /assets/4cb4437818f2/1*TiGXBQdPaCM6r2J1RHrgnA.png
 render_with_liquid: false
 ---
 
@@ -17,7 +17,7 @@ Github Action Workflow 表單優化與整合其他工作流程工具\(Jira, Asan
 
 
 
-![左：原始的 Github Action Workflow Form / 右： [最終成果 \(GAS Web App Form\)](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*xlRuXyKS5vJigUKUoy0bEA.png)
+![左：原始的 Github Action Workflow Form / 右： [最終成果 \(GAS Web App Form\)](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*TiGXBQdPaCM6r2J1RHrgnA.png)
 
 左：原始的 Github Action Workflow Form / 右： [最終成果 \(GAS Web App Form\)](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}
 ### 背景
@@ -154,9 +154,9 @@ Function as a Service 有很多種， [Cloud Functions](https://cloud.google.com
 #### 最終成果 🎉
 
 
-![[Demo App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*Xvm8hYz3pVej2C8vkw-BUg.png)
+![[Demo Web App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*pzW-Yki-4HbE2nYXC4q-Aw.png)
 
-[Demo App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}
+[Demo Web App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}
 #### **工作流程**
 
 我們使用 Google Apps Script Web App 建置 CI/CD 表單，直接綁定 Google Workspace 帳號，設定只有組織內的使用者可以存取；自動獲取當前登入的使用者信箱、使用 Github Repo 共用帳號\(或借用某個有權限的帳號\)的 Personal Access Token 打 Github API 獲得分支列表，送出後同樣打 API 觸發 Github Action 開始執行 CI/CD 工作。
@@ -287,7 +287,7 @@ Function as a Service 有很多種， [Cloud Functions](https://cloud.google.com
         <input type="number" value="<?=buildNumber?>"/>
       </div>
       <div class="form-group">
-        <label for="branch">分支：</label>
+        <label for="branch">Review 中的 PR：</label>
         <select id="branch" name="branch">
           <option>請選擇</option>
           <? pullRequests.forEach(pullRequest => { ?>
@@ -308,7 +308,7 @@ Function as a Service 有很多種， [Cloud Functions](https://cloud.google.com
     function displayMessage(ok, message) {
       const messageBlock = document.getElementById('message-block');
       messageBlock.className = ok ? 'message success' : 'message error';
-      messageBlock.textContent = message;
+      messageBlock.innerHTML = message;
       messageBlock.classList.remove('hidden');
     }
 
@@ -440,7 +440,7 @@ https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnN
 **點網址打開頁面查看效果：**
 
 
-![](/assets/4cb4437818f2/1*VW9YmmA_mInhBn17nc4yWA.png)
+![](/assets/4cb4437818f2/1*jbx4IO4DEhqYfwI_UTQk5Q.png)
 
 
 **這邊要多提兩個 GAS 限制：**
@@ -474,7 +474,7 @@ https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnN
 ![](/assets/4cb4437818f2/1*JAs_3__Qt2XeDcQiKEUNhg.png)
 
 
-如果 GAS 程式有變動才會需要再重新授權，不然點過一次就不會再出現。
+如果 GAS 程式權限有變動\(例如：多加存取 Google Sheet…etc\)才會需要再重新授權，不然點過一次就不會再出現。
 #### Step 3\. 串接 Github API 取得 PR 分支列表
 
 我們新增一個 `Github.gs` 程式檔案存放 Github API 相關邏輯。
@@ -624,7 +624,7 @@ function processForm(object) {
     const response = githubAPI("post", "/repos/zhgchgli0718/ios-project-for-github-action-ci-cd-demo/actions/workflows/CD-Job.yml/dispatches", payload);
     // 以 https://github.com/zhgchgli0718/ios-project-for-github-action-ci-cd-demo/blob/main/.github/workflows/CD-Job.yml 為例
 
-    return {"ok": true, "message": "打包請求發送成功"};
+    return {"ok": true, "message": `打包請求發送成功!<br/>對應分支：<strong>${object.branch}</strong><br/>版號：<strong>${object.buildNumber}</strong>`};
   } catch (error) {
     return {"ok": false, "message": "發生錯誤："+error.message};
   }
@@ -702,7 +702,7 @@ GAS 右上角選擇「部署」\-&gt; 選擇右上角「編輯」\-&gt; 版本
 **再回到網頁上重新整理，就能看到修改後的結果了：**
 
 
-![](/assets/4cb4437818f2/1*Xvm8hYz3pVej2C8vkw-BUg.png)
+![](/assets/4cb4437818f2/1*iI49OJC1uTyMEgzGTBowxQ.png)
 
 
 
@@ -720,7 +720,11 @@ GAS 右上角選擇「部署」\-&gt; 選擇右上角「編輯」\-&gt; 版本
 ### Done\! 🎉🎉🎉
 
 
-![[Demo Web App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*Xvm8hYz3pVej2C8vkw-BUg.png)
+![](/assets/4cb4437818f2/1*pzW-Yki-4HbE2nYXC4q-Aw.png)
+
+
+
+![[Demo Web App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}](/assets/4cb4437818f2/1*9aaNeemezNPRlSgbLFrseA.png)
 
 [Demo Web App Form](https://script.google.com/macros/s/AKfycbw8SuK7lLLMdY86y3jxMJyzXqa5tdxJryRnteOnNi-lK--j6CmKYXj7UuU58DiS0NSVvA/exec){:target="_blank"}