read() 方法在 Clipboard interface requests a copy of the clipboard's contents, delivering the data to the returned Promise when the promise is resolved. Unlike readText() read() method can return arbitrary data, such as images. This method can also return text.

To read from the clipboard, you must first have the "clipboard-read" permission.

注意: The asynchronous Clipboard and Permissions APIs are still in the process of being integrated into most browsers, so they often deviate from the official rules for permissions and the like. Be sure to review the 兼容性表格 before using these methods.

句法

var promise = navigator.clipboard.read();
					

参数

None.

返回值

A Promise that resolves with a DataTransfer object containing the clipboard's contents. The promise is rejected if permission to access the clipboard is not granted.

范例

After using navigator.permissions.query() to find out if we have (or if the user will be prompted to allow) "clipboard-read" access, this example fetches the data currently on the clipboard. If it's not a png image, an error message is presented. Otherwise, an image element referred to using the variable imgElem has its source replaced with the clipboard's contents.

// First, ask the Permissions API if we have some kind of access to
// the "clipboard-read" feature.
navigator.permissions.query({name: "clipboard-read"}).then(result => {
  // If permission to read the clipboard is granted or if the user will
  // be prompted to allow it, we proceed.
  if (result.state == "granted" || result.state == "prompt") {
    navigator.clipboard.read().then(data => {
      for (let i=0; i<data.items.length; i++) {
        if (data.items[i].type != "image/png") {
          alert("Clipboard contains non-image data. Unable to access it.");
        } else {
          const blob = data.items[i].getType("image/png");
          imgElem.src = URL.createObjectURL(blob);
        }
      }
    });
  }
});
					

注意: At this time, while Firefox does implement read() , it does not recognize the "clipboard-read" permission, so attempting to use the 权限 API to manage access to the API will not work.

规范

规范 状态 注释
Clipboard API and events
The definition of 'read()' in that specification.
工作草案 初始定义。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据
桌面 移动
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
read Chrome 部分支持 76
部分支持 76
From version 76, the image/png MIME type is supported.
部分支持 66
Images are not supported.
Edge 79 Firefox 63 Disabled
63 Disabled
Currently works just like readText() ; non-text content is not currently supported.
Disabled ). To change preferences in Firefox, visit about:config.
IE No Opera 63 Safari 13.1 WebView Android 部分支持 84
部分支持 84
From version 84, the image/png MIME type is supported.
部分支持 66
Images are not supported.
Chrome Android 部分支持 84
部分支持 84
From version 84, the image/png MIME type is supported.
部分支持 66
Images are not supported.
Firefox Android 63 Disabled
63 Disabled
Currently works just like readText() ; non-text content is not currently supported.
Disabled ). To change preferences in Firefox, visit about:config.
Opera Android 54 Safari iOS 13.4 Samsung Internet Android 12.0

图例

完整支持

完整支持

部分支持

部分支持

不支持

不支持

见实现注意事项。

用户必须明确启用此特征。

用户必须明确启用此特征。

另请参阅

元数据

  • 最后修改:
  1. Clipboard
  2. 方法
    1. read()
    2. readText()
    3. write()
    4. writeText()
  3. 继承:
    1. EventTarget
  4. Related pages for Clipboard API
    1. ClipboardEvent
    2. ClipboardItem
    3. Navigator.clipboard

版权所有  © 2014-2026 乐数软件    

工业和信息化部: 粤ICP备14079481号-1