Simple Chromium AI: Chrome 브라우저의 내장 AI API를 쉽게 사용하기 위한 경량 래퍼(wrapper)

Simple Chromium AI 소개

웹 브라우저, 특히 크롬은 최근 AI 기능을 실험적으로 도입하고 있으며, 사용자가 브라우저 내부에서 직접 프롬프트를 통해 AI와 상호작용할 수 있도록 API를 제공하고 있습니다. 구글 크롬은 ‘Prompt API for Gemini Nano’라는 새로운 기능을 통해 이를 실현하고 있으며, 이 기능을 활용하면 브라우저 확장 프로그램에서 AI를 호출하는 작업이 가능합니다. 그러나 기본 API는 초기화나 세션 관리가 다소 복잡하고, 오류 처리도 직접 구현해야 하기 때문에 일반 개발자가 쉽게 접근하기 어렵다는 단점이 존재합니다.

이러한 상황에서 등장한 것이 바로 Simple Chromium AI입니다. 이 프로젝트는 TypeScript로 작성된 경량 래퍼(wrapper)로, 크롬의 내장 AI API를 보다 간단하게 사용할 수 있도록 설계되었습니다. 특히 Type-safe 초기화, 자동 오류 처리, 간편화된 함수 호출 방식 등으로 구성되어 있어, 초심자도 빠르게 적용할 수 있도록 돕습니다. 더불어, 예외 발생 대신 Result 타입을 반환하는 Safe API를 지원함으로써 안정적인 운영도 가능합니다.

크롬의 기본 Prompt API는 매우 강력한 기능을 제공하지만, 다음과 같은 단점이 있습니다. 첫째, API 사용 전 초기화와 세션 생성 과정을 명확히 따라야 하며, 이 과정에서 많은 boilerplate 코드가 발생합니다. 둘째, 예외 처리 로직이 분산되어 있어 실수나 오류가 발생하기 쉽습니다. 셋째, 타입스크립트에서 type-safe하지 않기 때문에 컴파일 단계에서 문제를 확인하기 어렵습니다.

반면, Simple Chromium AI는 초기화와 프롬프트 호출을 하나의 함수로 추상화하여 간결한 코드 구현을 가능하게 하며, 타입 검증을 철저히 적용해 런타임 오류를 줄여줍니다. 또한 모든 기능에 대해 Safe 버전을 제공하여 try-catch 없이도 오류를 제어할 수 있습니다. 단점은 스트리밍 응답을 처리하지 못한다는 점으로, 실시간 피드백이 필요한 경우에는 Native API를 직접 사용하는 것이 바람직합니다.

Simple Chromium AI의 주요 기능 및 활용

설치 및 초기화

먼저 프로젝트를 설치하려면 다음 명령어를 실행합니다:

npm install simple-chromium-ai

사용 시에는 다음과 같이 AI 인스턴스를 초기화하고 프롬프트를 호출할 수 있습니다:

import ChromiumAI from 'simple-chromium-ai';

const ai = await ChromiumAI.initialize("You are a helpful assistant");
const response = await ChromiumAI.prompt(ai, "Write a haiku");

또한 Safe API를 활용하면 다음과 같이 오류를 보다 우아하게 처리할 수 있습니다:

const safeResult = await ChromiumAI.Safe.initialize("You are a helpful assistant");
safeResult.match(
  async (ai) => {
    const safeResponse = await ChromiumAI.Safe.prompt(ai, "Write a haiku");
    safeResponse.match(
      (value) => console.log(value),
      (error) => console.error(error.message)
    );
  },
  (error) => console.error(error.message)
);

크롬 AI 사용 전 필수 조건

Simple Chromium AI API는 브라우저 확장 프로그램 내부에서만 사용할 수 있으며, 크롬 138 이상 또는 해당 Chromium 브라우저에서 동작합니다. 다음과 같은 준비 작업이 필요합니다:

  • chrome://flags에서 Prompt API for Gemini Nano 활성화
  • chrome://components에서 Optimization Guide On Device Model 업데이트 (약 4GB 다운로드 필요)
  • Chrome EPP 가입 필요

이와 같은 조건이 충족되지 않으면 오류 메시지에 자세한 안내가 포함됩니다.

세션 관리 및 연속 프롬프트

세션 기능을 활용하면 하나의 대화 흐름을 유지할 수 있습니다:

const session = await ChromiumAI.createSession(ai);
const response1 = await session.prompt("Hello");
const response2 = await session.prompt("Follow up");
session.destroy();

또는 다음과 같이 자동 세션 정리 기능을 사용할 수 있습니다:

const result = await ChromiumAI.withSession(ai, async (session) => {
  return await session.prompt("Hello");
});

토큰 사용량 확인

API를 사용하기 전 토큰 한도를 초과하지 않도록 확인할 수 있습니다:

const usage = await ChromiumAI.checkTokenUsage(ai, "Long text...");
console.log(`Will fit: ${usage.willFit}`);

구조화된 응답과 제약조건

프롬프트에 JSON 스키마를 설정하여 구조화된 출력(structured output)을 받을 수 있습니다:

const schema = {
  type: "object",
  properties: {
    sentiment: { type: "string", enum: ["positive", "negative", "neutral"] },
    confidence: { type: "number", minimum: 0, maximum: 1 },
    keywords: { type: "array", items: { type: "string" }, maxItems: 5 }
  },
  required: ["sentiment", "confidence", "keywords"]
};

const response = await ChromiumAI.prompt(
  ai,
  "Analyze the sentiment of this text: 'I love this new feature!'",
  undefined,
  { responseConstraint: schema }
);

const result = JSON.parse(response);
console.log(result);

취소 가능한 프롬프트

AbortController를 이용하면 긴 응답을 도중에 취소할 수 있습니다:

const controller = new AbortController();
cancelButton.onclick = () => controller.abort();

try {
  const response = await ChromiumAI.prompt(
    ai,
    "Write a detailed analysis...",
    undefined,
    { signal: controller.signal }
  );
  console.log(response);
} catch (error) {
  if (error.name === 'AbortError') {
    console.log('Prompt was cancelled by user');
  }
}

데모 확장 프로그램 제공

GitHub 저장소의 demo 디렉토리에는 이 래퍼를 활용한 Chrome 확장 예제가 포함되어 있으며, AI 사용 가능 여부 확인, 간단한 프롬프트 인터페이스를 시연합니다.

cd demo
npm install
npm run build

이후, 크롬에서 확장 프로그램으로 demo 디렉토리를 로드하면 됩니다.

라이선스

Simple Chromium AI 프로젝트는 MIT로 공개 및 배포 되고 있습니다. 상업적 이용에 대한 제한은 없으며 자유롭게 수정 및 재배포가 가능합니다.

:github: Simple Chromium AI 프로젝트 GitHub 저장소

더 읽어보기: Chrome AI Prompt API 문서




이 글은 GPT 모델로 정리한 글을 바탕으로 한 것으로, 원문의 내용 또는 의도와 다르게 정리된 내용이 있을 수 있습니다. 관심있는 내용이시라면 원문도 함께 참고해주세요! 읽으시면서 어색하거나 잘못된 내용을 발견하시면 덧글로 알려주시기를 부탁드립니다. :hugs:

:pytorch:파이토치 한국 사용자 모임:south_korea:이 정리한 이 글이 유용하셨나요? 회원으로 가입하시면 주요 글들을 이메일:love_letter:로 보내드립니다! (기본은 Weekly지만 Daily로 변경도 가능합니다.)

:wrapped_gift: 아래:down_right_arrow:쪽에 좋아요:+1:를 눌러주시면 새로운 소식들을 정리하고 공유하는데 힘이 됩니다~ :star_struck: