# 後端設定 — 10 分鐘填完即可上線

> 這份文件是給「沒寫過程式、只想點滑鼠完成設定」的人寫的。每一步都告訴你要點哪個按鈕、會看到什麼畫面。
>
> 全程**不需要寫任何 code、不需要部署 Apps Script**、不需要碰 GitHub。

完成後你會擁有：
- 1 個 Google Sheet（自動產生、用來看所有資料）
- 1 個 Google Form（玩家手機背後寫入用）

## 步驟 1：建立 Google Form（3 分鐘）

1. 打開 https://forms.google.com
2. 點左上 **「空白」** 圖示（建立新表單）
3. 表單標題改成「**27 級送舊互動 backend**」（隨便取，自己看的）
4. 預設會有一個「未命名問題」，把它改成：
   - 題目：**type**
   - 題型：**簡答**
5. 右側點 **「+」** 加新題目：
   - 題目：**payload**
   - 題型：**段落**（一定要選段落、不是簡答，因為 JSON 可能很長）
6. ✅ 兩個題目都不用設為必填（讓欄位空著也能送出）

完成後畫面上會有兩個題目：「type」（簡答）和「payload」（段落）。

## 步驟 2：連結到 Google Sheet（1 分鐘）

1. 表單上方分頁切到 **「回應」**（Responses）
2. 點右上角綠色 **Sheets 圖示**（試算表圖示）
3. 跳出對話框 → 選「**建立新試算表**」→ 按「建立」
4. ✅ 系統會自動開新分頁打開剛建的 Sheet
5. 把那個 Sheet 分頁留著、晚點要用

## 步驟 3：把 Sheet 設為「公開可讀」（1 分鐘）

> 這是讓網頁能讀到資料的關鍵。

1. 在剛開的 Sheet 右上角點 **「共用」**（Share）
2. 「**一般存取權**」原本是「限制」→ 改成「**知道連結的人**」
3. 右邊權限預設「檢視者」→ ✅ **保持「檢視者」**，不要改成「編輯者」
4. 按「完成」

> ⚠ 千萬不要設成「編輯者」，否則任何人都能改你的資料！

## 步驟 4：複製 Sheet 連結（30 秒）

1. 回到 Sheet 頁面
2. **複製整個網址**（瀏覽器網址列）— 格式長這樣：
   ```
   https://docs.google.com/spreadsheets/d/1abc...xyz/edit#gid=0
   ```
3. 貼到記事本暫存

## 步驟 5：取得 Form「預填連結」（2 分鐘）

> 這個連結會告訴我們的程式「type 欄位和 payload 欄位內部 ID 各是多少」。

1. 切回 Form 編輯頁面
2. 右上角點 **「⋮」**（三個直點選單）
3. 選「**取得預先填入的連結**」（Get pre-filled link）
4. 你會進入填表單畫面：
   - **type** 欄位：隨便輸入 `test`
   - **payload** 欄位：隨便輸入 `test`
5. 拉到最下面、按 **「取得連結」**（Get link）
6. 上方會跳出一條訊息「您的預先填入連結已產生」→ 按 **「複製連結」**（COPY LINK）
7. 連結貼到記事本暫存，格式長這樣（**很長、很正常**）：
   ```
   https://docs.google.com/forms/d/e/1FAIpQLSc.../viewform?usp=pp_url&entry.123456789=test&entry.987654321=test
   ```

## 步驟 6：填回網站（30 秒）

1. 打開你部署好的網站 `index.html`
2. 拉到底、展開 **「⚙ 幹部設定」**
3. 填入：
   - **1️⃣ Form 的「預填連結」** → 貼上步驟 5 的連結
   - **2️⃣ Google Sheet 連結** → 貼上步驟 4 的連結
4. 按 **「儲存設定」**
5. 按 **「🧪 測試連線」** 確認
   - ✅ 看到「全部 OK」→ 你完成了！
   - ❌ 看到錯誤 → 看下方故障排除

## 步驟 7：每台裝置都要做一次嗎？

- **是**。設定存在每台裝置的瀏覽器裡（localStorage）。
- 但是：**只有幹部需要填、玩家不用**。玩家會用「掃 QR 進來」的方式直接拿到你預設好的連結。
- 之後可以把設定好的「網址 + 加密參數」做成主 QR Code、玩家掃了就自動帶設定（進階用法，先不用管）。

實務上：
1. 你的筆電（主控、投影、moderator）需要填設定 → 1 次
2. 每個玩家手機掃 QR 進來 → 不用填、直接玩（如果你做進階版自帶設定 QR）

> 簡化方案：本次活動讓玩家手機也填一次設定（簡述的步驟 6），雖然每人多 30 秒，但活動只辦一次、可以接受。

## 故障排除

| 症狀 | 解法 |
|------|------|
| 「prefilled URL 解析失敗」 | 你貼的不是預填連結。回 Form → ⋮ → 取得預先填入的連結 → 兩欄都填值 → **取得連結** |
| 「Sheet 分頁不存在」 | 確認 Form 的回應有連結到那個 Sheet（步驟 2） |
| 「Sheet 讀取 HTTP 403」 | Sheet 沒設「知道連結的人可檢視」（步驟 3） |
| 寫入沒反應、Sheet 沒新增列 | 確認 Form 兩個題目都**不是「必填」**（必填+不填會被拒）；或重做步驟 5 |
| 測試連線顯示「測寫入...」就停住 | Google Form POST 在某些瀏覽器要 1-2 秒，等 5 秒；若 5 秒後仍沒進度則檢查網路 |

## 活動結束後

- Sheet 改回「限制存取」
- 或把整個 Form **刪除**（裡面所有資料會一起刪），紀念數據先匯出 CSV 留存
- 設定可在 index.html 「幹部設定」按「清除」（待實作；或直接清 localStorage）

---

## 為什麼要這樣設計？

老實說：原本用 Apps Script 是更乾淨的方案，但需要你貼程式碼、部署、授權，對非工程師太繁瑣。Google Form 路線繞了個彎，但每一步都是「點滑鼠選選項」、不用看任何 code。代價是：
- 資料表是「type + payload」兩欄、不像分頁分得乾淨
- 不過你不會直接看 Sheet（資料看 moderator 面板、看 stage 投影），所以這代價不痛