如何在 Chrome 中使用 AI：window 对象的应用

在现代技术的进步中，人工智能（AI）正在迅速改变我们使用软件和设备的方式。作为一名专注于前端开发技术、Rust 以及 AI 应用知识分享的 Coder，今天我将深入探讨如何在 Chrome 浏览器中使用 AI，特别是通过 window 对象实现这一点。

环境配置的重要性

在使用 Chrome 中的内置 AI 功能之前，确保环境配置的正确性是至关重要的。必须登录 Google 账号，因为未登录状态或游客模式下无法使用内置 AI 功能。关于如何申请 Google 账号，可以参考我的另一篇文章《AI 赋能前端：你的 Chrome 控制台需要 AI》。

硬件要求

启动内置 AI 功能需要大量的内存和资源，因此仅在桌面版 Chrome 中可用。需要满足以下硬件要求：

操作系统：Windows 10 或 11，MacOS 13 或更高版本，Linux
存储空间：至少 22 GB
GPU：集成或独立 GPU
VRAM：最低 4 GB

这意味着，你需要有较强的硬件配置才能流畅地使用这些功能。

下载和安装 Chrome 浏览器

在官方文档中，有两种浏览器可以开启 AI 功能：

Chrome Canary：开发者专用的每日构建版
Chrome Dev：开发者专用的版本

只需选择并下载其中之一即可。如果之前已经安装，请确保将浏览器升级到最新版本，即 Chrome 版本至少为 128.0.6545.0 才能使用 AI 功能。

Chrome Dev 版本截图

开启 AI 功能的配置步骤

下载最新版本的 Chrome 后，还需要对其进行配置以开启 AI 功能。可以通过以下步骤进行：

在地址栏输入 chrome://flags/#optimization-guide-on-device-model ，然后选择 Enabled BypassPerfRequirement。
输入 chrome://flags/#prompt-api-for-gemini-nano，并选择 Enabled。

Chrome 配置截图

配置完成后，重启 Chrome 即可。

手动下载 Gemini Nano

有时重启浏览器并不能解决所有问题，这时需要手动下载 Gemini Nano。打开一个新的标签页，输入 chrome://components，通过检查更新来安装必要的组件。

组件更新截图

下载完成后，确保组件版本大于 2024.5.21.1031。

验证模型是否可行

最后，通过控制台输入 await window.ai.canCreateTextSession(); 来验证模型是否生效。可能的结果有三种：

readily：模型可用
after-download：需要下载模型
no：模型不可用

若结果为 readily，则可以在 Chrome 中使用内置 AI。

AI 的初体验

经过上述配置，我们已经可以在 Chrome 中使用 AI 功能。通过 window 对象，在控制台中可以看到相关信息。

AI 功能展示

AI 的能力演示

在 DevTool-Sources-Snippet 中可以更好地书写和验证代码。

一次性返回结果

const canCreate = await window.ai.canCreateTextSession();

if (canCreate !== "no") {
  const session = await window.ai.createTextSession();
  const result = await session.prompt("Write me a poem");
  console.log(result);
}

运行后会得到如下结果：

结果截图

流式输出

通过 session.promptStreaming API 可以获取流式输出。

流式输出截图

支持中文

AI 还支持非英文的提示信息输入，获取相应的数据。

中文支持截图

翻译文本

AI 可以在控制台中进行文本翻译。

翻译文本截图

直观的 UI 界面

除了 API 调用，是否有 UI 界面来直接使用内置 AI 呢？答案是肯定的。

ChromeAI

使用 ChromeAI 可以像使用 OpenAI 一样，询问各种有趣的问题。

ChromeAI 截图

chrome-ai

另一个选择是 chrome-ai，它提供了类似的功能。

chrome-ai 截图

常见问题解答（FAQ）

FAQ

问：如何在 Chrome 中使用 window.ai？
- 答：您需要下载最新的 Chrome Dev 或 Canary 版本，配置相应的 flags，并确保硬件满足要求。
问：为什么无法在控制台中看到 window.ai？
- 答：请确保您使用的是支持 AI 功能的 Chrome 版本，并按照步骤正确配置浏览器。
问：如何验证 AI 模型是否可用？
- 答：在控制台中输入 await window.ai.canCreateTextSession();，若返回 readily，则模型可用。
问：AI 功能需要互联网连接吗？
- 答：不需要，Chrome 内置的 AI 是一个本地化模型，可以在离线状态下运行。
问：AI 功能支持哪些语言？
- 答：支持多种语言，包括中文和英文。