게시일: 2025년 5월 15일
대중은 뉴스 게시자가 지역, 국내, 국제 소식을 알리고 사려 깊은 관점을 공유하기를 기대합니다. 오늘날 빠르게 변화하는 환경에서 기사 요약은 복잡한 정보를 쉽게 이해할 수 있는 스니펫으로 압축하여 독자가 더 자세히 살펴볼 수 있도록 유도하는 핵심 전략입니다. Bright Sites와 Terra가 Summarizer API를 사용하여 이 전략에 접근하는 방법을 알아보세요.
| 설명하듯이 | 웹 | 확장 프로그램 | Chrome 상태 | 의도 |
|---|---|---|---|---|
| MDN | View | 배송 의도 |
요약 도구 API를 사용하면 문장, 단락, 글머리 기호 목록 등 다양한 길이와 형식으로 여러 유형의 요약을 생성할 수 있습니다. 이 API는 많은 기본 제공 AI API와 마찬가지로 대규모 언어 모델을 사용하여 추론을 실행합니다.
Bright Sites에서 The Standard에 맞춤형 기사 요약을 추가합니다.
Bright Sites의 선도적인 뉴스 게시 플랫폼인 Flow는 150개가 넘는 간행물을 지원합니다. Bright Sites는 Summarizer API를 AI 기반 CMS에 통합하여 The Standard(런던의 상징적인 뉴스 브랜드)가 독자에게 맞춤형 기사 요약을 제공할 수 있도록 지원합니다. 이를 통해 사용자는 기사에 참여하고 The Standard의 다른 기사로 재순환할 수 있습니다.
"Chrome에서 Gemini의 최첨단 모델을 사용하면 독자에게 최신 기술 혁신을 알리는 The Standard의 198년 전통과 신뢰할 수 있는 저널리즘을 손쉽게 이용할 수 있는 바쁜 독자의 요구를 충족할 수 있습니다. 독자가 자신의 기기에서 빌드된 요약을 사용하여 뉴스를 빠르게 확인할 수 있도록 하는 것은 Google이 The Standard를 재구상하고 독자의 디지털 습관을 중심으로 새로운 독자 중심 제품을 구축하는 방법 중 하나일 뿐입니다."
— 잭 라일리, The Standard 최고 디지털 책임자
클라이언트 측 AI 요약 기능을 제공하여 The Standard가 추가 비즈니스 비용을 발생시키지 않고 맞춤 요약을 생성할 수 있도록 했습니다. 요약 스타일이나 위치와 같은 데이터 포인트를 사용하여 클라이언트 측에서 이렇게 하면 인터넷 액세스가 끊겨도 사용자가 계속 읽을 수 있습니다. 노트북을 들고 런던 지하철을 이용하는 많은 사용자에게 자주 발생하는 문제입니다.
먼저 모델과 API의 지원 및 사용 가능 여부를 확인합니다.
// Check if the device supports built-in AI
// Trigger the model download if not yet available, on capable devices
export const deviceCheck = async () => {
const availability = await Summarizer.availability();
if (!availability || availability === 'unavailable') {
return {
summarizationAvailable: false,
message:
"AI summarization tools are not supported on this device" +
"or the appropriate permissions are not set.",
}
}
if (availability === 'downloadable') {
const shouldDownload = window.confirm(
`This page contains an AI summary, using an AI model provided by your
browser. Downloading the model, which could be multiple gigabytes in size,
is required to view the summary. Would you like to download the model?`);
if (!shouldDownload) {
return {
summarizationAvailable: false,
message: "User declined installation.",
}
}
// Trigger an installation
Summarizer.create();
return {
summarizationAvailable: false,
message: "Installing in the background. This may take a few minutes...",
}
}
if (availability === 'available') {
return {
summarizationAvailable: true,
message: "Ready for use.",
}
}
}
다음 함수는 향후 다른 온디바이스 모델이나 서버 측 모델을 사용할 수 있는 일반 요약기를 정의합니다.
/**
* Define the summarizer.
**/
export const aiSummarize = async (textToSummarize, options) => {
const availableSummarizationTools = getAvailableAiSummarizationTools()
if (availableSummarizationTools.has('builtInAi') && options?.builtInAI) {
// Generate the built-in AI summarizer and abort signal
const summarizer = await createBuiltInAISummarizer(options.builtInAi.options)
return await summarizer.summarize(textToSummarize, {
signal: options.builtInAi.signal,
})
}
throw new Error(
'AI summarization tools are not supported on this device or browser.',
)
}
표준은 맞춤 요약을 제공하기 위해 IndexedDB에 독자의 요약 환경설정을 저장합니다.
/**
* Log preferences in IndexDB for personalization
**/
abortController.current = new AbortController()
const preferencesDB = new PreferencesDB()
const summarization = await aiSummarize(articleContent, {
clientSideAI: {
options: await preferencesDB.getCreatesummarizerPreferences(),
signal: abortController.current.signal,
},
})
Terra에서 포르투갈어 기사에 수정 가능한 요약 제공
Terra는 브라질에서 가장 큰 콘텐츠 포털 중 하나로, 엔터테인먼트, 뉴스, 스포츠를 제공하며 월간 순 방문자 수가 5천만 명을 넘습니다. Terra는 기자가 포르투갈어로 뉴스 기사를 즉시 요약할 수 있도록 콘텐츠 관리 시스템 (CMS)에 요약 도구 API와 번역기 API를 추가했습니다. 그런 다음 기자는 스타일이나 정확성을 위해 몇 가지 수정 작업을 거쳐 공동으로 만든 요약을 게시하여 모든 독자가 쉽게 이용할 수 있도록 합니다.
Terra의 CMS는 이미 서버 측 LLM을 사용하고 있지만, 팀에서는 잠재적인 새로운 이점이 있는 별도의 접근 방식으로 클라이언트 측 AI를 살펴봤습니다. Chrome의 요약 도구 API가 서버 측 구현과 비슷한 품질을 제공한다는 것을 알게 되었습니다. 클라이언트 측 솔루션은 Translator API와 함께 사용했을 때 긍정적인 결과를 얻었습니다.
Terra는 주요 이점 때문에 Chrome의 내장 AI 구현을 채택했습니다. 클라이언트 측 AI는 비용 절감과 간소화된 데이터 거버넌스를 제공했습니다. 팀은 Summarizer API를 사용하여 콘텐츠 창 제한을 관리하는 것과 관련해 몇 가지 문제에 직면했지만 신중한 구현 관행을 통해 이를 극복할 수 있었습니다.
처음에 Terra는 요구사항을 해결하는 데 가장 적합한 요약 유형과 공유 컨텍스트를 결정하는 데 어려움을 겪었습니다. 실험을 통해 명확하고 유용한 영어 요약이 Translator API를 사용하여 포르투갈어로 비슷한 품질의 출력을 생성하는 데 중요하다는 것을 알게 되었습니다. 내장 AI Playground는 이러한 문제를 해결하는 데 큰 도움이 되었습니다. Terra는 매번 코드를 리팩터링하지 않고도 아이디어를 빠르게 테스트할 수 있었기 때문입니다.
다음 샘플에서는 Terra가 Summarizer API를 호출하고 사용할 수 없을 때 사용자에게 알리는 방법을 보여줍니다.
async function summarizerByBuiltInAI(text) {
if (!(Summarizer)) {
//Alert users in Portuguese that "Summarizer API is not available"
cms_alert(ALERT_TYPE_ERROR, "Summarizer API não está disponível.")
return null
}
try {
const availability = await Summarizer.availability();
if (availability !== 'available') {
cms_alert(ALERT_TYPE_ERROR, "Summarizer API não está disponível.")
return null
}
const summaryContext = "Avoid jargon, use correct grammar, focus on clarity," +
"and ensure the user can grasp the articles purpose," +
"without needing to open the original content.";
const options = {
sharedContext: summaryContext,
type: 'teaser',
format: 'plain-text',
length: 'long',
}
if (availability === 'available') {
const summarizer = await Summarizer.create(options);
return await summarizer.summarize(text, {
context: summaryContext
})
}
// return the download of the Summarizer Model
if(availability === 'downloadable'){
return await Summarizer.create();
}
} catch (error) {
//EN: "Error using the Summarizer API"
cms_alert(ALERT_TYPE_ERROR, "Erro ao usar o Summarizer API.");
console.error("Erro ao usar o Summarizer API:", error);
return null
}
}
또한 Terra는 요약 도구를 Translator API와 함께 사용하여 원본 포르투갈어 기사의 제목, 부제목, 본문 텍스트를 영어로 번역했습니다. 이 번역된 버전은 Summarizer API에 의해 처리되어 요약을 생성한 후 다시 포르투갈어로 번역됩니다. 이렇게 하면 사용자가 애플리케이션의 언어로 요약된 콘텐츠를 받을 수 있습니다.
async function translateTextByBuiltInAI(text, sourceLanguage, targetLanguage) {
if (!('translation' in self && 'createTranslator' in self.translation)) {
return null
}
try {
const translator = await Translator.create({
sourceLanguage,
targetLanguage,
})
return await translator.translate(text)
} catch (error) {
throw error
}
}
const text = `Title: ${contentTitle};\n\n Sub-title: ${contentSubtitle};\n\n Article content: ${plainText}.`;
const canTranslate = await Translator.availability({
sourceLanguage: 'pt',
targetLanguage: 'en',
})
if (canTranslate !== 'available') {
if (canTranslate === 'downloadable') {
try {
await Translator.create({
sourceLanguage: 'pt',
targetLanguage: 'en',
})
//EN: "Language download completed successfully."
cms_alert(ALERT_TYPE_OK, "Download do idioma concluído com sucesso.");
} catch (downloadError) {
//EN: "Error downloading the language required for translation."
cms_alert(ALERT_TYPE_ERROR, "Erro ao realizar download do idioma necessário para tradução.");
return
}
} else {
//EN: "Translation is not available or not ready."
cms_alert(ALERT_TYPE_ERROR, "A tradução não está disponível ou não está pronta.");
return
}
}
const translatedText = await translateTextByBuiltInAI(text, 'pt', 'en')
const summarizedText = await summarizerByBuiltInAI(translatedText)
const translatedBackText = await translateTextByBuiltInAI(summarizedText, 'en', 'pt')
Terra의 내장 AI API 성공적인 통합은 콘텐츠 관리 워크플로를 개선할 수 있는 클라이언트 측 AI의 상당한 잠재력을 보여줍니다. Terra는 Summarizer 및 Translator API를 통해 기자들의 역량을 강화하고 효율성을 개선했으며, 여러 플랫폼에서 향상된 사용자 경험을 제공할 수 있게 되었습니다.
권장사항
검토 입력이 토큰 한도를 초과하는 경우 다음 완화 조치를 따르세요.
- 최근 4개의 리뷰와 같은 더 작은 샘플을 API에 사용합니다. 이렇게 하면 더 빠른 결과를 생성할 수 있습니다. 클라이언트 측 요약 확장에 관한 안내를 참고하세요.
QuotaExceededError는 입력에서 요청된 토큰에 관한 추가 정보를 제공합니다.summarizer객체에는 API의 토큰 한도를 나타내는inputQuota속성이 있습니다. 이를 통해 입력이 한도를 초과하는 경우 실시간 피드백을 제공하고 기능을 사용 중지할 수 있습니다.
모든 사용자에게 원활한 환경을 제공하려면 하이브리드 방식을 고려하는 것이 좋습니다. 내장 AI API가 처음 호출되면 브라우저가 모델을 다운로드해야 합니다.
- Miravia는 모델이 다운로드되는 동안 서버 측 모델을 사용하여 초기 요약을 제공했습니다. 내장 모델이 준비되면 사이트에서 클라이언트 측 추론을 실행하도록 전환되었습니다.
항상 친근하고 커뮤니케이션이 가능한 인터페이스를 만들기 위해 노력해야 합니다.
- 모델 다운로드에 진행률 표시줄을 구현하고 응답 지연을 완화합니다.
- 모델 다운로드에 관한 투명성을 고려하세요. Bright Sites는 리소스 사용의 투명성과 동의를 위해 모델 다운로드에 관해 사용자에게 알렸습니다. 이렇게 하면 사용자가 계속 진행하기 전에 수락하거나 거부할 수 있습니다.
결론 및 권장사항
Bright Sites 및 Terra의 예는 콘텐츠 접근성과 독자 참여도를 높이는 데 Summarizer API가 얼마나 유용한지 보여줍니다. 이러한 플랫폼은 이 클라이언트 측 API를 사용하여 추가 비즈니스 비용 없이 간소화된 데이터 거버넌스로 읽기 환경과 맞춤설정을 개선했습니다. 요약 도구 API와 마찬가지로 모든 내장 AI API는 실용적인 클라이언트 측 AI를 지원합니다.
요약 도구 API가 다른 사용 사례에 어떻게 도움이 되는지 궁금하신가요? 요약 도구 API가 redBus와 Miravia가 유용한 사용자 리뷰 요약을 만드는 데 어떻게 도움이 되는지도 공유했습니다.
이 API로 새로운 것을 구축하고 있나요? X의@ChromiumDev 또는 LinkedIn의 Chromium for Developers에서 의견을 공유해 주세요.
리소스
- Summarizer API에 대해 자세히 알아보기
- Chrome에서 내장 API 사용 시작하기
- 블로거를 지원하는 프롬프트 API 우수사례를 읽어보세요.
- 번역 및 언어 감지기 우수사례를 읽어보세요.
- 요약 도구 API가 redBus와 Miravia가 유용한 사용자 리뷰 요약을 만드는 데 어떻게 도움이 되는지 알아보세요.
감사의 말씀
이 문서를 작성하고 검토하는 데 도움을 준 Terra의 Guilherme Moser와 Fernando Fischer, CWI의 Aline Souza, Brian Alford, Keval Patel, Jack Riley 및 Brightsites 엔지니어링팀, Swetha Gopalakrishnan, Alexandra Klepper, Thomas Steiner, Kenji Baheux에게 감사드립니다.