發布日期:2025 年 5 月 15 日
含有使用者評論的網站 (例如電子商務或旅遊網站) 通常會提供大量資訊。這樣一來,使用者就必須花費大量時間篩選評論,才能決定是否購買。提供審查摘要有助於使用者瞭解意見回饋,並節省時間。瞭解 redBus 和 Miravia 如何使用 Summarizer API 改善決策和購買體驗。
說明 | 網頁 | 額外資訊 | Chrome 狀態 | Intent |
---|---|---|---|---|
MDN | 查看 | Intent to Ship |
Summarizer API 可讓您產生不同類型的摘要,長度和格式各異,例如句子、段落、項目符號清單等。這個 API 與許多 內建 AI API 一樣,會使用大型語言模型執行推論。在 Chrome 中,我們的模型是 Gemini Nano。
redBus 協助客戶選擇最佳巴士方案
redBus 是印度最大的巴士供應商,擁有超過 3,000 萬名客戶,提供約 10,000 個城市和鄉鎮的巴士服務,全國各地皆可連結。根據資料和意見回饋,redBus 發現使用者撰寫的評論,對於協助客戶決定最符合其旅遊需求的路線和巴士,扮演著重要角色。redBus 收到大量評論,每則評論都會指出確的抵達和出發地點和時間。
為了協助客戶大致瞭解特定城市或路線,他們使用 Summarizer API 呈現相關評論中的重點洞察資料。
「Summarizer API 能夠從大量評論和使用者搜尋查詢變化中,建立優質摘要。這項用戶端功能可消除技術複雜性,並避免使用伺服器端替代方案時產生的額外商業成本。這對我們來說很重要,因為這個用途是轉換漏斗的一部分。」
— redBus 資深工程經理 Amit Kumar
在 redBus 後端儲存的評論細節,加上使用者搜尋查詢中可能出現的大量變化 (例如出發和抵達時間、城市中的特定上車地點和不同巴士營運商等變數),使得從評論中找出特定洞察資料變得相當困難。在這種資料量下,為每個搜尋查詢建立伺服器端摘要的成本會相當高。
為了產生有效的摘要,redBus 除了提供顧客評論,還會向 Summarizer API 提供下列背景資訊:
//Context to provide a useful summary
const promptContext =
'Summarize the following reviews in 30 words or less.' +
'Focus on key positives and negatives, such as comfort, maintenance,' +
'pricing, and cleanliness. Reviews are separated by {end}.' +
'Give the summary in just one paragraph.';
這類摘要可協助客戶做出明智的決策,且不會產生額外的業務成本和技術複雜性。此外,redBus 還能根據登入使用者的偏好,提供個人化的摘要,例如座椅舒適度或 Wi-Fi 可用性。推論用戶端,也就是說,這項搜尋和摘要仍是使用者私人資料。
請參閱以下程式碼範例,瞭解如何檢查 Summarizer 是否可用、提供情境資訊,以及根據使用者的搜尋查詢擷取評論。
// The Summarizer API is available
if ('Summarizer' in self) {
try {
const available = await Summarizer.availability();
let summarizer;
if (available === 'unavailable') {
return null;
}
if (available === 'available') {
//model is already available, use immediately
summarizer = await Summarizer.create();
} else {
//trigger model download and wait
summarizer = await Summarizer.create();
}
// Context to provide a useful summary
const promptContext =
'Summarize the following reviews in 30 words or less.' +
'Focus on key positives and negatives, such as comfort, maintenance,' +
'pricing, and cleanliness. Reviews are separated by {end}.' +
'Give the summary in just one paragraph.';
// Retrieve the reviews to be summarized based on user's search query
let reviews = getIndividualBusReviews();
if (reviews) {
const reviewSummary = await summarizer.summarize(reviews, {
context: promptContext
});
}
} catch (e) {
console.error("SUMMARIZER_API_ERROR: ", e);
return null
}
}
以班加羅到曼加羅的搜尋範例來說,摘要器的輸出內容如下:
<Bus Provider X>
通常在舒適度、清潔度和服務方面獲得正面評價。部分乘客遇到一些小問題,例如延誤、司機行為 (粗魯)、缺乏設施 (即時追蹤、毛毯) 和不舒適 (座椅大小、避震器不佳)。
這則評論符合要求的條件,在一個簡短的段落中列出優點和缺點,比起 308 則個別評論,更容易閱讀。
Miravia 摘要電子商務評論
Miravia 是西班牙的領先電子商務平台,每月有數百萬名活躍使用者。每當使用者篩選評論 (例如依產品評分篩選),系統就會產生新的摘要。這份報告會簡要概述客戶意見回饋,並強調客戶疑慮和建議。
「過去,使用者必須逐一閱讀產品詳細資料頁面上的眾多評論,才能瞭解產品評論中的重點優缺點。為了協助使用者快速掌握整體消費者情緒,我們推出了 Summarizer API。每當使用者篩選評論 (例如依星級評等或其他條件),這份摘要就會動態更新,提供相關買家意見的快速且完整概觀。」
— Miravia 資深軟體工程師 Ziyi Liang
起初,Miravia 的使用者評論摘要功能仰賴伺服器端 AI 服務。他們發現,Gemini Nano 執行用戶端 AI 可提供相似的結果,同時降低維護成本。對於熱銷商品,這項優勢尤其明顯,因為這類商品的評論會不斷更新。
雖然 Miravia 的導入作業需要即時擷取及摘要檢查,無論推論是在伺服器或瀏覽器中執行,用戶端 AI 的效率都會隨著頻率增加而提高。他們對整體成效感到滿意。
首先,Miravia 會檢查功能和裝置相容性。
// Compatibility check for device with built-in AI
export const deviceCheck = async () => {
// Query the browser's AI capabilities
const availability = await Summarizer.availability();
// Case 1: Device doesn't support AI summarization
if (availability === 'unavailable') {
return {
summarizationAvailable: false,
message:
'AI summarization tools are not supported on this device, or the appropriate permissions have not be set.',
};
}
// Case 2: Device supports AI but requires model download
if (availability === 'downloadable') {
// Try to trigger an installation
Summarizer.create();
return {
summarizationAvailable: false,
message: 'Installing in the background. This may take a few minutes...',
};
}
// Case 3: Device supports AI summarization
return {
summarizationAvailable: true,
message: 'Ready for use.',
};
};
接著,Miravia 會匯總可用的評論。評論會與額外的句點連結,讓輸入內容更連貫。
/**
* Summarizes a list of reviews using Chrome's Built-in AI
* @param {Array<string>} reviewContentList - Array of review texts to summarize
* @returns {Promise<string>} The generated summary text
* @throws {Error} If summarization is not available or fails
*/
export const reviewSummarize = async (reviewContentList) => {
// Validate input
if (!Array.isArray(reviewContentList) || !reviewContentList.length) {
throw new Error('Please provide a non-empty array of reviews to summarize');
}
// Check device compatibility
const { summarizationAvailable, message } = await deviceCheck();
if (summarizationAvailable) {
try {
// Configure and create the summarizer with appropriate parameters
const summarizer = await Summarizer.create({
type: 'tl;dr',
length: 'short',
sharedContext:
'Summarize the given user reviews. Maintain a polite and formal tone.',
});
// Generate the summary from the joined review texts
const summary = await summarizer.summarize(reviewContentList.join('. '));
// Return the generated summary
return summary;
} catch (error) {
// Handle any errors during summarization
throw new Error(`Summarization failed: ${error.message}`);
}
} else {
// If summarization is not available, throw an error with the message from deviceCheck
throw new Error(
message ||
'AI summarization tools are not supported on this device or browser.'
);
}
};
最佳做法
如果評論輸入內容超過符記限制,請採取以下因應措施:
- 使用較小的樣本 (例如最近 4 則評論) 測試 API。這有助於更快產生結果。請參閱擴大用戶端摘要功能的相關指南。
QuotaExceededError
會提供輸入內容中所要求的符記的詳細資訊。summarizer
物件含有inputQuota
屬性,可指出 API 的符記限制。這可讓系統即時提供意見回饋,並在輸入值超過限制時停用功能。
建議您採用混合型方法,確保所有使用者都能享有流暢的體驗。第一次呼叫內建 AI API 時,瀏覽器必須下載模型。
- Miravia 在模型下載期間使用伺服器端模型提供初始摘要。內建模型準備就緒後,網站就會切換至在用戶端執行推論。
您應一律盡力建立友善且易於溝通的介面:
- 為模型下載作業導入進度列,並減少回應延遲時間。
- 請考慮模型下載作業的透明度。Bright Sites 會通知使用者模型下載作業,以便提供資源使用資訊和同意聲明。這樣一來,使用者就能在繼續前接受或拒絕。
結論與最佳化建議
以下是 redBus 和 Miravia 提供的實際範例,說明 Summarizer API 如何提供簡潔且相關的使用者評論摘要,協助使用者快速做出明智的決定。由於 API 可在用戶端運作,且不需額外支付業務費用,且技術複雜度低,因此在需要匯總資訊的類似用途中,這項 API 是可行的選擇。所有內建 AI API 都能實現實用的用戶端 AI 用途。
想知道 Summarizer API 如何協助其他用途嗎?我們也曾分享Summarizer API 如何協助提升文章參與度。
您是否正在使用這些 API 建構新項目?歡迎前往 @ChromiumDev on X 或 Chromium for Developers on LinkedIn 與我們分享。
資源
- 進一步瞭解 Summarizer API。
- 開始在 Chrome 上使用內建 API。
- 閱讀提示 API 個案研究,瞭解如何協助部落格作者。
- 閱讀翻譯和語言偵測器個案研究。
- 瞭解 Summarizer API 如何協助 Bright Sites 和 Terra 製作引人入勝的文章摘要
特別銘謝
感謝 Miravia (Alibaba Group) 的 Makakhov Andrey 和 Ziyi Liang、redBus 的 Amit Kumar、Swetha Gopalakrishnan、Alexandra Klepper、Thomas Steiner 和 Kenji Baheux 協助撰寫及審查本文件。