Cara Mengintegrasikan Endpoint Gemini 2.5 Flash di AiStudio untuk Chatbot Kecepatan Tinggi

+-----------------------------------------------------------------------+
| SIKLUS PERSEPSI LATENSI INTERAKSI WEB                                 |
+-----------------------------------------------------------------------+
|  0 - 100 ms   : Terasa instan(responsivitas manipulasi UI langsung) |
|  100 - 300 ms : Batas persepsi percakapan manusiawi(Ideal TTFT)     |
|  300 - 1000 ms: Jeda terasa, namun alur kognitif pengguna tidak putus |
|  > 1000 ms    : Ilusi percakapan runtuh; pengguna beralih mode tunggu |
+-----------------------------------------------------------------------+

[ Pengguna Web / Mobile ]
           │
           │ HTTPS / WebSocket(SSE)
           ▼
[ Server Aplikasi / Backend ]
           │
           │ Request Terotentikasi(Bearer Key)
           ▼
┌─────────────────────────────────────────────────────────┐
│              AiStudio.id API Gateway                    │
│  - Edge Routing & Rate-Limit Shield                     │
│  - Observability & Token Metrics                        │
│  - Rupiah Billing & IAM Consolidation                   │
└─────────────────────────────────────────────────────────┘
           │
           │ Upstream Low-Latency Pipeline
           ▼
[ Google Gemini 2.5 Flash Engine ]

# .env
AISTUDIO_API_KEY=as-live-prod-8923fbc0912aa48d
AISTUDIO_BASE_URL=https://api.aistudio.id/v1
PORT=3000

npm install express dotenv
npm install -D typescript @types/express @types/node ts-node

// src/geminiService.ts
import dotenv from 'dotenv';
dotenv.config();

interface MessagePayload {
  role: 'system' | 'user' | 'assistant';
  content: string;
}

export async function createGeminiStream(
  messages: MessagePayload[],
  signal?: AbortSignal
): Promise<Response> {
  const apiKey = process.env.AISTUDIO_API_KEY;
  const baseUrl = process.env.AISTUDIO_BASE_URL || 'https://api.aistudio.id/v1';

  if (!apiKey) {
    throw new Error('AISTUDIO_API_KEY belum dikonfigurasi pada environment.');
  }

  // Mengirim request streaming ke Gateway AiStudio
  const response = await fetch(`${baseUrl}/chat/completions`, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': `Bearer ${apiKey}`,
    },
    body: JSON.stringify({
      model: 'gemini-2.5-flash',
      messages: messages,
      stream: true,
      temperature: 0.7,
      max_tokens: 1500,
    }),
    signal,
  });

  if (!response.ok) {
    const errorBody = await response.text();
    throw new Error(`Gateway Error [${response.status}]: ${errorBody}`);
  }

  return response;
}

// src/server.ts
import express, { Request, Response } from 'express';
import { createGeminiStream } from './geminiService';

const app = express();
app.use(express.json());

// Izinkan CORS untuk antarmuka web
app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization');
  if (req.method === 'OPTIONS') {
    return res.sendStatus(200);
  }
  next();
});

app.post('/api/chat', async (req: Request, res: Response) => {
  const { messages } = req.body;

  if (!messages || !Array.isArray(messages)) {
    return res.status(400).json({ error: 'Payload pesan tidak valid.' });
  }

  // Set header standar untuk Server-Sent Events
  res.setHeader('Content-Type', 'text/event-stream');
  res.setHeader('Cache-Control', 'no-cache');
  res.setHeader('Connection', 'keep-alive');
  res.setHeader('X-Accel-Buffering', 'no'); // Nonaktifkan buffer proxy reverse Nginx

  const abortController = new AbortController();

  // Jika klien memutuskan koneksi di tengah jalan, batalkan stream upstream
  req.on('close', () => {
    abortController.abort();
    res.end();
  });

  try {
    const upstreamResponse = await createGeminiStream(messages, abortController.signal);
    
    if (!upstreamResponse.body) {
      throw new Error('Tidak ada stream body dari upstream gateway.');
    }

    // Mengalirkan readable stream dari AiStudio Gateway langsung ke klien
    const reader = upstreamResponse.body.getReader();

    while (true) {
      const { done, value } = await reader.read();
      if (done) break;
      res.write(value);
    }

    res.end();
  } catch(error: any) {
    if (error.name === 'AbortError') {
      // Pembatalan normal oleh klien
      return;
    }
    console.error('Streaming Failure:', error.message);
    
    if (!res.headersSent) {
      res.status(500).json({ error: 'Gagal memproses streaming inferensi.' });
    } else {
      res.write(`data: ${JSON.stringify({ error: 'Terjadi pemutusan aliran data.' })}\n\n`);
      res.end();
    }
  }
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Chatbot Gateway aktif di port ${PORT}`);
});

// src/resilience.ts

interface RetryOptions {
  maxRetries?: number;
  initialDelayMs?: number;
  maxDelayMs?: number;
}

/**
 * Menjalankan operasi asinkron dengan proteksi Exponential Backoff + Full Jitter.
 */
export async function executeWithRetry<T>(
  fn: () => Promise<T>,
  options: RetryOptions = {}
): Promise<T> {
  const { maxRetries = 3, initialDelayMs = 400, maxDelayMs = 3000 } = options;

  let attempt = 0;

  while (attempt < maxRetries) {
    try {
      return await fn();
    } catch(error: any) {
      attempt++;
      
      // Identifikasi apakah error merupakan indikasi pembatasan rate-limit
      const isRateLimited = error.message?.includes('429') || error.status === 429;
      const isTransientError = error.status >= 500 && error.status < 600;

      if ((!isRateLimited && !isTransientError) || attempt >= maxRetries) {
        throw error;
      }

      // Hitung backoff bertahap: (2^attempt * base) + random jitter
      const exponentialDelay = Math.min(
        maxDelayMs,
        initialDelayMs * Math.pow(2, attempt)
      );
      const jitteredDelay = Math.random() * exponentialDelay;

      console.warn(
        `Rate limit terdeteksi. Mencoba ulang upaya ke-${attempt} dalam ${Math.round(jitteredDelay)}ms...`
      );

      await new Promise((resolve) => setTimeout(resolve, jitteredDelay));
    }
  }

  throw new Error('Batas maksimum retry tercapai.');
}

// public/chatClient.ts

interface ChatMessage {
  role: 'user' | 'assistant';
  content: string;
}

export class ChatStreamClient {
  private endpoint: string;

  constructor(endpoint: string) {
    this.endpoint = endpoint;
  }

  public async sendMessage(
    history: ChatMessage[],
    onTokenChunk: (token: string) => void,
    onComplete: () => void,
    onError: (err: Error) => void
  ): Promise<void> {
    try {
      const response = await fetch(this.endpoint, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ messages: history }),
      });

      if (!response.ok || !response.body) {
        throw new Error(`HTTP error! status: ${response.status}`);
      }

      const reader = response.body.getReader();
      const decoder = new TextDecoder('utf-8');
      let buffer = '';

      while (true) {
        const { done, value } = await reader.read();
        if (done) break;

        buffer += decoder.decode(value, { stream: true });
        const lines = buffer.split('\n');
        
        // Simpan sisa baris yang belum utuh di buffer
        buffer = lines.pop() || '';

        for (const line of lines) {
          const trimmed = line.trim();
          if (!trimmed || trimmed.startsWith(':')) continue; // Abaikan SSE ping/komentar

          if (trimmed === 'data: [DONE]') {
            onComplete();
            return;
          }

          if (trimmed.startsWith('data: ')) {
            try {
              const json = JSON.parse(trimmed.substring(6));
              const content = json.choices?.[0]?.delta?.content || '';
              if (content) {
                onTokenChunk(content);
              }
            } catch(e) {
              // Abaikan parsing sebagian payload jika terpotong
            }
          }
        }
      }

      onComplete();
    } catch(error: any) {
      onError(error);
    }
  }
}

+--------------------------------------------------------------------+
| PRAKTIK REKAYASA PROMPT BERORIENTASI LATENSI                        |
+--------------------------------------------------------------------+
| 1. Kompresi Aturan:                                                |
|    Gunakan format hierarkis ringkas(Markdown list), bukan narasi  |
|    panjang yang bertele-tele.                                      |
|                                                                    |
| 2. Pangkas Riwayat Percakapan(Sliding Window):                    |
|    Jangan kirim seluruh riwayat dari 2 jam lalu. Cukup sertakan    |
|    6-10 putaran interaksi terakhir untuk menjaga konteks aktif.    |
|                                                                    |
| 3. Determinisme Sampling:                                          |
|    Set `temperature` di rentang 0.2 - 0.7 untuk respon chat cepat  |
|    dan stabil. Hindari nilai ekstrem yang memicu regenerasi token  |
|    yang tidak perlu.                                               |
+--------------------------------------------------------------------+

<!-- BURUK: Terlalu deskriptif, menambah token prefill yang lambat diproses -->
Anda adalah asisten virtual yang sangat cerdas, ramah, dan bertugas membantu pelanggan 
menjawab pertanyaan mengenai produk kami dengan penuh kesabaran. Pastikan Anda menyapa 
mereka dengan salam hangat, menanyakan kabarnya, dan apabila Anda tidak mengetahui 
jawabannya, Anda harus meminta maaf sebesar-besarnya...

<!-- BAIK: Terstruktur, padat, langsung mengunci batasan model -->
Role: CS Ecommerce Tekstil.
Gaya: Lugas, solutif, santai.
Batasan:
- Maksimal respons 3 kalimat jika tidak diminta elaborasi.
- Jika data stok nihil, arahkan ke kontak CS WhatsApp: 0812-XXXX.
- Tolak menjawab topik di luar katalog produk perusahaan.