Advanced Tutorial

API Integration: Nano Banana with Google AI Studio & Vertex AI

Integrate Nano Banana's state-of-the-art AI image editing into your apps. This guide covers authentication, request formats, code examples (Node.js & Python), rate limits, error handling, and production best practices using Google AI Studio and Vertex AI.

Advanced
4.8 (241 reviews)
15 min
9.6k views
DER
Dr. Emily Rodriguez
AI Research Specialist & Google Developer Expert
18.2k followers • Applied GenAI, Computer Vision
API IntegrationGoogle AI StudioVertex AISecurityProduction
Reading Progress0%

Overview & When to Use

API integration unlocks automated, repeatable, and scalable Nano Banana workflows for web apps, creative tools, and production pipelines. Use it when you need consistent edits at scale, user-facing features, or server-side control.

Batch Processing
Automate thousands of edits for catalogs and archives.
Creative Apps
Embed Nano Banana into editors with user prompts.
Consistency
Enforce preservation rules and audit trails.

Choose Your Integration Path

Dev Friendly
Google AI Studio
Best for prototyping, internal tools, and small-to-medium workloads
  • • Quick setup, UI playground, generous free tier
  • • API keys via AI Studio; simple client SDKs
  • • Ideal for prompt development and testing
Production Ready
Vertex AI
Enterprise-grade platform with governance and scale
  • • IAM, VPC-SC, CMEK, audit logs
  • • Quotas, monitoring, regional control
  • • Suitable for regulated environments

Authentication & Setup

AI Studio (API Key)
  1. Create an API key in AI Studio
  2. Store it in an environment variable (never commit keys)
  3. Use client SDKs to call Gemini Native Image
Vertex AI (Service Account)
  1. Create a service account with minimal roles
  2. Authenticate via ADC or JSON key (server-side only)
  3. Call the Vertex AI Images API with regional endpoints

Security Tip

Use per-environment keys, rotate regularly, and proxy calls from your server to avoid exposing credentials in the browser.

Request Format & Media Inputs

Send your instruction and media. Keep prompts explicit about what to change and what to preserve.

{
  "model": "gemini-2.5-flash",
  "input": [
    "Change the background to a sunset beach while keeping the person identical",
    { "inlineData": { "data": "<base64 image>", "mimeType": "image/jpeg" } }
  ]
}
Supported Inputs
JPEG/PNG images; URLs or inline base64; multiple references allowed.
Response
Image bytes or URL depending on platform and SDK.

Quickstart Code (Node & Python)

Node.js (AI Studio SDK)
Example calling Gemini 2.5 Flash with an image and instruction
import { GoogleGenerativeAI } from '@google/generative-ai'

const genAI = new GoogleGenerativeAI(process.env.GOOGLE_API_KEY!)
const model = genAI.getGenerativeModel({ model: 'gemini-2.5-flash' })

export async function editImage(imageBase64: string, prompt: string) {
  const result = await model.generateContent([
    prompt,
    { inlineData: { data: imageBase64, mimeType: 'image/jpeg' } },
  ])
  return result.response
}
Python (Vertex AI)
Server-side example using service account auth
from google.cloud import aiplatform
from vertexai.preview.vision_models import ImageGenerationModel

def edit_image(image_bytes: bytes, prompt: str):
    aiplatform.init(project='YOUR_PROJECT', location='us-central1')
    model = ImageGenerationModel.from_pretrained('imagegeneration@002')
    result = model.edit_image(
        prompt=prompt,
        image=image_bytes,
        mime_type='image/jpeg',
    )
    return result
cURL (REST)
Useful for smoke tests and automation
curl -X POST   -H "Authorization: Bearer $ACCESS_TOKEN"   -H "Content-Type: application/json"   https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent   -d '{
    "contents": [{
      "parts": [
        {"text": "Change background to a sunset beach; keep the person identical"},
        {"inline_data": {"mime_type": "image/jpeg", "data": "<base64>"}}
      ]
    }]
  }'

Errors, Retries & Timeouts

Common Errors

401 Unauthorized: invalid or missing credentials

429 Too Many Requests: back off and retry with jitter

413 Payload Too Large: compress or stream uploads

Retry Strategy
Use exponential backoff (e.g., 200ms → 400ms → 800ms, cap 5 retries) and client-side timeouts (e.g., 30–60s) for long edits.

Security & Production Checklist

Security
  • • Never expose API keys in the browser
  • • Rotate credentials and scope least privilege
  • • Validate file types and enforce size limits
  • • Log request IDs, not raw media
Operations
  • • Use regional endpoints close to users
  • • Cache non-personal results where allowed
  • • Monitor quotas and error rates
  • • Add fallbacks for partial outages

Ready for Production

Confirm SLOs, alerts, and data handling policies before launch.