🐺

Rust & Wasm から Gemini APIを使う

に公開

はじめに

前回作ったWebAssemblyのサンプルを使って、GeminiAPIを使ったミニゲームを作成してみました。GeminiとのHTTP非同期通信を、これまでと同じく、 ブラウザーが提供している "XmlHttpRequest"APIを使って、JS側で実現しています。

対象のバージョン

  • Rust 2024 Edition
  • rustc 1.83.0
  • cargo 1.80.1
  • rustup 1.27.1
  • pnpm 9.12.3

Rust&Wasm サンプル

Play in browser
サンプル

※文中の[_______]に当てはまる英語で入力してください。Geminiから添削結果が表示されます。
※サンプルを動作するためには、GeminiAPIキーが必要です。
※入力されたGeminiAPIキーは、安全のためcookie等に保存していません。そのため、毎回入力が必要になります。😢
https://github.com/myurioka/adventure

主な流れ

前回サンプルから、追加した実装を記載します。

13 "input"テキスト入力時に呼び出される関数(Closure)を用意します。
16 HTTPレスポンスを受け取った時に呼び出される関数(Closure)を用意します。
19 "input"イベントから、
・初回、GeminiAPIキーを保持します。
・初回以降、INPUT_TEXTに入力されたテキストを保持します。
21 ブラウザーに、GeminiAPIへのPOSTをリクエストします。👍
XmlHttpRequest.open("POST", <Gemini_api_endpoint>) XmlHttpRequest.set_request_header(<Content-Type>) XmlHttpRequest.send_with_opt_str(<Payload>)
23 ブラウザーは、WASMから受け取った<Payload>をGeminiにPostします。👍
25 ブラウザーは、レスポンスを 16: で用意した関数(Closure)に渡します。
26 受け取ったレスポンスを、内部変数に反映し、メッセージとして表示します。

Discussion