在 Chrome 中使用內建 AI 技術製作摘要

Thomas Steiner

發布日期：2024 年 11 月 11 日

想像一下，如果您能讓使用者將冗長的文章、複雜的文件，甚至是熱絡的即時通訊對話，濃縮成精簡且有洞見的摘要，那該有多好！

您可以使用 Summarizer API 產生不同類型的摘要，並以不同的長度和格式呈現，例如句子、段落、項目符號清單等。我們認為這個 API 可用於下列情境：

  • 提供文章或即時通訊對話的重點摘要。
  • 為文章建議標題和標題
  • 為冗長的文字建立精簡且實用的摘要。
  • 根據書籍評論產生書籍預告片。

可用性

  • 加入 Summarizer API 來源試用 (從 Chrome 131 到 Chrome 136)，在實際環境中與真實使用者測試 API。原始來源試用版會為原始來源的所有 Chrome 使用者啟用這項功能。瞭解如何開始使用原點測試功能。
    • 雖然可能會有使用限制，但您可以整合這些功能，進行實時測試並收集使用者意見回饋。目的是為了讓這個 API 日後的版本更廣泛地提供服務。
  • 請依照 Chrome 狀態中的實作方式操作。
  • Summarizer API 提案是編寫 API 套件的一部分，歡迎討論。
  • 加入搶先體驗搶先體驗計畫，搶先瞭解全新的內建 AI API，並參與郵寄清單中的討論。

來源試用期間的限制

在來源試用期間，Summarizer API 僅支援英文文字摘要，因為模型品質僅在英文內容上進行徹底測試。我們會在測試其他語言的品質和安全性，並廣泛提供 API 後，解除這項限制。

使用 Summarizer API

首先，請執行功能偵測功能，查看瀏覽器是否支援 Summarizer API。

if ('ai' in self && 'summarizer' in self.ai) {
  // The Summarizer API is supported.
}

模型下載

Summarizer API 會使用經過訓練的強大 AI 模型，產生高品質的摘要。雖然 API 已內建於 Chrome，但網站首次使用 API 時，系統會另外下載模型。

如要判斷模型是否已準備好供使用，請呼叫非同步 ai.summarizer.capabilities() 函式。這個方法會傳回 AISummarizerCapabilities 物件，其中包含 available 欄位，可接受三個可能的值：

  • no：目前的瀏覽器支援 Summarizer API，但目前無法使用。這可能是因為磁碟空間不足，無法下載模型。
  • readily：目前的瀏覽器支援 Summarizer API，而且可立即使用。
  • after-download：目前的瀏覽器支援 Summarizer API，但必須先下載模型。

如要觸發模型下載作業並建立摘要器，請呼叫非同步 ai.summarizer.create() 函式。如果 capabilities() 的回應是 after-download，建議您監聽下載進度。這樣一來，如果下載作業需要一段時間，您就能通知使用者。

const summarizer = await ai.summarizer.create({
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded} of ${e.total} bytes.`);
    });
  }
});

API 函式

create() 函式可讓您根據需求設定新的摘要工具物件。這個方法會使用選用的 options 物件，並採用下列參數：

  • sharedContext：可協助摘要工具的其他共用背景資訊。
  • type：摘要類型，允許的值為 key-points (預設)、tl;dr、teaser 和 headline。
  • format：摘要格式，可用的值為 markdown (預設值) 和 plain-text。
  • length：摘要長度，允許的值為 short、medium (預設) 和 long。這些長度的含義會因要求的 type 而異。舉例來說，在 Chrome 的實作中，簡短的重點摘要由三個項目符號組成，而簡短摘要則為一句話；長的重點摘要由七個項目符號組成，而長摘要則為一個段落。

以下範例說明如何初始化摘要工具。

const options = {
  sharedContext: 'This is a scientific article',
  type: 'key-points',
  format: 'markdown',
  length: 'medium',
};

const available = (await self.ai.summarizer.capabilities()).available;
let summarizer;
if (available === 'no') {
  // The Summarizer API isn't usable.
  return;
}
if (available === 'readily') {
  // The Summarizer API can be used immediately .
  summarizer = await self.ai.summarizer.create(options);
} else {
  // The Summarizer API can be used after the model is downloaded.
  summarizer = await self.ai.summarizer.create(options);
  summarizer.addEventListener('downloadprogress', (e) => {
    console.log(e.loaded, e.total);
  });
  await summarizer.ready;
}

執行摘要工具

執行摘要工具的方式有兩種：串流和非串流。

非串流影片摘要

使用非串流摘要時，模型會處理整體輸入，然後產生輸出內容。

如要取得非串流摘要，請呼叫摘要器的非同步 summarize() 函式。函式的第一個引數是您要摘要的文字。第二個選用的引數是含有 context 欄位的物件。這個欄位可讓您新增背景詳細資料，以改善摘要功能。

const longText = document.querySelector('article').innerHTML;
const summary = await summarizer.summarize(longText, {
  context: 'This article is intended for a tech-savvy audience.',
});

串流摘要

串流摘要功能可即時提供結果。隨著輸入內容的新增和調整，輸出內容也會持續更新。

如要取得串流摘要，請呼叫摘要器的 summarizeStreaming() 函式。然後在資料流中重複執行可用的文字片段。

let result = '';
let previousChunk = '';
for await (const chunk of stream) {
  const newChunk = chunk.startsWith(previousChunk)
      ? chunk.slice(previousChunk.length) : chunk;
  console.log(newChunk);
  result += newChunk;
  previousChunk = chunk;
}
console.log(result);

summarizeStreaming() 會傳回 ReadableStream，其中回應區段會連續建構。這表示每個回應都包含到目前為止產生的完整摘要，而非僅包含下一個片段，這並非預期的行為。

我們希望與平台上的其他串流 API 保持一致，因為該區段是單一長串流的連續部分。目前，如要達成預期的行為，您可以實作以下操作：

let result = '';
let previousLength = 0;
for await (const segment of stream) {
  const newContent = segment.slice(previousLength);
  console.log(newContent);
  previousLength = segment.length;  
  result += newContent;
}
console.log(result);

示範

您可以在 Summarizer API Playground 中試用 Summarizer API。

標準化工作量

我們正設法將 Summarizer API 標準化，以確保跨瀏覽器相容性。

我們的 API 提案獲得社群支持，並已移至 W3C Web Incubator 社群群組進行進一步討論。Chrome 團隊向 W3C 技術架構團隊要求提供意見，並要求 Mozilla 和 WebKit 詢問他們的標準定位。

參與並提供意見回饋

立即加入來源試用計畫，開始測試 Summarizer API，並提供寶貴意見。您的意見回饋會直接影響我們建構及實作此 API 未來版本，以及所有內建 AI API 的方式。