參加者掃碼加入,用中文或英文自由作答,由 Gemini 即時判分並雙語回饋,分數同步到現場大螢幕的即時排行榜——一場關於美國獨立歷史的雙語知識問答遊戲。
「Walk to Awareness(覺察之行)」是佛光山德州奧斯汀香雲寺於 2026 年 7 月 4 日舉辦的活動,這個網站是活動的線上互動環節:參加者用手機掃碼即可加入一場關於美國獨立歷史的知識問答遊戲。
有別於一般靜態問答,本網站以 AI 作為裁判——使用者用中文或英文自由作答,由 Gemini 比對答案是否正確(可辨識同義詞、暱稱、只給姓氏等),並以雙語回饋正確答案與一則趣味小知識。每題 0–100 分,完成後即時上榜,現場大螢幕可投影排行榜炒熱氣氛。
整個系統採無伺服器邊緣運算架構部署於 Cloudflare,零維運成本、全球加速,且 API 金鑰完全隱藏於後端,前端無法取得。
自由文字作答,Gemini 依「答案 key」判斷正確 / 接近 / 錯誤,容忍同義詞、部分名稱、跨語言、拼字誤差。
密碼登入的管理後台,可即時新增/編輯/刪除題庫、管理排行榜——非技術主辦方也能自助維護內容,不需改程式或重新部署。
介面與題目全雙語;管理者只需輸入一種語言,後端偵測缺漏並以低溫度呼叫 Gemini 自動翻譯另一種。
分數存於 Cloudflare KV(全球同步),以暱稱為識別、保留最高分;獨立可自動刷新的排行榜頁,適合現場大螢幕投影。
同一份商業邏輯同時跑在 Node.js/Express(本地開發)與 Cloudflare Workers(正式),環境差異由外部注入。
自動挑選最省成本的可用模型;過載時無縫切換備援,並記住能用的優先序,避免下次再撞牆。
金鑰後端代理、機密以 Cloudflare Secret 加密保存不進版控;管理入口低調隱藏 + 密碼保護——完整活動所需的營運安全都想過。
不是寫死內容的靜態頁面。管理者密碼登入後,透過視覺化介面對題庫做完整的新增 / 編輯 / 刪除(CRUD),變更即時寫入雲端資料庫並反映到線上——讓非技術背景的活動主辦方也能自助維運內容。包含一組受權限保護的 /api/admin/* RESTful API(密碼標頭驗證)、以 KV 儲存的資料持久層(首次存取自動載入種子資料)、AI 輔助編輯,以及排行榜一鍵重置。
把商業邏輯抽象成不依賴特定執行環境的模組——gemini.js(以工廠函式建立實例,只用標準 fetch)與 api.js(路由處理,回傳標準 Response)。同一份程式碼同時運行於 Node.js/Express 與 Cloudflare Workers,環境變數、儲存差異由外部注入,避免邏輯重複與分岔。
不寫死模型版本。啟動時呼叫 ListModels API,以評分函式依成本階梯挑最省的可用模型(flash-lite < flash < pro、排除影像/語音類);呼叫時若模型回傳 503 / 429 / timeout,會自動切換至備援模型,並以 AbortSignal.timeout 設定單次逾時上限,避免卡死。成功的模型會被提升至優先序——實測在模型過載時,系統從 34 秒卡頓自動優化到約 1.5 秒回應。
使用 Gemini 的 responseSchema(JSON Schema)強制模型輸出符合結構的 JSON(評分、中英回饋、小知識),免去脆弱的字串解析,確保前端永遠拿到可用資料,不會因為 AI 一句「Sure, here's the answer:」就崩掉。
評分:將使用者的自由文字答案與題目「答案 key」交給 Gemini 判斷,能容忍同義詞、部分名稱、跨語言、拼字誤差,回傳 正確 / 接近 / 錯誤 與 0–100 分。翻譯:管理者新增題目時只需填一種語言,後端偵測缺漏並以低溫度呼叫 Gemini 補齊;失敗時原樣儲存,不阻斷流程。
API 金鑰與管理密碼以 Cloudflare Secret 加密保存,不進版控、不外洩至前端;前端僅呼叫自家後端代理。管理後台以密碼保護,入口以低調的角落圖示隱藏,避免一般使用者干擾。
分數寫入 Cloudflare KV(全球同步),以暱稱為識別、保留最高分;提供獨立、可自動刷新的排行榜頁,適合活動現場大螢幕投影,為活動注入即時競爭氣氛。
| Method | Path | 說明 |
|---|---|---|
| GET | /api/questions | 取得題目(隱藏答案) |
| POST | /api/evaluate | 送出答案 → Gemini 評分 |
| GET | /api/leaderboard | 取得排行榜 |
| POST | /api/score | 送出分數,回傳名次 |
| POST | /api/admin/login | 管理者登入 |
| * | /api/admin/questions[/:id] | 題庫 CRUD(受權限保護) |
| 前端 | 原生 HTML5 / CSS3 / JavaScript(ES Modules · 零框架、零建置)· 響應式設計 |
| 後端(正式) | Cloudflare Pages Functions(邊緣 serverless,Web 標準 fetch API) |
| 後端(本地開發) | Node.js 24 + Express(與正式版共用同一份核心邏輯) |
| 資料儲存 | Cloudflare KV(題庫、排行榜) |
| AI | Google Gemini API(REST,結構化 JSON 輸出) |
| 部署 / CI | Cloudflare Pages + Wrangler CLI · Pages Secret 管理機密 |
全端開發:從前端 UI、後端 API 與後台管理系統(CMS)、AI 整合到雲端部署,獨立完成。
不只是「串接 API」:除了整合 Gemini,更自建了含權限、資料持久化與 CRUD 的後台管理系統,讓主辦方能自助維護內容——這是本專案跳脫「單純套用 AI」的關鍵。
架構選型:評估後選擇 Cloudflare Pages 而非傳統伺服器 / GitHub Pages——因網站需要隱藏金鑰的後端與資料庫,又要零維運與乾淨網址。
抽象共用核心:讓同一份邏輯同時支援本地與邊緣環境,兼顧開發體驗與部署彈性。
穩定性工程:針對 AI 服務不穩定(過載、逾時)設計自動降級與模型記憶機制,確保活動當天順暢。
部署於 Cloudflare Pages,開啟即用。免安裝、免登入、免金鑰即可挑戰全部題目。適合手機掃碼加入,桌機也可正常遊玩。