Chrome 138 将内置强大的 AI 模型，Vue、React 可直接调用！-CSDN博客

在数字化飞速发展的今天，Google Chrome 浏览器不断推陈出新，为用户和开发者带来惊喜。

即将发布的 Chrome 138 版本，更是内置了强大的 AI 模型，通过 JavaScript 接口，开发者可以直接调用这些前沿的 AI 功能，为 Web 应用和扩展注入全新活力。

内置 AI 模型：Gemini Nano

Chrome 138 内置的 AI 模型核心是 Gemini Nano，它是 Gemini 系列大型语言模型（LLM）的高效版本，专为在大多数新型桌面设备和笔记本电脑上本地运行而设计。

这意味着，无需依赖远程服务器或云服务，用户的设备即可独立完成复杂的 AI 任务，如文本摘要、语言检测、翻译、文本重写和写作辅助等。

内置 API 介绍

从 Chrome 138 开始，Summarizer API、Language Detector API 和 Translator API 都稳定上线啦，Prompt API 也能在 Chrome 扩展里用啦。

还有 Writer API 和 Rewriter API，也开启了试用阶段。这些 API 让网页和扩展程序能直接用上 AI 功能，超方便！

Summarizer API（摘要 API）

Summarizer API 是一款功能强大的工具，能够从长篇大论中提炼出关键信息，生成精炼且富有洞见的摘要。

这对于处理冗长的文章、会议记录、聊天对话等非常实用，无论是新闻平台快速生成资讯摘要，还是办公软件提炼会议要点，它都能让信息获取变得更加高效。

示例代码：

const options = {
    sharedContext: '这是一篇科学文章',
    type: 'key-points',
    format: 'markdown',
    length: 'medium',
};

const availability = await Summarizer.availability();
let summarizer;
if (availability === 'unavailable') {
    return;
}
if (availability === 'available') {
    summarizer = await Summarizer.create(options);
} else {
    summarizer = await Summarizer.create(options);
    summarizer.addEventListener('downloadprogress', (e) => {
        console.log(`已下载 ${e.loaded * 100}%`);
    });
    await summarizer.ready;
}

const longText = document.querySelector('article').innerHTML;
const summary = await summarizer.summarize(longText, {
    context: '这篇文章面向技术爱好者',
});

2. Language Detector API（语言检测 API）

Language Detector API 是一个多语言环境下的得力助手，它可以自动识别输入文本的语言。

这对于社交网络平台、多语言文档处理工具等应用至关重要。

无论用户输入何种语言，它都能快速准确地识别并反馈，为后续的语言处理任务（如翻译、语言特定功能等）奠定基础，极大地提升了多语言应用的用户体验。

示例代码：

const availability = await LanguageDetector.availability();

let detector;
if (availability === 'unavailable') {
    return;
}
if (availability === 'available') {
    detector = await LanguageDetector.create();
} else {
    detector = await LanguageDetector.create({
        monitor(m) {
            m.addEventListener('downloadprogress', (e) => {
                console.log(`已下载 ${e.loaded * 100}%`);
            });
        },
    });
    await detector.ready;
}

const someUserText = 'Hallo und herzlich willkommen!';
const results = await detector.detect(someUserText);
for (const result of results) {
    console.log(result.detectedLanguage, result.confidence);
}

3. Translator API（翻译 API）

Translator API 消除了语言障碍，让全球化沟通变得更加顺畅。

它允许在本地将文本快速准确地翻译为目标语言。对于在线旅游平台、电商平台、跨国社交应用等需要多语言支持的应用来说，这个 API 无疑是必备的。

它能实时翻译用户评论、产品描述等，让不同语言的用户都能无缝交流和获取信息。

示例代码：

if ('Translator'in self) {
    // 支持 Translator API
}

const translatorCapabilities = await Translator.availability({
    sourceLanguage: 'zh',
    targetLanguage: 'en',
});

const translator = await Translator.create({
    sourceLanguage: 'zh',
    targetLanguage: 'en',
});

await translator.translate('请问下一个公交站怎么走？');

4. Rewriter API（重写 API）

Rewriter API 是文本优化的利器，它能够对现有文本进行重写、润色、调整语气或简化。

对于内容创作平台、电子邮件客户端、在线办公软件等应用，这个 API 可以帮助用户提升文本质量。

示例代码：

const options = {
    sharedContext: '这是一封关于即将举行活动的电子邮件',
    tone: 'more-casual',
    format: 'plain-text',
    length: 'shorter',
};

const available = await Rewriter.availability();
let rewriter;
if (available === 'unavailable') {
    return;
}
if (available === 'available') {
    rewriter = await Rewriter.create(options);
} else {
    rewriter = await Rewriter.create(options);
    rewriter.addEventListener('downloadprogress', (e) => {
        console.log(e.loaded, e.total);
    });
}

const result = await rewriter.rewrite(reviewEl.textContent, {
    context: '避免使用任何有毒语言，并尽可能具有建设性',
});

5. Writer API（写作 API）

Writer API 是创意写作的强大后盾，它根据提示生成新的文本内容。

这对于自动生成文章、评价、博文等非常有帮助。在线教育平台可以利用它生成生动有趣的课程介绍，博客平台可以辅助用户撰写初稿，甚至可以帮助用户创作故事、诗歌等文学作品，激发创作灵感，提高写作效率。

示例代码：

const options = {
    sharedContext: '这是一封关于即将举行活动的电子邮件',
    tone: 'casual',
    format: 'plain-text',
    length: 'medium',
};

const available = await Writer.availability();
let writer;
if (available === 'unavailable') {
    return;
}
if (available === 'available') {
    writer = await Writer.create(options);
} else {
    writer = await Writer.create(options);
    writer.addEventListener('downloadprogress', (e) => {
        console.log(e.loaded, e.total);
    });
}

const result = await writer.write(
    "向银行咨询如何在我的账户上启用电汇功能。", {
        context: "我是一位长期客户",
    },
);

这些 API 不仅功能强大，而且易于集成，为 Web 开发者提供了丰富的工具，助力打造出更具创新性和竞争力的 Web 应用和扩展。