W3cubDocs

/DOM

Clipboard.read

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

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

Note: 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 compatibility table before using these methods.

Syntax

var promise = navigator.clipboard.read();

Parameters

None.

Return value

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.

Example

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 plain text, an error message is presented. Otherwise, an element referred to using the variable textElem has its contents 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 != "text/plain") {
          alert("Clipboard contains non-text data. Unable to access it.");
        } else {
          textElem.innerText = data.items[i].getAs("text/plain");
        }
      }
    });
  }
});

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

Specifications

Specification Status Comment
Clipboard API and events
The definition of 'read()' in that specification.
Working Draft Initial definition.

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support No ? 63
Disabled
63
Disabled
Currently works just like readText(); non-text content is not currently supported.
Disabled From version 63: this feature is behind the dom.events.asyncClipboard.dataTransfer preference (needs to be set to true). To change preferences in Firefox, visit about:config.
? No ?
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support No No ? 63
Disabled
63
Disabled
Currently works just like readText(); non-text content is not currently supported.
Disabled From version 63: this feature is behind the dom.events.asyncClipboard.dataTransfer preference (needs to be set to true). To change preferences in Firefox, visit about:config.
No ? ?

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/read