iT邦幫忙

2026 iThome 鐵人賽

DAY 5
0
Build on Google AI

《30天打造喵語日誌:Gemini API × Vibe Coding 實戰》系列 第 5

Day 05:【Structured Outputs】定義 Response Schema,零失敗率的數據對接

  • 分享至 

  • xImage
  •  

從「口頭交代」到「系統級硬約束」

昨天我們透過 Prompt 強制要求 AI 輸出 JSON,讓它能把照片和文字整理成前端能直接使用的結構化資料。
但如果真的要在正式環境中跑,就會發現一件事:光靠 Prompt 口頭交代,並不保證 100% 安全。

在實際開發上,最常見的災難長這樣:

  • AI 多包一層 Markdown 的 ```json 標籤

  • 某幾個欄位忘了加引號

  • Key 名稱不小心寫錯(例如 mood_score 變成 moodScore

  • 遇到模糊照片時,開始回一堆「這張照片太模糊我看不到」的廢話

這些對人類來說可能只是小瑕疵,但對前端來說,只要 JSON 格式有一丁點不對,JSON.parse() 就直接報錯,整個系統跟著跳機。

所以今天我們要做的,就是把請 AI 盡量遵守升級成系統強制約束
這一步,就是從口頭交代進化到系統級硬約束的關鍵。

黑色科技:Google AI Studio 的 Structured Outputs

Google AI Studio 有一個很強大的功能,叫做 Structured Outputs

它的運作原理跟一般 Prompt 很不一樣:

  • 一般 Prompt: 靠 AI 憑感覺遵守你寫的規則,偶爾會失手

  • Structured Outputs: 由 API 底層直接限制輸出 token 的產生邏輯,讓模型只能輸出符合你定義的 JSON 格式

也就是說,這不是 AI 盡量幫你,而是系統不允許它亂來

手把手建立《喵語日誌》Response Schema

接下來,我們就實際來設定《喵語日誌》的 Response Schema。

步驟一:開啟 Structured Outputs 開關

打開 Google AI Studio,在右側設定面板中找到 Structured Outputs 功能並點擊開啟,系統會彈出設定視窗。
https://ithelp.ithome.com.tw/upload/images/20260806/20178708z1ovXjvdXD.png

步驟二:使用 Code Editor 設定 JSON Schema

Google AI Studio 提供了 Visual Editor(圖形化介面)Code Editor(程式碼介面) 兩種設定方式:

  • Visual Editor: 適合用滑鼠點選新增欄位,對初學者非常友善。

  • Code Editor: 適合直接複製貼上寫好的結構,快速且精準。

為了確保欄位命名與資料型別一次到位,我們切換到 Code Editor 頁籤,清空預設文字後,貼上已經準備好的 JSON Schema:

{
  "type": "object",
  "properties": {
    "mood_score": {
      "type": "integer",
      "description": "1 到 10 的情緒分數"
    },
    "lifestyle_label": {
      "type": "string",
      "description": "生活標籤,如:深夜美食、週末放鬆"
    },
    "cat_response": {
      "type": "string",
      "description": "帶有貓咪語氣與動作描述的回應"
    }
  },
  "required": [
    "mood_score",
    "lifestyle_label",
    "cat_response"
  ]
}

這個 Schema 為 AI 設定了三大硬性規則:

  • 明確資料結構: 指定最外層輸出必須為 object 型別

  • 嚴格約束欄位: 定義 mood_score (整數) 與 lifestyle_label / cat_response (字串),並透過 required 陣列強制所有欄位皆為必填

  • 賦予語意引導: 透過 description 讓 AI 精準理解每個欄位該填入什麼內容

貼上後確認無誤,點擊右下角 Save 即可儲存設定!
https://ithelp.ithome.com.tw/upload/images/20260806/201787081uLZWxvQNL.png

步驟三:Temperature 的工程選擇

完成 Schema 設定後,還有一個關鍵參數需要微調:Temperature。

在 Day 03 和 Day 04 時,我們為了讓貓咪對話更有變化,將 Temperature 設在 0.5~0.7 之間。但到了需配合格式輸出的情境,建議將 Temperature 適度下調至 0.2~0.4:

  • Temperature 過高(> 0.7):雖然回應活潑,但可能增加語意偏離或邏輯不穩定的風險。

  • Temperature 過低(< 0.1):格式雖然絕對穩定,但回應會變得像客服機器人,喪失貓味

  • 黃金區間(0.2~0.4):在JSON 邏輯穩定度貓咪回應活潑度之間取得最佳平衡。

實務上我先設定為 0.4,這樣既能保持輸出的結構精準,又能保留貓咪療癒的性格!

極端壓力測試與成果展示

設定好之後,當然要來測試看看它到底有多穩。

極端測試:模糊到失焦的照片

我故意找了一張幾乎完全失焦、連文字都看不清的考卷照片,搭配簡短的抱怨:「今天真的好累喔...」。

在一般 Prompt 模式下,AI 很可能會反問「這張照片看不清楚耶?」,或是輸出帶有 Markdown 標籤的純文字。但開啟 Structured Outputs 之後,AI 的回傳結果如下:

{
  "mood_score": 3,
  "lifestyle_label": "備考日常",
  "cat_response": "喵嗚...看到你對著滿滿的英文題目,喵喵好心疼喔。*輕輕跳到書桌上,用軟軟的肉球按住你的課本,想讓你休息一下*。你已經很努力了,眼睛一定很痠吧?*發出呼嚕聲,用小腦袋用力蹭蹭你的手心*。先放下筆,讓喵喵陪你抱抱充個電,休息夠了再繼續,喵~"
}

https://ithelp.ithome.com.tw/upload/images/20260806/20178708Fy69VoLdWr.png
https://ithelp.ithome.com.tw/upload/images/20260806/20178708G0AZidi7Cz.png
實測亮點分析(✅ 完美符合預期):

  1. 乾淨無雜訊: 完全沒有多餘的 Markdown ```json 標籤或解釋廢話,就是 100% 純淨、可直接被 JSON.parse() 解析的物件。

  2. **結構絕對完整:**三個 key(mood_scorelifestyle_labelcat_response)全部齊全,型別也完全符合規範。

  3. 展現合理推理能力: 即使照片極度模糊,AI 依然能從模糊的題目排版與「好累」的文字中,精準推導出 mood_score: 3lifestyle_label: "備考日常",並給予超暖心的貓咪撫慰!

這就是系統級約束的威力——即使面對劣質輸入,AI 不僅不會崩潰跳機,還能穩定吐出結構化數據並補上合理的預設推理。

結語

走到今天,我們已經完成了《喵語日誌》最硬核的 AI 調校:不僅賦予了貓咪鮮明的陪伴靈魂,讓它具備看懂照片的多模態能力,更透過 Structured Outputs 打造了一個 100% 穩定、不會出錯的結構化大腦!

提示詞與資料結構皆已驗證完畢,這隻貓咪已經準備好正式進入產品開發階段。明天 Day 06:【環境建立】Vite 前端骨架建置與 API Key 安全機制,我們將從 Google AI Studio 跨入實際的前端開發,建立 Vite 專案骨架、設定 .env 安全存放 API Key,並將今天的 JSON Schema 轉化為前端的資料型別,讓 AI 數據無縫對接網頁 UI!


上一篇
Day 04:多模態視覺與 JSON 結構化輸出:讓 AI 讀懂照片並格式化回傳
下一篇
Day 06:【前端實作】Vite + React 骨架建置與 Gemini API 結構化串接全紀錄
系列文
《30天打造喵語日誌:Gemini API × Vibe Coding 實戰》20
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言