ANTIGRAVITY LABEN
記事一覧/連携・プラグイン
連携・プラグイン/2026-05-14中級

Antigravity × Gemma 4 API 実践実装ガイド — Python・TypeScript コード例でゼロから構築

AntigravityでGemma 4 APIを実際に呼び出す方法を、Python・TypeScriptのコード例付きで徹底解説。APIキー設定からストリーミング実装、エラーハンドリングまで、開発現場ですぐ使える実践ガイドです。

Gemma 421Gemma 4 APIAntigravity338Python13TypeScript11Google AI4ローカルLLM20202624

取り組みの背景 — この記事で学べること

Gemma 4の登場以来、「Antigravity IDE上でGemma 4 APIをどう使えばいいか」という問い合わせが急増しています。概要を解説した記事は多いものの、実際にコードを書いて動かす手順まで踏み込んだ情報はまだ少ないのが現状です。

ここではAntigravityプロジェクトにGemma 4 APIを組み込む方法を、PythonTypeScriptの具体的なコード例を交えながら丁寧に解説します。APIキーの取得から、チャット実装、ストリーミングレスポンス、そよくあるエラーへの対処法まで、実務で即座に活用できる内容を目指しました。

対象読者

  • Antigravity IDEでWebアプリやAPIサーバーを開発している方
  • Gemma 4のAPIを使ったアプリを作りたい中級者
  • Google AI Studioは触ったことがあるが、自前のコードベースに組み込む方法が分からない方

前提条件 — 開発環境の準備

必要なもの

Gemma 4 APIを利用するには、以下が必要です。

  • Antigravity IDE(最新バージョン)
  • Google AI Studio のアカウント(無料)
  • Gemma 4 API キー(AI Studioで取得)
  • Python 3.10以上、または Node.js 18以上

API キーの取得手順

Google AI Studio(aistudio.google.com)にアクセスし、左メニューの「Get API key」からAPIキーを生成します。生成されたキーは後で環境変数に設定するので、安全な場所に保管してください。

Antigravity での環境変数設定

Antigravityプロジェクトでは、APIキーをハードコードするのではなく、.envファイルで管理するのが推奨です。

# .env ファイルの作成
touch .env
# .env の内容
GEMMA_API_KEY=YOUR_GEMMA_API_KEY

💡 Antigravity のヒント: Antigravity IDE では .env ファイルを認識してくれるため、AI チャット(Cmd+L)で環境変数を参照したコード生成を依頼すると、APIキー管理のベストプラクティスに沿ったコードが出力されます。


Gemma 4 APIの基本を理解する

利用できるモデル

Gemma 4は複数のモデルサイズを提供しています。APIで指定する際のモデル名は以下の通りです。

  • gemma-4-9b-it — 軽量・高速。日常的なタスクや低レイテンシが求められる用途に最適
  • gemma-4-27b-it — バランス型。精度と速度のバランスが優れた汎用モデル
  • gemma-4-27b-it-vision — ビジョン対応版。画像入力が必要な場合に使用

-itは「Instruction-Tuned」の略で、チャット形式の対話に最適化されたモデルを指します。

APIエンドポイントの構造

Gemma 4はGoogle AI Studio APIを通じて利用します。ベースURLは以下の形式です。

https://generativelanguage.googleapis.com/v1beta/models/{モデル名}:generateContent

Python での実装

まずはPythonでの基本的な実装から始めましょう。

パッケージのインストール

# Google Generative AI ライブラリのインストール
pip install google-generativeai python-dotenv

基本的なチャット実装

import google.generativeai as genai
from dotenv import load_dotenv
import os
 
# 環境変数の読み込み
load_dotenv()
api_key = os.getenv("GEMMA_API_KEY")
 
# Gemma 4 クライアントの初期化
genai.configure(api_key=api_key)
model = genai.GenerativeModel("gemma-4-27b-it")
 
def chat_with_gemma(prompt: str) -> str:
    """Gemma 4 APIにリクエストを送信してレスポンスを返す"""
    response = model.generate_content(prompt)
    return response.text
 
# 使用例
if __name__ == "__main__":
    question = "Antigravity IDEとはどのようなツールですか?"
    answer = chat_with_gemma(question)
    print(f"Gemma 4: {answer}")
 
# 期待する出力:
# Gemma 4: Antigravity IDEはGoogleが提供するAI駆動の統合開発環境です。
# AIエージェントを活用してコードの生成、デバッグ、リファクタリングを支援します...

ストリーミングレスポンスの実装

長いレスポンスを待たずにリアルタイムで表示する場合は、ストリーミングを使用します。

import google.generativeai as genai
from dotenv import load_dotenv
import os
 
load_dotenv()
genai.configure(api_key=os.getenv("GEMMA_API_KEY"))
model = genai.GenerativeModel("gemma-4-27b-it")
 
def stream_chat_with_gemma(prompt: str) -> None:
    """ストリーミングでGemma 4のレスポンスを表示する"""
    print("Gemma 4: ", end="", flush=True)
    
    # stream=True でストリーミングを有効化
    for chunk in model.generate_content(prompt, stream=True):
        if chunk.text:
            print(chunk.text, end="", flush=True)
    
    print()  # 改行
 
# 使用例
stream_chat_with_gemma(
    "PythonでFastAPIを使ったRESTful APIサーバーの実装例を教えてください。"
)
 
# 期待する出力(逐次的に表示される):
# Gemma 4: FastAPIを使ったRESTful APIの実装方法を説明します。
# まず必要なパッケージをインストールします...

マルチターン会話(チャット履歴の管理)

実際のチャットボットでは会話の文脈を保持する必要があります。

import google.generativeai as genai
from dotenv import load_dotenv
import os
 
load_dotenv()
genai.configure(api_key=os.getenv("GEMMA_API_KEY"))
model = genai.GenerativeModel("gemma-4-27b-it")
 
# チャットセッションを作成(履歴が自動的に管理される)
chat = model.start_chat(history=[])
 
def multi_turn_chat(user_message: str) -> str:
    """文脈を保持したマルチターン会話"""
    response = chat.send_message(user_message)
    return response.text
 
# 会話の例
print(multi_turn_chat("私はPythonを使ってWebアプリを開発しています"))
print(multi_turn_chat("おすすめのフレームワークはありますか?"))
print(multi_turn_chat("先ほど言ったフレームワークの具体的な使い方を教えて"))
# ← 「先ほど言ったフレームワーク」の文脈が正しく解釈される

TypeScript / Node.js での実装

フロントエンドやNext.jsプロジェクトでの活用には、TypeScriptでの実装が便利です。

パッケージのインストール

npm install @google/generative-ai dotenv
# TypeScriptを使う場合
npm install -D typescript @types/node ts-node

基本的なチャット実装

import { GoogleGenerativeAI } from "@google/generative-ai";
import * as dotenv from "dotenv";
 
dotenv.config();
 
const genAI = new GoogleGenerativeAI(process.env.GEMMA_API_KEY!);
const model = genAI.getGenerativeModel({ model: "gemma-4-27b-it" });
 
async function chatWithGemma(prompt: string): Promise<string> {
  const result = await model.generateContent(prompt);
  const response = result.response;
  return response.text();
}
 
// 使用例
async function main() {
  const question = "TypeScriptでの非同期処理のベストプラクティスを教えてください";
  const answer = await chatWithGemma(question);
  console.log(`Gemma 4: ${answer}`);
}
 
main().catch(console.error);

Next.js API Route での実装

AntigravityでNext.jsプロジェクトを開発している場合、API Routeとして組み込むのが一般的なパターンです。

// app/api/gemma/route.ts
import { GoogleGenerativeAI } from "@google/generative-ai";
import { NextRequest, NextResponse } from "next/server";
 
const genAI = new GoogleGenerativeAI(process.env.GEMMA_API_KEY!);
 
export async function POST(req: NextRequest) {
  try {
    const { message } = await req.json();
 
    if (!message || typeof message !== "string") {
      return NextResponse.json(
        { error: "メッセージが無効です" },
        { status: 400 }
      );
    }
 
    const model = genAI.getGenerativeModel({ model: "gemma-4-27b-it" });
    const result = await model.generateContent(message);
    const responseText = result.response.text();
 
    return NextResponse.json({ reply: responseText });
  } catch (error) {
    console.error("Gemma 4 API エラー:", error);
    return NextResponse.json(
      { error: "AIレスポンスの生成に失敗しました" },
      { status: 500 }
    );
  }
}
 
// クライアントサイドからの呼び出し例:
// const res = await fetch("/api/gemma", {
//   method: "POST",
//   headers: { "Content-Type": "application/json" },
//   body: JSON.stringify({ message: "こんにちは" }),
// });
// const data = await res.json(); // { reply: "こんにちは!..." }

ストリーミングAPIの実装(Next.js)

ChatGPTのようなリアルタイム出力を実現するには、Server-Sent Eventsを使います。

// app/api/gemma/stream/route.ts
import { GoogleGenerativeAI } from "@google/generative-ai";
import { NextRequest } from "next/server";
 
const genAI = new GoogleGenerativeAI(process.env.GEMMA_API_KEY!);
 
export async function POST(req: NextRequest) {
  const { message } = await req.json();
  const model = genAI.getGenerativeModel({ model: "gemma-4-27b-it" });
 
  // ReadableStream でストリーミングレスポンスを実装
  const stream = new ReadableStream({
    async start(controller) {
      const encoder = new TextEncoder();
      
      const result = await model.generateContentStream(message);
      
      for await (const chunk of result.stream) {
        const text = chunk.text();
        if (text) {
          // SSE 形式で送信
          controller.enqueue(
            encoder.encode(`data: ${JSON.stringify({ text })}\n\n`)
          );
        }
      }
      
      controller.enqueue(encoder.encode("data: [DONE]\n\n"));
      controller.close();
    },
  });
 
  return new Response(stream, {
    headers: {
      "Content-Type": "text/event-stream",
      "Cache-Control": "no-cache",
      Connection: "keep-alive",
    },
  });
}

Antigravity IDE でのコーディング効率化テクニック

Gemma 4 APIの実装を進める中で、Antigravity IDEの機能を活用することで開発速度を大きく向上させられます。

AIチャットでコードを自動生成する

Antigravityのチャット画面(Cmd+L)で、プロジェクトのコンテキストを読み込ませてからコード生成を依頼するのが効果的です。

例: @app/api/gemma/route.ts
このAPIルートに、リクエストレート制限(1分間に10リクエストまで)を
追加してください。Next.jsのmiddlewareまたはAPIルート内での実装を提案してください。

Antigravityは既存のコードを理解した上で、適切な実装案を提示してくれます。

エラーログの自動解析

Gemma 4 APIの実装中に発生したエラーは、Antigravityのターミナルで Cmd+K を押してAIに解析させると、原因と解決策を即座に提示してくれます。

Antigravity × Gemma 4 APIのより深い活用

MCPサーバーを組み合わせることで、Gemma 4 APIをAntigravityエージェントの一部として組み込む高度な活用法も可能です。より詳細な実装パターンについては、Antigravity × カスタムMCPサーバー構築ガイド で解説しています。


よくあるエラーと対処法

エラー1: API_KEY_INVALID

Error: [GoogleGenerativeAI Error]: API key not valid.

原因: 環境変数が正しく読み込まれていないか、APIキーに誤りがあります。

対処法:

  • .env ファイルのパスが正しいか確認する(dotenv.config() の呼び出し位置に注意)
  • APIキーの前後に余分な空白や改行が含まれていないか確認する
  • AI StudioでAPIキーが有効であることを確認する

エラー2: RESOURCE_EXHAUSTED(クォータ超過)

Error: 429 RESOURCE_EXHAUSTED: Quota exceeded for quota metric

原因: APIのリクエスト制限に達しています。

対処法:

  • 無料プランでは1分間のリクエスト数に上限があります(Gemma 4-27b は 60 RPM)
  • 実装に指数バックオフ付きのリトライロジックを追加してください
import time
 
def chat_with_retry(prompt: str, max_retries: int = 3) -> str:
    """リトライロジック付きのAPIコール"""
    for attempt in range(max_retries):
        try:
            response = model.generate_content(prompt)
            return response.text
        except Exception as e:
            if "RESOURCE_EXHAUSTED" in str(e) and attempt < max_retries - 1:
                wait_time = 2 ** attempt  # 指数バックオフ: 1秒, 2秒, 4秒
                print(f"レート制限エラー。{wait_time}秒後にリトライします...")
                time.sleep(wait_time)
            else:
                raise
    return ""

エラー3: SAFETY_BLOCKED

Error: Response was blocked due to safety settings

原因: コンテンツが安全フィルターに引っかかりましました。

対処法: 入力プロンプトの表現を変えるか、セーフティ設定を調整します(ただし、プロダクション環境では安易な緩和は避けてください)。


2026年5月 最新アップデート情報

この記事を公開した4月以降の変更点と、実際に使っていて気づいたことを補足します。

APIクォータと料金の最新確認

Google AI Studio の無料枠のクォータ設定は定期的に変更されます。この記事に記載している Gemma 4-9b(1,000 RPD)、Gemma 4-27b(500 RPD)という数値は目安ですが、正確な現在値は Google AI Studio の料金ページ で確認してください。本番環境で一定以上のリクエスト数が見込まれる場合は、早めに Vertex AI への移行を計画しておくことをお勧めします。

Antigravity IDE との連携アップデート

2026年春以降、Antigravity IDE のアップデートが続き、AI コーディング支援機能が強化されています。ターミナルでの API テストに加え、Antigravity の AI アシスタントに対してエラーメッセージをそのまま貼り付けて「何が原因か」を聞きながらデバッグするワークフローが、個人的にもかなり使いやすくなりました。

Gemma 4 の回答精度をさらに引き上げたい場合は、システムインストラクションの最適化が有効です。Gemma 4 のシステムインストラクション最適化術 — Antigravity でローカルモデルの回答精度を引き上げるで具体的な手法を解説しています。

クラウド API のコストが気になり始めたら、Antigravity × Gemma 4 ハイブリッドAI戦略:クラウド費用を70%削減する実装マスタークラスも参考にしてください。ローカル実行とクラウド API を状況に応じて切り替えることで、品質を維持しながら運用コストを大きく下げられます。

まとめ

ここではAntigravityプロジェクトにGemma 4 APIを組み込む方法を以下の順で解説しました。

  • 環境準備: API キーの取得と .env を使った安全な管理
  • Python 実装: 基本チャット、ストリーミング、マルチターン会話
  • TypeScript 実装: 基本チャット、Next.js API Route、SSE ストリーミング
  • Antigravity 活用: AIチャットでのコード生成、エラーログ解析
  • エラー対処: API_KEY_INVALID・クォータ超過・安全フィルターへの対処法

Gemma 4はオープンソースでありながらトップクラスの性能を持つモデルです。Antigravity IDEと組み合わせることで、API実装のコーディングを大幅に効率化できます。まずは小さなスクリプトから始めて、徐々にアプリケーションに組み込んでいくことをお勧めします。

Gemma 4のアーキテクチャや日本語性能の詳細については、Gemma 4 完全ガイド 2026 もあわせてご覧ください。

シェア

お読みいただきありがとうございます

Antigravity Lab は広告なしで運営しており、サーバー費用などの運営コストはメンバーシップのご支援で賄っています。実装コード・ベンチマーク・本番設計パターンなど、実務でお役立ていただける記事を毎日更新しています。もし読んでよかったと感じていただけましたら、ぜひご覧ください。

  • コピー&ペーストで使える実装コード付き
  • 毎日新しい上級ガイドを追加
  • ¥580/月 または ¥1,480 の永久アクセス
メンバーシップを見る →

もしこの記事がお役に立ちましたら、チップ(¥150)で応援いただけると大変励みになります。広告なしでの運営を続けるため、皆さまのご支援が大きな力になっています。

関連記事

連携・プラグイン2026-05-04
Antigravity に Gemma 4 ローカルモデルを統合する — オフライン/エアギャップ環境での AI 開発
Apache 2.0でリリースされた Gemma 4 を Antigravity に統合することで、機密プロジェクトやオフライン環境でも Antigravity のエージェント体験が可能になります。Ollama / vLLM 経由の接続設定、Architect / Builder の挙動チューニング、本番運用の注意点までを実装ベースで解説します。
連携・プラグイン2026-04-24
Antigravity × Ollama — Gemma 4 をオフラインで走らせる 3 つの現場要件と実装パターン
Antigravity から Ollama 経由でローカル LLM(主に Gemma 4 系)を呼び出すための環境構築・プロトコル設計・実運用パターンを、オフライン開発・機密データ処理・推論コスト削減の 3 シナリオで解説します。
連携・プラグイン2026-04-25
Antigravity から Ollama・LM Studio に接続できないときの見直しポイント
Antigravity から Ollama や LM Studio のローカル LLM に接続できない問題を、ポート設定・CORS・モデル名・OpenAI 互換 API の観点から段階的に解決します。
📚RECOMMENDED BOOKS
大規模言語モデル入門
山田育矢
LLM開発
生成AIプロンプトエンジニアリング入門
我妻幸長
プロンプト
Claude CodeによるAI駆動開発入門
平川知秀
AI駆動開発
※ アフィリエイトリンクを含みます
もっと見る →