吸色器 API

可用性有限

此功能并非基线功能,因为它在一些最广泛使用的浏览器中无法正常工作。

安全上下文:此功能仅在安全上下文(HTTPS)中可用,在某些或所有支持的浏览器中。

实验性:这是一个实验性技术
在生产环境中使用此功能之前,请仔细查看浏览器兼容性表

吸色器 API提供了一种创建吸色器工具的机制。使用此工具,用户可以从屏幕上采样颜色,包括浏览器窗口外部。

概念

创意应用程序通常允许用户从应用程序中的绘图或形状中采样颜色以重复使用。Web 应用程序可以使用吸色器 API来提供类似的吸色器模式,该模式由浏览器提供。

使用 API,Web 应用程序可以启动吸色器模式。启动后,光标会发生变化,以向用户指示模式处于活动状态。然后,用户可以从屏幕上的任何位置选择颜色,或通过按Escape键关闭吸色器模式。

安全和隐私措施

为了防止恶意网站在用户不知情的情况下获取用户屏幕上的像素数据,吸色器 API实施了以下措施

  • API 不允许吸色器模式在没有用户意图的情况下启动。EyeDropper.open()方法只能在响应用户操作(例如单击按钮)时调用。
  • 在没有用户意图的情况下无法检索任何像素信息。EyeDropper.open()返回的 Promise 仅在响应用户操作(单击像素)时才会解析为颜色值。因此,吸色器无法在后台使用而不会被用户注意到。
  • 为了帮助用户更容易地注意到吸色器模式,浏览器会使其变得明显。普通鼠标光标会在短暂延迟后消失,取而代之的是一个放大镜。在吸色器模式启动和用户可以选择像素之间也存在延迟,以确保用户有时间看到放大镜。
  • 用户还可以随时取消吸色器模式(通过按Escape键)。

接口

EyeDropper 实验性

EyeDropper接口表示吸色器工具的实例,用户可以使用该工具打开并从屏幕上选择颜色。

规范

规范
吸色器 API
# 吸色器接口

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。

另请参阅