DEV Community

Cover image for Dapatkan API GPT-5.5 & Semua Model OpenAI Gratis Tanpa Batas
Walse
Walse

Posted on • Originally published at apidog.com

Dapatkan API GPT-5.5 & Semua Model OpenAI Gratis Tanpa Batas

GPT-5.5 dari OpenAI hadir dengan API berbayar: $5 per juta token input dan $30 per juta token output. Untuk proyek sampingan, hackathon, atau aplikasi publik gratis, biaya ini bisa menghentikan eksperimen sebelum dimulai. Puter.js menawarkan pola berbeda: akses katalog OpenAI seperti GPT-5.5, GPT-5.5 Pro, varian GPT-5.x, GPT-Image-2, DALL-E, dan OpenAI TTS tanpa kunci OpenAI. Pengguna akhir membayar penggunaan melalui akun Puter mereka, bukan Anda.

Coba Apidog hari ini

Intinya

  • Puter.js memberi akses ke model OpenAI tanpa kunci API, tanpa akun OpenAI, dan tanpa server backend.
  • Model teks yang didukung meliputi gpt-5.5, gpt-5.5-pro, gpt-5.4, gpt-5, gpt-5-mini, o1, o3, gpt-4.1, gpt-4o, plus varian chat dan codex.
  • Model gambar: gpt-image-2, gpt-image-1.5, dall-e-3.
  • Model TTS: gpt-4o-mini-tts, tts-1, tts-1-hd.
  • Integrasi minimal: satu tag <script> dan satu panggilan puter.ai.chat().
  • Streaming, function calling, vision input, image generation, dan text-to-speech dapat berjalan langsung di browser.
  • Pengguna akhir menanggung penggunaan dari akun Puter mereka; aplikasi Anda tidak membawa tagihan OpenAI.
  • Gunakan Apidog untuk membandingkan prompt terhadap Puter dan API resmi OpenAI saat merencanakan migrasi.

Cara kerja “gratis tak terbatas”

Puter.js mengubah model penagihan LLM. Biasanya, Anda menyimpan kunci OpenAI dan menanggung semua biaya token. Dengan Puter, pengguna akhir masuk ke Puter, lalu penggunaan AI dibebankan ke saldo akun mereka.

Dari sisi developer, hasilnya:

  • Tidak ada kunci OpenAI di repo. Tidak perlu mengelola secret, rotasi key, atau risiko kebocoran.
  • Tidak ada batas penggunaan di akun Anda. Setiap pengguna menggunakan akun Puter masing-masing.
  • Tidak ada tagihan OpenAI untuk aplikasi Anda. Anda tidak perlu menyiapkan billing OpenAI untuk prototipe browser.

Komprominya: Puter bersifat browser-first. Untuk job backend, cron, webhook handler, atau batch processing, API resmi OpenAI tetap jalur yang lebih tepat.

Langkah 1: Instalasi

Untuk prototipe cepat, gunakan CDN:

<script src="https://js.puter.com/v2/"></script>
Enter fullscreen mode Exit fullscreen mode

Contoh file HTML minimal:

<!DOCTYPE html>
<html>
<body>
  <script src="https://js.puter.com/v2/"></script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Untuk aplikasi yang dibundel dengan npm:

npm install @heyputer/puter.js
Enter fullscreen mode Exit fullscreen mode

Lalu import di kode JavaScript:

import { puter } from '@heyputer/puter.js';
Enter fullscreen mode Exit fullscreen mode

Gunakan CDN untuk situs statis, demo hackathon, atau ekstensi browser. Gunakan npm jika proyek Anda membutuhkan bundler dan tipe TypeScript.

Langkah 2: Pilih model

Puter mengekspos jajaran GPT-5.x dan model OpenAI yang lebih lama. Pilih model berdasarkan kebutuhan, bukan selalu yang paling besar.

ID Model Kapan digunakan
gpt-5.5-pro Penalaran paling berat, coding agent, analisis kompleks
gpt-5.5 Default harian untuk chat, reasoning, dan tugas umum
gpt-5.4-nano Klasifikasi volume tinggi, respons cepat, biaya rendah
gpt-5.4-mini UI chat ringan dan fitur AI dalam aplikasi
gpt-5.3-codex Tugas khusus kode
o3 Rantai penalaran kompleks
o1-pro Perencanaan multi-langkah
gpt-4.1, gpt-4o, gpt-4o-mini Baseline stabil dan umum digunakan

Model gambar:

  • gpt-image-2: terbaru, output tajam, cepat.
  • gpt-image-1.5, gpt-image-1, dall-e-3, dall-e-2: opsi lebih lama tetapi stabil.

Model text-to-speech:

  • gpt-4o-mini-tts: suara lebih alami.
  • tts-1, tts-1-hd: TTS klasik dengan latensi lebih rendah.

Langkah 3: Jalankan chat GPT-5.5

Contoh paling kecil:

<!DOCTYPE html>
<html>
<body>
  <script src="https://js.puter.com/v2/"></script>
  <script>
    puter.ai.chat(
      "Explain WebSockets in three sentences",
      { model: "gpt-5.5" }
    ).then(response => {
      puter.print(response);
    });
  </script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Buka file tersebut di browser. Puter akan menangani sesi pengguna, autentikasi, dan pemanggilan model. Anda tidak perlu membuat backend, environment variable, atau proxy API.

Langkah 4: Streaming respons

Untuk UI chat, gunakan streaming agar pengguna melihat output muncul bertahap.

const response = await puter.ai.chat(
  "Explain the theory of relativity in detail",
  {
    model: "gpt-5.5",
    stream: true
  }
);

for await (const part of response) {
  puter.print(part?.text);
}
Enter fullscreen mode Exit fullscreen mode

Di aplikasi nyata, ganti puter.print() dengan update ke elemen UI:

const output = document.querySelector("#output");

for await (const part of response) {
  output.textContent += part?.text ?? "";
}
Enter fullscreen mode Exit fullscreen mode

Contoh HTML-nya:

<div id="output"></div>
Enter fullscreen mode Exit fullscreen mode

Langkah 5: Vision input dengan gambar

Untuk meminta model menganalisis gambar, kirim prompt, URL gambar, dan opsi model:

puter.ai.chat(
  "What do you see in this image? Describe colors, objects, and mood.",
  "https://assets.puter.site/doge.jpeg",
  { model: "gpt-5.5" }
).then(response => {
  puter.print(response);
});
Enter fullscreen mode Exit fullscreen mode

Kasus penggunaan praktis:

  • membuat alt text otomatis,
  • menganalisis screenshot,
  • QA visual,
  • OCR ringan,
  • fitur aksesibilitas.

Langkah 6: Generate gambar

Gunakan puter.ai.txt2img() untuk membuat gambar dari prompt. Fungsi ini mengembalikan elemen <img> yang siap ditempel ke DOM.

puter.ai.txt2img(
  "A futuristic cityscape at night, cinematic, neon, rain",
  { model: "gpt-image-2" }
).then(imageElement => {
  document.body.appendChild(imageElement);
});
Enter fullscreen mode Exit fullscreen mode

Untuk aplikasi publik, tambahkan kontrol agar pengguna tidak memicu generasi berulang tanpa sengaja, misalnya disable tombol selama proses berjalan:

const button = document.querySelector("#generate");

button.addEventListener("click", async () => {
  button.disabled = true;

  try {
    const image = await puter.ai.txt2img(
      "A futuristic cityscape at night, cinematic, neon, rain",
      { model: "gpt-image-2" }
    );

    document.body.appendChild(image);
  } finally {
    button.disabled = false;
  }
});
Enter fullscreen mode Exit fullscreen mode

Langkah 7: Text-to-speech

Gunakan txt2speech() untuk menghasilkan audio. Fungsi ini mengembalikan elemen <audio>.

puter.ai.txt2speech(
  "Welcome back. Your account balance is $1,247.50.",
  {
    provider: "openai",
    model: "gpt-4o-mini-tts"
  }
).then(audio => {
  audio.setAttribute("controls", "");
  document.body.appendChild(audio);
});
Enter fullscreen mode Exit fullscreen mode

Gunakan TTS untuk:

  • voice prompt,
  • narasi onboarding,
  • pengisi suara aplikasi,
  • ringkasan audio,
  • fitur aksesibilitas.

Langkah 8: Function calling

Puter mengikuti bentuk function calling OpenAI. Anda mendeklarasikan tool, model menghasilkan tool_calls, lalu aplikasi Anda mengeksekusi fungsi yang sesuai.

const tools = [
  {
    type: "function",
    function: {
      name: "get_weather",
      description: "Get the current weather for a city.",
      parameters: {
        type: "object",
        properties: {
          city: {
            type: "string"
          }
        },
        required: ["city"]
      }
    }
  }
];

const response = await puter.ai.chat(
  "What's the weather in Tokyo right now?",
  {
    model: "gpt-5.5",
    tools
  }
);

const toolCalls = response.message.tool_calls;

if (toolCalls?.length) {
  const call = toolCalls[0];

  console.log(call.function.name);
  console.log(call.function.arguments);

  // Jalankan fungsi Anda sendiri di sini.
}
Enter fullscreen mode Exit fullscreen mode

Contoh eksekusi lokal sederhana:

function get_weather({ city }) {
  return {
    city,
    temperature: "24°C",
    condition: "Cloudy"
  };
}

if (toolCalls?.length) {
  const args = JSON.parse(toolCalls[0].function.arguments);
  const result = get_weather(args);

  console.log(result);
}
Enter fullscreen mode Exit fullscreen mode

Bentuk ini mirip dengan OpenAI, sehingga definisi tool yang sudah Anda punya biasanya mudah dipindahkan. Untuk menguji alur berbasis tool dalam skenario produksi, lihat pengujian server MCP di Apidog.

Langkah 9: Atur temperature dan max_tokens

Kirim parameter OpenAI standar melalui objek opsi:

const response = await puter.ai.chat(
  "Tell me about Mars",
  {
    model: "gpt-5.5",
    temperature: 0.2,
    max_tokens: 200
  }
);
Enter fullscreen mode Exit fullscreen mode

Panduan praktis:

  • Gunakan temperature: 0.0 sampai 0.3 untuk jawaban faktual.
  • Gunakan temperature: 0.7 sampai 1.0 untuk penulisan kreatif.
  • Gunakan max_tokens untuk membatasi panjang output dan menjaga penggunaan tetap terkendali.

Untuk aplikasi publik, selalu tentukan batas output:

const options = {
  model: "gpt-5.5",
  temperature: 0.2,
  max_tokens: 300
};
Enter fullscreen mode Exit fullscreen mode

Apa yang Anda dapatkan dan apa yang tidak

Akses Puter berguna untuk aplikasi browser, tetapi tidak identik dengan seluruh permukaan API resmi OpenAI.

Anda mendapatkan:

  • katalog GPT-5.x termasuk 5.5, 5.5 Pro, 5.4 mini/nano/pro, dan varian codex,
  • model OpenAI lebih lama seperti GPT-4.1, GPT-4o, o1, dan o3,
  • GPT-Image-2 dan DALL-E untuk pembuatan gambar,
  • jajaran OpenAI TTS termasuk gpt-4o-mini-tts,
  • streaming,
  • vision input,
  • function calling,
  • kontrol temperature,
  • kontrol max_tokens.

Anda mungkin tidak mendapatkan:

  • Responses API,
  • pengurangan biaya dari prompt caching,
  • Files API untuk konteks dokumen yang diunggah,
  • penggunaan server-side tanpa sesi browser,
  • header rate limit langsung dari OpenAI,
  • structured output OpenAI dengan enforcement skema JSON penuh.

Jika Anda membutuhkan pipeline produksi server-side, API resmi OpenAI lebih tepat. Jika targetnya adalah prototipe browser, situs statis, tool publik, atau aplikasi hackathon, Puter cukup praktis.

Kapan menggunakan Puter vs API resmi OpenAI

Gunakan Puter ketika:

  • Anda membuat aplikasi publik gratis dan tidak ingin menanggung tagihan token.
  • Anda membuat prototipe tanpa setup billing OpenAI.
  • Anda ingin menjalankan AI dari situs statis atau ekstensi browser.
  • Anda tidak ingin menyimpan API key di frontend.
  • Pengguna Anda bersedia masuk ke Puter.

Gunakan API resmi OpenAI ketika:

  • Anda butuh panggilan server-side seperti cron, webhook, atau batch job.
  • Anda butuh prompt caching untuk prompt sistem yang besar dan stabil.
  • Anda butuh Responses API, Files API, atau structured output lengkap.
  • Anda punya kebutuhan kepatuhan dan kontrak.
  • Pengguna tidak boleh melihat langkah login Puter.

Strategi umum: mulai dengan Puter untuk validasi produk, lalu migrasi ke API resmi OpenAI saat kebutuhan backend, kontrol, atau compliance mulai muncul.

Untuk setup produksi berbayar, lihat Cara menggunakan API GPT-5.5.

Menguji integrasi di Apidog

Panggilan Puter berjalan di browser, jadi pendekatan testing-nya berbeda dari API backend biasa. Pola yang bisa digunakan:

  1. Buat halaman statis kecil yang menjalankan Puter.
  2. Terima prompt melalui query parameter.
  3. Jalankan prompt yang sama terhadap API resmi OpenAI di environment terpisah.
  4. Simpan konfigurasi Puter dan OpenAI dalam koleksi Apidog yang sama untuk memudahkan migrasi.

Contoh halaman statis:

<!DOCTYPE html>
<html>
<body>
  <pre id="output"></pre>

  <script src="https://js.puter.com/v2/"></script>
  <script>
    const params = new URLSearchParams(window.location.search);
    const prompt = params.get("prompt") ?? "Say hello";

    puter.ai.chat(prompt, { model: "gpt-5.5" })
      .then(response => {
        document.querySelector("#output").textContent = response;
      });
  </script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Jalankan lokal:

npx serve .
Enter fullscreen mode Exit fullscreen mode

Lalu akses:

http://localhost:3000?prompt=Explain%20WebSockets
Enter fullscreen mode Exit fullscreen mode

Unduh Apidog, lalu siapkan dua environment:

  • puter-prototype: URL localhost yang menghosting halaman Puter.
  • openai-prod: https://api.openai.com/v1.

Dengan cara ini, Anda bisa menjaga prompt, skenario test, dan rencana migrasi tetap berada dalam satu workspace. Untuk pola testing API yang lebih luas, lihat tool pengujian API untuk insinyur QA.

FAQ

Apakah ini benar-benar tidak terbatas?

Tidak terbatas dari sisi developer. Pengguna akhir tetap menggunakan saldo akun Puter mereka. Akun baru mendapatkan kredit awal dan pengguna dapat mengisi ulang jika perlu.

Apakah saya memerlukan akun OpenAI?

Tidak. Puter menangani hubungan dengan OpenAI. Anda tidak perlu melihat atau menyimpan kunci OpenAI.

Bisakah digunakan di produksi?

Ya, untuk aplikasi berbasis browser. Pertanyaan utamanya adalah apakah pengguna Anda bersedia masuk ke Puter.

Apakah output GPT-5.5 melalui Puter identik dengan API resmi?

Model yang dipanggil sama, tetapi Puter menambahkan lapisan di antara browser dan OpenAI. Latensi bisa berbeda karena ada hop tambahan.

Bagaimana dengan prompt caching?

Puter tidak mengekspos kontrol harga prompt caching OpenAI saat ini. Jika Anda bergantung pada prompt caching untuk menghemat biaya, gunakan API resmi.

Bisakah digunakan di backend?

Tidak secara bersih. Puter browser-first dan mengasumsikan sesi pengguna. Untuk backend service, gunakan API resmi OpenAI. Untuk opsi server-side gratis, lihat Cara menggunakan API GPT-5.5 secara gratis.

Model apa yang sebaiknya digunakan sebagai default?

Gunakan gpt-5.5 untuk reasoning harian, gpt-5.4-nano untuk klasifikasi volume tinggi, gpt-5.5-pro untuk reasoning sulit, dan o3 untuk rantai penalaran panjang.

Apakah pengguna akan dikenakan biaya besar?

Untuk penggunaan chat biasa, biaya umumnya kecil per sesi. Pembuatan gambar biasanya lebih mahal. Batasi max_tokens, hindari retry yang tidak perlu, dan beri feedback UI saat proses sedang berjalan.

Bisakah membuat gambar dengan Puter?

Ya. Gunakan txt2img dengan gpt-image-2 atau DALL-E. Pengguna membayar biaya pembuatan gambar dari saldo Puter mereka. Untuk panduan API resmi, lihat Cara menggunakan API GPT-Image-2.

Kesimpulan

Puter.js adalah cara cepat untuk menambahkan kemampuan OpenAI ke aplikasi browser tanpa menyimpan API key dan tanpa membawa tagihan token di sisi developer. Tambahkan script, pilih model, kirim prompt, lalu tampilkan respons ke UI.

Untuk workload server-side, prompt caching, Responses API, Files API, atau structured output penuh, gunakan API resmi OpenAI. Untuk prototipe, hackathon, situs statis, ekstensi browser, dan aplikasi publik gratis, Puter adalah opsi yang praktis.

Buat request sekali di Apidog, bandingkan Puter dengan API resmi, lalu pilih jalur yang paling sesuai dengan arsitektur aplikasi Anda.

Top comments (0)