使用 Chrome 中的内置 AI 构建新功能

Thomas Steiner

发布时间：2026 年 5 月 26 日

本文是 Thomas Steiner 在 Google I/O 2026 大会上所做演讲的文字稿。

想象一下，您正在构建一个旅游博客，博客文章编辑器不仅存储文本，还会在您撰写时积极为您提供支持。认识一下 trAIlblazers 的创作者 Maya 和 Ashok。他们使用 Chrome 中的 内置 AI。通过直接在用户设备上运行模型，开发者可以避免高昂的云费用和延迟，同时将敏感数据保留在本地。

我们与 Build Awesome（前身为 Eleventy）合作发布了一个包含演讲中列出的所有 AI 功能的博客模板 。

为何要使用内置 AI？

  • 经济高效： 无需云推理费用，所有计算都在用户的支持设备上进行。
  • 隐私至上： 敏感数据绝不会离开浏览器。
  • 离线功能： 下载模型后，AI 功能无需互联网连接即可运行。
  • 性能： 硬件加速使设备端模型能够与云速度相媲美（有时甚至超过云速度）。
  • 混合推理： 使用 Polyfill 和 Firebase AI Logic 等工具， 您可以在不支持的设备（如移动设备）上回退到云，同时 在桌面设备上保持原生状态。

适用于现代 Web 应用的 AI 功能

Summarizer API

trAIlblazers 编辑器使用 Summarizer API 自动 生成标题和利于 SEO 的元说明。

示例：生成标题

const blogPost = document.querySelector('.article-body').innerText;
const summarizer = await Summarizer.create({
  type: 'headline',
  sharedContext: 'Write headlines that make people want to read the blog post',
});

for await (const chunk of summarizer.summarizeStreaming(blogPost)) {
  headline.append(chunk);
}

Prompt API（带结构化输出）

需要特定数据？通过将 JSON 架构 与 Prompt API 搭配使用，您可以让 AI 返回 可预测的格式。trAIlblazers 团队将此用于以下用途：

  • 标记生成： 从预定义列表中建议“冒险”或“海滩”等类别。
  • 评论审核： 在发布评论之前，将其归类为“安全”或“有害”。

媒体无障碍功能

编辑器会自动执行 Markdown 的“难点”。当您放置图片时， Prompt API（带多模态 输入） 会分析像素以生成无障碍替换文本和信息丰富的说明。

撰写和重写

借助 Writer 和 Rewriter API，用户只需点击一下，即可将项目符号展开为完整的 段落，并将段落的语气更改为“更随意”或“更短” 。

无缝翻译

借助 Translator API ，创作者可以用英语撰写 内容，并立即将其翻译成西班牙语或日语， 然后母语人士可以对其进行润色。

Translator API 的工作示例。
使用 Translator API 用英语撰写内容，并立即将其翻译成西班牙语和日语。

现实世界中的成功案例

许多合作伙伴已在正式版中发布这些 API。值得注意的示例包括：

  • Drupal： 在 CKEditor 中使用 Summarizer API 生成 SEO 标记。
  • Yahoo! 日本： 使用 Prompt API 进行社区评论审核。
  • Trip.com:： 通过 AI 概览帮助购物者浏览复杂的航班预订选项。

演讲中的资源

准备好构建自己的“trAIlblazers”体验了吗？请查看以下资源：