Clipboard API - Web APIs 编辑

The Clipboard API provides the ability to respond to clipboard commands (cut, copy, and paste) as well as to asynchronously read from and write to the system clipboard. Access to the contents of the clipboard is gated behind the Permissions API: The clipboard-write permission is granted automatically to pages when they are in the active tab. The clipboard-read permission must be requested, which you can do by trying to read data from the clipboard.

Note: This API is not available in Web Workers (not exposed via WorkerNavigator).

This API is designed to supersede accessing the clipboard using document.execCommand().

Accessing the clipboard

Instead of creating a Clipboard object through instantiation, you access the system clipboard through the Navigator.clipboard global:

navigator.clipboard.readText().then(
  clipText => document.querySelector(".editor").innerText += clipText);

This snippet fetches the text from the clipboard and appends it to the first element found with the class editor. Since readText() (and read(), for that matter) returns an empty string if the clipboard isn't text, this code is safe.

Interfaces

Clipboard Secure context

Provides an interface for reading and writing text and data to or from the system clipboard. The specification refers to this as the 'Async Clipboard API.'

ClipboardEvent Secure context

Represents events providing information related to modification of the clipboard, that is cut, copy, and paste events. The specification refers to this as the 'Clipboard Event API'.

ClipboardItem Secure context

Represents a single item format, used when reading or writing data.

Specifications

Specification	Status	Comment
Clipboard API and events	Working Draft	Initial definition.

Browser compatibility

Clipboard

BCD tables only load in the browser

ClipboardEvent

BCD tables only load in the browser

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.

ClipboardItem

BCD tables only load in the browser

See also

• Async Clipboard API demo on Glitch
• Image support for Async Clipboard article
• Permissions API
• Using the Permissions API