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; without user permission, reading or altering the clipboard contents is not permitted.
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
, andpaste
events. The specification refers to this as the 'Clipboard Event API'.
Specifications
Specification | Status | Comment |
---|---|---|
Clipboard API and events | Working Draft | Initial definition. |
Browser compatibility
Clipboard
Desktop | Mobile | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Clipboard | Chrome Full support 66 | Edge No support No | Firefox Full support 63 | IE No support No | Opera Full support 53 | Safari ? | WebView Android No support No | Chrome Android Full support 66 | Edge Mobile No support No | Firefox Android Full support 63 | Opera Android Full support 47 | Safari iOS ? | Samsung Internet Android Full support Yes |
read | Chrome No support No | Edge No support No | Firefox
Full support
63
| IE No support No | Opera No support No | Safari ? | WebView Android No support No | Chrome Android No support No | Edge Mobile No support No | Firefox Android
Full support
63
| Opera Android No support No | Safari iOS ? | Samsung Internet Android ? |
readText | Chrome Full support 66 | Edge No support No | Firefox
Full support
63
| IE No support No | Opera Full support 53 | Safari ? | WebView Android No support No | Chrome Android Full support 66 | Edge Mobile No support No | Firefox Android
Full support
63
| Opera Android Full support 47 | Safari iOS ? | Samsung Internet Android Full support Yes |
write | Chrome No support No | Edge No support No | Firefox
Full support
63
| IE No support No | Opera No support No | Safari ? | WebView Android No support No | Chrome Android No support No | Edge Mobile No support No | Firefox Android
Full support
63
| Opera Android No support No | Safari iOS ? | Samsung Internet Android ? |
writeText | Chrome Full support 66 | Edge No support No | Firefox
Full support
63
| IE No support No | Opera Full support 53 | Safari ? | WebView Android No support No | Chrome Android Full support 66 | Edge Mobile No support No | Firefox Android
Full support
63
| Opera Android Full support 47 | Safari iOS ? | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- No support
- No support
- Compatibility unknown
- Compatibility unknown
- See implementation notes.
- See implementation notes.
- User must explicitly enable this feature.
- User must explicitly enable this feature.
ClipboardEvent
Desktop | Mobile | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
ClipboardEvent | Chrome Full support Yes | Edge Full support Yes | Firefox Full support 22 | IE Full support 4 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 22 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
ClipboardEvent() constructor | Chrome Full support 58 | Edge ? | Firefox Full support 22 | IE ? | Opera Full support 45 | Safari ? | WebView Android Full support 58 | Chrome Android Full support 58 | Edge Mobile ? | Firefox Android Full support 22 | Opera Android Full support 43 | Safari iOS ? | Samsung Internet Android ? |
clipboardData | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 22 | IE Full support 5 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Edge Mobile Full support Yes | Firefox Android Full support 22 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- Compatibility unknown
- Compatibility unknown
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.