DEV Community

Cover image for 무료 GPT-5.5 API 및 모든 OpenAI 모델 무제한 사용
Rihpig
Rihpig

Posted on • Originally published at apidog.com

무료 GPT-5.5 API 및 모든 OpenAI 모델 무제한 사용

OpenAI의 GPT-5.5는 유료 API와 함께 제공됩니다. 입력 토큰 100만 개당 5달러, 출력 토큰 100만 개당 30달러가 필요합니다. 사이드 프로젝트, 해커톤 빌드, 무료 공개 앱에서는 이 비용이 시작 장벽이 될 수 있습니다. Puter.js는 OpenAI 키 없이 GPT-5.5, GPT-5.5 Pro, GPT-5.x 변형, GPT-Image-2, DALL-E, OpenAI TTS를 브라우저에서 사용할 수 있게 하며, 비용은 개발자가 아니라 최종 사용자의 Puter 계정에 귀속됩니다.

오늘 Apidog를 사용해 보세요

요약

  • Puter.js는 OpenAI API 키, OpenAI 계정, 서버 없이 브라우저에서 OpenAI 모델을 호출할 수 있게 합니다.
  • 지원 텍스트 모델에는 gpt-5.5, gpt-5.5-pro, gpt-5.4, gpt-5, gpt-5-mini, o1, o3, gpt-4.1, gpt-4o가 포함됩니다.
  • 이미지 모델: gpt-image-2, gpt-image-1.5, dall-e-3
  • TTS 모델: gpt-4o-mini-tts, tts-1, tts-1-hd
  • 기본 사용법은 <script> 태그 추가 후 puter.ai.chat() 호출입니다.
  • 스트리밍, 함수 호출, 비전 입력, 이미지 생성, 텍스트 음성 변환을 브라우저에서 처리할 수 있습니다.
  • 사용량은 최종 사용자의 Puter 계정에서 차감됩니다.
  • 마이그레이션 전에는 Apidog를 사용해 Puter 호출과 공식 OpenAI API 호출을 같은 프롬프트로 비교하세요.

Puter.js의 “무료 무제한” 구조

Puter.js는 일반적인 LLM 과금 흐름을 바꿉니다.

보통은 개발자가 OpenAI API 키를 만들고, 모든 사용자 요청의 토큰 비용을 부담합니다. Puter.js에서는 사용자가 Puter에 로그인하고, 해당 사용자의 Puter 계정에서 사용량이 차감됩니다.

개발자 입장에서 얻는 이점은 다음과 같습니다.

  • OpenAI API 키를 저장하지 않아도 됩니다.

    .env, 서버 시크릿, 키 로테이션, 키 유출 대응이 필요 없습니다.

  • 서버 없이 브라우저에서 바로 호출할 수 있습니다.

    정적 HTML, Vite/React 앱, 브라우저 확장 프로그램, 해커톤 데모에 적합합니다.

  • 개발자 계정 기준 사용량 제한을 직접 부담하지 않습니다.

    각 사용자가 자신의 Puter 계정으로 사용량을 처리합니다.

단점도 명확합니다.

Puter.js는 브라우저 우선 방식입니다. 로그인된 사용자 세션을 전제로 하므로 백엔드 Node.js 배치 작업, 크론 작업, 웹훅 핸들러 같은 서버 측 워크로드에는 공식 OpenAI API가 더 적합합니다.

1단계: Puter.js 설치

가장 빠른 방법은 CDN 스크립트를 추가하는 것입니다.

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

정적 HTML 파일이라면 이것만으로 충분합니다.

번들러 기반 앱에서는 NPM 패키지를 사용할 수 있습니다.

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

선택 기준은 간단합니다.

환경 권장 방식
단일 HTML 파일 CDN
해커톤 프로토타입 CDN
정적 사이트 CDN
React/Vue/Svelte 앱 NPM
TypeScript 타입이 필요한 앱 NPM

2단계: 사용할 모델 선택

Puter는 GPT-5.x 라인업과 이전 OpenAI 모델을 노출합니다. 작업 유형에 따라 모델을 선택하세요.

모델 ID 사용 시기
gpt-5.5-pro 복잡한 추론, 코딩 에이전트, 긴 분석
gpt-5.5 일반 채팅, 기본 추론, 대부분의 앱 기본값
gpt-5.4-nano 빠른 분류, 대량 텍스트 처리
gpt-5.4-mini 채팅 UI, 중간 난이도 작업
gpt-5.3-codex 코드 생성 및 코드 설명
o3 복잡한 추론 체인
o1-pro 에이전트식 다단계 계획
gpt-4.1, gpt-4o, gpt-4o-mini 안정적인 기준 모델

이미지 생성 모델:

  • gpt-image-2: 최신 이미지 생성 모델
  • gpt-image-1.5
  • gpt-image-1
  • dall-e-3
  • dall-e-2

텍스트 음성 변환 모델:

  • gpt-4o-mini-tts: 최신 TTS 모델
  • tts-1
  • tts-1-hd

3단계: GPT-5.5 호출하기

최소 예제는 다음과 같습니다.

<!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

이 파일을 브라우저에서 열면 다음 흐름으로 동작합니다.

  1. Puter.js가 로드됩니다.
  2. puter.ai.chat()이 GPT-5.5 호출을 생성합니다.
  3. 사용자가 Puter에 로그인하거나 계정을 생성합니다.
  4. 응답이 페이지에 출력됩니다.

API 키, 서버, 환경 변수 없이 실행할 수 있습니다.

4단계: 채팅 UI에 스트리밍 적용하기

긴 답변이나 챗봇 UI에서는 전체 응답을 기다리는 것보다 스트리밍이 더 자연스럽습니다.

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

실제 UI에서는 puter.print() 대신 DOM 요소에 이어 붙이면 됩니다.

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

const response = await puter.ai.chat(
  "React Server Components를 실무 관점에서 설명해줘",
  {
    model: "gpt-5.5",
    stream: true
  }
);

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

5단계: 이미지 입력으로 비전 기능 사용하기

이미지 URL을 함께 전달하면 모델이 이미지를 읽고 답변할 수 있습니다.

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

활용 예시는 다음과 같습니다.

  • 이미지 대체 텍스트 생성
  • 스크린샷 분석
  • OCR 기반 텍스트 추출
  • UI 버그 리포트 자동 요약
  • 접근성 도구

6단계: 이미지 생성하기

이미지 생성은 puter.ai.txt2img()를 사용합니다. 이 함수는 생성된 이미지가 포함된 <img> 요소를 반환합니다.

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

컨테이너에 렌더링하려면 다음처럼 작성할 수 있습니다.

<div id="image-result"></div>
Enter fullscreen mode Exit fullscreen mode 
const container = document.querySelector("#image-result");

puter.ai.txt2img(
  "A clean developer workspace with multiple monitors, flat illustration",
  { model: "gpt-image-2" }
).then(imageElement => {
  container.innerHTML = "";
  container.appendChild(imageElement);
});
Enter fullscreen mode Exit fullscreen mode

이미지 생성 비용은 사용자의 Puter 계정에서 처리됩니다. 공개 이미지 생성기를 만들 때 개발자가 직접 OpenAI 이미지 생성 비용을 부담하지 않아도 되는 구조입니다.

7단계: 텍스트를 음성으로 변환하기

OpenAI TTS 모델은 puter.ai.txt2speech()로 호출할 수 있습니다. 반환값은 생성된 음성을 포함하는 <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

사용 예시는 다음과 같습니다.

  • 앱 온보딩 음성 안내
  • 접근성 내레이션
  • 대시보드 알림 음성
  • 짧은 팟캐스트 인트로
  • 학습용 문장 읽기

8단계: 함수 호출 사용하기

Puter의 함수 호출 형식은 OpenAI의 도구 호출 형식과 유사합니다. 먼저 도구를 선언합니다.

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"]
    }
  }
}];
Enter fullscreen mode Exit fullscreen mode

모델에 도구를 전달합니다.

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

모델이 도구 호출을 반환하면 애플리케이션 쪽에서 실행합니다.

const toolCalls = response.message.tool_calls;

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

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

  // 여기에서 실제 get_weather 구현을 호출합니다.
}
Enter fullscreen mode Exit fullscreen mode

프로덕션에서 도구 기반 흐름을 검증하려면 Apidog에서 MCP 서버 테스트를 참고하세요.

9단계: temperature와 max_tokens 조정하기

Puter 호출에서도 표준 OpenAI 스타일의 옵션을 전달할 수 있습니다.

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

실무에서는 다음 기준으로 설정하세요.

옵션 추천 값 사용 상황
temperature: 0.0-0.3 낮음 사실 기반 답변, 요약, 분류
temperature: 0.7-1.0 높음 창의적 글쓰기, 아이디어 생성
max_tokens 제한 권장 호출당 비용과 응답 길이 제어

공개 앱에서는 max_tokens를 반드시 설정하는 편이 좋습니다. 사용자의 Puter 잔액을 과도하게 소모하는 긴 응답을 줄일 수 있습니다.

Puter에서 가능한 것과 제한되는 것

Puter.js는 브라우저 앱에 적합한 OpenAI 접근 경로를 제공합니다. 다만 공식 OpenAI API 전체를 완전히 대체하는 것은 아닙니다.

Puter에서 사용할 수 있는 기능:

  • GPT-5.5, GPT-5.5 Pro, GPT-5.4 계열
  • GPT-4.1, GPT-4o, o1, o3 등 이전 OpenAI 모델
  • GPT-Image-2 및 DALL-E 기반 이미지 생성
  • gpt-4o-mini-tts를 포함한 OpenAI TTS
  • 스트리밍
  • 비전 입력
  • 함수 호출
  • temperature
  • max_tokens

제한될 수 있는 기능:

  • Responses API
  • 프롬프트 캐싱 비용 절감
  • Files API
  • 브라우저 세션 없는 서버 측 호출
  • OpenAI에서 직접 제공하는 rate limit 헤더
  • OpenAI의 구조화된 출력 모드 및 JSON 스키마 강제 적용

브라우저 기반 프로토타입, 무료 공개 도구, 정적 사이트에는 Puter가 적합합니다. 서버 중심 워크로드나 엔터프라이즈 요구사항이 있다면 공식 OpenAI API를 사용하세요.

Puter와 공식 OpenAI API 선택 기준

Puter를 선택하기 좋은 경우

  • 무료 공개 앱을 만들고 있고 개발자가 API 비용을 부담하고 싶지 않을 때
  • 해커톤 또는 사이드 프로젝트를 빠르게 만들 때
  • OpenAI 계정과 결제 설정 없이 프로토타입을 만들고 싶을 때
  • 정적 사이트 또는 브라우저 확장 프로그램에서 바로 LLM을 호출하고 싶을 때
  • 사용자가 Puter 로그인 흐름을 수용할 수 있을 때

공식 OpenAI API를 선택해야 하는 경우

  • 서버 측 호출이 필요할 때
  • 크론 작업, 웹훅, 배치 처리가 필요할 때
  • 프롬프트 캐싱 비용 절감이 중요할 때
  • Responses API, Files API, 구조화된 출력이 필요할 때
  • BAA, SOC 2, 데이터 상주 같은 계약 및 컴플라이언스 요구가 있을 때
  • 사용자가 Puter 로그인 단계를 거치면 안 될 때

일반적인 전략은 Puter로 빠르게 프로토타입을 만들고, 서버 측 요구사항이나 API 표면 제약이 생기면 공식 OpenAI API로 마이그레이션하는 것입니다.

유료 프로덕션 설정은 GPT-5.5 API 사용 방법을 참고하세요.

Apidog에서 마이그레이션 테스트하기

Puter 호출은 브라우저에서 실행됩니다. 따라서 일반적인 백엔드 API 테스트 러너에서 Puter 호출 자체를 그대로 실행하기는 어렵습니다.

대신 다음 방식으로 정리하면 마이그레이션이 쉬워집니다.

  1. Puter 호출을 포함한 작은 정적 테스트 페이지를 만듭니다.
  2. 프롬프트를 쿼리 파라미터로 받을 수 있게 구성합니다.
  3. 공식 OpenAI API로 전환할 때 사용할 요청을 Apidog에 컬렉션으로 만듭니다.
  4. Puter 프로토타입과 OpenAI 프로덕션 환경을 별도 환경으로 관리합니다.

서로 다른 환경과 API 요청을 보여주는 Apidog 인터페이스 스크린샷.

Apidog를 다운로드한 뒤 환경을 두 개로 나누세요.

  • puter-prototype: Puter 테스트 페이지를 호스팅하는 localhost URL
  • openai-prod: https://api.openai.com/v1

이렇게 구성하면 같은 프롬프트와 메시지 구조를 기준으로 Puter 결과와 공식 OpenAI API 결과를 비교할 수 있습니다.

더 넓은 API 테스트 패턴은 QA 엔지니어를 위한 API 테스트 도구를 참고하세요.

자주 묻는 질문

정말 무제한인가요?

개발자 기준으로는 무제한입니다. 사용량은 최종 사용자의 Puter 계정에서 처리됩니다. 새 Puter 계정은 시작 크레딧을 받고, 더 많은 사용량이 필요하면 사용자가 충전할 수 있습니다.

OpenAI 계정이 필요한가요?

아니요. 개발자는 OpenAI API 키를 만들 필요가 없습니다. Puter가 OpenAI와의 연결을 처리합니다.

프로덕션에서 사용할 수 있나요?

브라우저 기반 앱이라면 사용할 수 있습니다. 핵심 판단 기준은 사용자가 Puter 로그인 흐름을 받아들일 수 있는지입니다.

Puter를 통한 GPT-5.5 출력은 공식 API와 동일한가요?

Puter는 사용자 대신 공식 OpenAI API를 호출합니다. 모델 동작은 동일한 모델을 기준으로 하지만, 추가 통신 단계 때문에 지연 시간이 약간 늘어날 수 있습니다.

프롬프트 캐싱 비용 절감도 사용할 수 있나요?

Puter는 현재 OpenAI의 프롬프트 캐싱 요금 제어를 노출하지 않습니다. 긴 고정 시스템 프롬프트를 자주 재사용하고 캐시 할인이 중요하다면 공식 OpenAI API를 사용하세요.

백엔드 서비스에서 사용할 수 있나요?

권장되지 않습니다. Puter는 브라우저 우선이며 사용자 세션을 전제로 합니다. 백엔드 서비스에는 공식 OpenAI API가 더 적합합니다.

무료 서버 측 옵션은 GPT-5.5 API를 무료로 사용하는 방법을 참고하세요.

기본 모델은 무엇을 쓰면 되나요?

  • 일반 추론: gpt-5.5
  • 대량 분류: gpt-5.4-nano
  • 어려운 추론: gpt-5.5-pro
  • 긴 추론 체인: o3

사용자에게 비용이 많이 청구되나요?

대부분의 채팅형 사용은 세션당 몇 센트 수준입니다. 다만 긴 응답이나 이미지 생성은 더 많은 잔액을 사용할 수 있습니다. 공개 앱에서는 max_tokens를 제한하고 불필요한 생성 호출을 줄이세요.

Puter로 이미지도 생성할 수 있나요?

네. txt2img()와 gpt-image-2 또는 DALL-E 계열 모델을 사용하면 됩니다. 이미지 생성 비용은 사용자의 Puter 잔액에서 처리됩니다.

공식 유료 API 가이드는 GPT-Image-2 API 사용 방법을 참고하세요.

마무리

Puter.js는 브라우저 기반 앱에서 OpenAI 모델을 빠르게 붙이는 실용적인 방법입니다. 스크립트를 추가하고, 모델을 선택하고, puter.ai.chat()을 호출하면 됩니다. API 키를 저장하지 않아도 되고, 개발자가 직접 토큰 비용을 부담하지 않아도 됩니다.

다만 서버 측 워크로드, 프롬프트 캐싱, Responses API, Files API, 구조화된 출력이 필요하다면 공식 OpenAI API를 선택해야 합니다.

프로토타입은 Puter로 빠르게 만들고, 프로덕션 전환 시점에는 Apidog에서 요청을 정리해 공식 API와 비교하세요.

Top comments (0)