昨天先建立了一個簡單的 Frontend,讓使用者可以在 Browser 的輸入框輸入問題,也利用 JavaScript 取得輸入的內容。但分析結果其實還是利用 setTimeout() 模擬的,資料並沒有傳進原本的 Java。所以今天想了解 Browser 取得使用者的問題之後,到底要怎麼把它傳給 Java?
在這個過程中 Request 是 Client 向 Server 發出的請求,而 Response 則是 Server 處理完成後回傳的結果。當使用者輸入問題後,Browser 需要送出的 Request 大概包含:
URL:資料要傳到哪裡,例如 /api/chat
Method:使用的 POST
Header:利用 Content-Type: application/json 告訴 Server 傳送的資料是 JSONBody:真正要傳送的問題,例如 {"query":"我最近平均睡幾個小時?"}可以透過 fetch() 設定 Request 要傳送的位置、使用的 Method、Header 和 Body 。讓 JavaScript 發出 HTTP Request。
JSON.stringify({ query: userQuery }) 會轉成 JSON 字串放進 Request Body,再傳送給 Java。
由此可知, JSON 除了可以解析 Gemini API 的 Response 之外,也是 Frontend 和 Backend 之間交換資料時使用的格式。而 Java 在這個過程中會變成 Server ,之前在使用 Gemini API 時,基本上都是 Java 主動把 Request 傳給 Gemini。現在則是反過來,變成 Java 等待 Browser 傳來的 Request。
HTTP Request 發出去後,Server 不一定會立刻回傳結果,因此 fetch() 不會直接得到最後的資料,而是會回傳一個 Promise。
所以在 fetch() 後面可以用 .then()設定等結果傳回來後要做什麼。像是把 Server 回傳的 JSON 解析出來。
以及如果 Request 過程發生錯誤,利用.catch()處理錯誤。