Video thumbnail

    Phil Nash - 使用 Web API 构建浏览器 AI 应用

    Valuable insights

    1.浏览器AI应用需使用实验性API: 当前讨论的许多前沿Web AI功能属于实验性质,需要用户在Chrome Canary等特定浏览器版本中运行才能体验其全部潜力。

    2.浏览器原生语音API已成熟: Web Speech API提供了成熟的语音转文本和文本转语音功能,但传统上需要依赖云服务进行实际的语音识别处理。

    3.避免大型模型导致用户下载负担: 为每个网站下载数GB的AI模型对用户存储空间构成巨大负担,因此浏览器内置的、一次性下载的AI模型是更优的解决方案。

    4.Prompt API催生专业化浏览器AI工具: 从通用的Prompt API中学习用户需求后,浏览器团队推出了更小、更专注的API,如翻译器和语言检测器,模型体积显著减小。

    5.离线AI应用实现数据隐私保护: 在浏览器内运行AI模型,意味着用户数据无需发送到外部服务器,解决了传统Web Speech API中语音数据被上传到云端的隐私问题。

    6.新API支持构建完整离线翻译系统: 结合多媒体提示API、语言检测和翻译API,可以构建一个完全在浏览器内、无需网络连接即可运行的实时翻译应用程序。

    介绍与前沿警告

    IBM的开发者关系工程师Phil Nash向与会者致以问候。演讲内容聚焦于在Web上利用应用程序接口(API)构建人工智能(AI)应用。然而,鉴于当前许多前沿技术仍处于早期发展阶段,演讲者首先发出重要警告,指出所展示的许多功能具有实验性质,可能无法在常规浏览器中正常运行,因此演示均在Chrome Canary版本中进行。

    实验性功能与早期采用

    AI革命正在发生,并且不仅限于服务器端。Web平台也正在集成AI能力。演讲者的核心目标是展示如何构建一个完全在浏览器内部运行,并且能够完全离线操作的AI应用,以实现传统上无法完成的功能。

    我的幻灯片和演示都在Chrome Canary中运行,因为有些东西在常规浏览器中根本无法工作。

    AI革命正在Web上发生

    AI技术的发展速度令人难以置信,构建的应用潜力巨大。关键在于将这种能力带到Web端,让开发者能够利用浏览器自身的能力来集成AI,而不是仅仅依赖远程服务器进行计算。

    构建离线翻译应用的构想

    演讲者分享了个人经历,提到最近在西班牙和法国旅行时,发现回忆和使用西班牙语进行交流变得有些困难。这激发了构建一个翻译应用的设想,该应用必须完全在浏览器内运行,不需要任何互联网连接,实现完全的离线能力。

    离线翻译应用所需组件

    要实现这一目标,需要三个核心功能:首先是语音输入转文本(Speech to Text),其次是实现语言间的转换逻辑,最后是将翻译后的文本重新转换成语音(Text to Speech)。

    • 语音转文本(Speech to Text)
    • 语言翻译处理
    • 文本转语音(Text to Speech)

    浏览器原生语音处理能力

    浏览器平台已经内置了实现语音输入和输出的API。Web Speech API长期以来一直支持语音识别和语音合成。虽然构建过程并不复杂,但要实现翻译功能,通常仍需要调用外部的翻译API服务。

    Web Speech API的语音识别

    语音识别功能要求创建SpeechRecognition对象的实例并启动,同时需要指定预期的输入语言。该API会持续回调接收到的语音流,并将其实时转录到屏幕上,即使在幻灯片中也能实现动态字幕效果。

    文本转语音的实现细节

    文本转语音功能即将文本转换回声音,技术上依赖于操作系统(如Mac和Windows)提供的底层支持。尽管API的调用对象——SpeechSynthesisUtterance——名称冗长,但该功能在浏览器中是可用的,并提供了多种声音选择。

    声音名称
    特点/备注
    Eddie, Flo
    系统提供的标准声音
    Grandma/Grandpa
    老年人声音,效果一般
    Bubbles
    演讲者最喜欢的、独特的趣味声音
    Jester
    带有笑声的独特声音

    解决大型模型在Web上的部署难题

    虽然语音识别和合成已在浏览器中实现,但翻译功能传统上需要依赖外部API,即将语音数据发送到服务器进行处理,再返回结果。演讲者强调,用户更关心的是功能本身,而不是底层是否使用了AI。

    大型模型下载带来的用户体验问题

    当前Web AI的一个主要问题是,如果每个网站都要求用户下载大型语言模型(LLM),例如Gemma 3的某个版本,用户可能需要进行高达数GB的下载。这会迅速消耗用户的设备存储空间,是不可持续的体验。

    人们不关心功能是使用AI构建的,他们关心的是这个功能本身。

    Chrome团队的浏览器内置AI方案

    Chrome团队着手将AI能力集成到浏览器中,首先推出了Prompt API。该API允许开发者调用浏览器内置的LLM(如Gemini Nano)。关键在于,模型只在浏览器首次运行时下载一次,而不是每次访问不同网站时都下载,从而解决了重复下载的问题。

    浏览器内置AI API的演进与应用

    通过观察开发者如何使用通用的Prompt API,Chrome团队发现用户需求可以被归类到更小的、更专注的场景中。因此,团队开始构建更小、更聚焦的模型API,以解决Web上实际存在的问题,避免了通用模型带来的广度问题。

    已发布的专业化AI API

    目前,Chrome 138版本中已经发布了语言检测器(Language Detector)、翻译器(Translator)和摘要器(Summarizer)这三个API。此外,写作(Writer)和重写(Rewriter)API正在进行源试验(Origin Trial),证明了浏览器正在向更实用的、体积更小的AI功能迁移。

    API名称
    状态
    模型大小(参考)
    Translator, Detector, Summarizer
    Chrome 138 已发布
    约 70-80 MB
    Writer, Rewriter
    正在进行源试验
    未知
    Prompt API (通用)
    实验性
    约 2 GB

    翻译器API的工作流程

    翻译器API的调用方式与通用模型类似,需要指定源语言和目标语言。虽然其模型大小约为70到80兆字节,远小于2GB,但它仍然需要下载。一旦下载完成,翻译操作就能立即执行,速度非常快。

    离线AI翻译应用的实现与隐私优势

    演讲者随后展示了最终的演示,该演示完全在离线状态下运行。通过结合媒体录制API、Web Audio API处理音频缓冲区,并将数据发送给多模态提示API进行转录,再依次通过语言检测API、翻译器API,最后使用语音合成API输出,构建了一个完整的端到端离线翻译流程。

    步骤
    使用的API
    语音输入转文本
    Media Recorder API + Web Audio API + Multimodal Prompt API
    语言识别
    Language Detector API
    文本翻译
    Translator API
    文本转语音输出
    Speech Synthesis API

    隐私保护是最大的杀手级应用

    所有这些在浏览器内处理的最大优势在于隐私保护。过去,Web Speech API的语音数据会被发送到云端服务器进行处理。现在,所有操作都在用户设备上完成,确保了用户数据的机密性和安全性,这是Web AI集成的最重要驱动力之一。

    这些AI能力现已存在并可供开发者使用。鼓励开发者利用Chrome Canary中的Prompt API以及已发布的翻译和语言检测API进行实验和创新。通过在浏览器中构建AI驱动的特性,开发者能够创造出令人惊叹的新应用和用户体验。

    Questions

    Common questions and answers from the video to help you understand the content better.

    在Web上构建AI应用时,为什么不推荐每个网站都下载大型语言模型?

    因为大型模型(如2GB)的下载会给用户的设备存储空间带来巨大负担,并且每次访问不同网站都需要重复下载,用户体验极差。

    Web Speech API的语音识别功能是否完全在设备上离线运行?

    不是。传统上,Web Speech API在处理语音识别时会将数据发送到云端服务器(例如Google Cloud)进行处理,因此它并非完全离线或私密的操作。

    Chrome浏览器如何通过Prompt API解决模型下载问题?

    Prompt API允许浏览器在首次运行时下载模型一次,并且该模型存储在浏览器级别,其他网站可以直接使用该已下载的模型,避免了重复下载。

    目前哪些浏览器AI API已在Chrome中稳定发布?

    语言检测器(Language Detector)、翻译器(Translator)和摘要器(Summarizer)这三个专注于特定任务的API已在Chrome 138版本中发布并投入使用。

    在浏览器中实现离线翻译应用使用了哪些关键API组合?

    该应用结合了多模态提示API进行语音转文本、语言检测API、翻译器API,以及语音合成API,实现了端到端的离线流程。

    Useful links

    These links were generated based on the content of the video to help you deepen your knowledge about the topics discussed.

    This article was AI generated. It may contain errors and should be verified with the original source.
    VideoToWordsClarifyTube

    © 2025 ClarifyTube. All rights reserved.