Snake's AI websim 生成報名系統

日期：

 



1. 建立專案

  1. 前往 Google Apps Script 並建立一個新專案。
  2. 將預設的 Code.gs 檔案內容替換為以下程式碼。

2. Code.gs 檔案

// 網頁主入口：回傳 HTML 頁面
function doGet(e) {
  return HtmlService.createHtmlOutputFromFile('index');
}

// 表單資料處理函式
function processForm(formData) {
  // 開啟指定的 Google 試算表
  var ss = SpreadsheetApp.openById('1HL-CFrbRmjqhPZva_w3xMG8dFzpdzdq5Am5hjakpj1E');
  // 取得第一個工作表 (或改用 ss.getSheetByName('工作表名稱'))
  var sheet = ss.getSheets()[0];
  
  // 假設表單包含姓名、電子郵件及其他欄位，依序寫入新的一列
  sheet.appendRow([formData.name, formData.email, formData.otherField]);
  
  // 回傳訊息給使用者
  return "感謝您的報名！";
}

3. index.html 檔案

請新增一個 HTML 檔案（檔名：index.html），並貼上以下內容：


<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <meta charset="UTF-8">
    <title>報名表單</title>
  </head>
  <body>
    <h1>報名表單</h1>
    <form id="regForm" onsubmit="handleSubmit(this); return false;">
      <label for="name">姓名：</label>
      <input type="text" id="name" name="name" required><br><br>
      
      <label for="email">電子郵件：</label>
      <input type="email" id="email" name="email" required><br><br>
      
      <label for="otherField">其他欄位：</label>
      <input type="text" id="otherField" name="otherField"><br><br>
      
      <input type="submit" value="送出報名">
    </form>
    
    <div id="response"></div>
    
    <script>
      // 當表單送出時，將資料傳送至伺服器端處理
      function handleSubmit(form) {
        var formData = {
          name: form.name.value,
          email: form.email.value,
          otherField: form.otherField.value
        };
        google.script.run.withSuccessHandler(function(response){
          document.getElementById("response").innerHTML = response;
          form.reset(); // 清除表單內容
        }).processForm(formData);
      }
    </script>
  </body>
</html>

4. 部署為網路應用程式

  1. 點選右上角的「部署」按鈕，選擇「新增部署」。
  2. 選擇「網路應用程式」。
  3. 設定存取權限（建議初次測試時選擇「僅限我」或「任何擁有連結的人」）。
  4. 部署後會獲得一個網址，使用該網址即可存取此報名表單。

這樣就完成了一個簡單的 Google Apps Script 報名網頁，使用者填寫表單後，資料會寫入指定的 Google 試算表中。您可以根據需要進一步擴充表單欄位或調整介面設計。


5. 執行結果

https://script.google.com/macros/s/AKfycbxINHCCftnbh5vdMPIOUJ_i34aY-HMl2XmIooLW1L3ac82QltsJpFdzB_SL35EEYNPW/exec