Clipboard API
Clipboard API предоставляет возможность реагировать на команды буфера обмена (вырезать, копировать и вставить), а также выполнять асинхронные чтение/запись в системный буфер обмена. Доступ к содержимому буфера обмена осуществляется через Permissions API: clipboard-write
(разрешение на запись) в буфер обмена автоматически предоставляется страницам, когда они находятся на активной вкладке. Для clipboard-read
(чтение из буфера обмена) должно быть запрошено разрешение пользователя. Можно сделать запрос на разрешение, попытавшись прочитать данные из буфера обмена.
API предназначен заменить document.execCommand()
в качестве способа для доступа к буферу обмена.
Доступ к буферу обмена
Вместо создания объекта буфера посредством инициализации экземпляра, вы получаете доступ к системному буферу обмена через глобальный Navigator.clipboard
:
navigator.clipboard
.readText()
.then(
(clipText) => (document.querySelector(".editor").innerText += clipText),
);
Этот фрагмент извлекает текст из буфера обмена и добавляет его к первому элементу, найденному с помощью editor
(редактора) классов. Этот код безопасен, поскольку readText()
(и read()
, если на то пошло) возвращает пустую строку, если в буфере обмена нет текста.
Интерфейсы
Clipboard
Secure context-
Предоставляет интерфейс для чтения/записи текста и данных в системный буфер обмена. В спецификации называется 'Async Clipboard API (API асинхронного буфера обмена)'.
ClipboardEvent
Secure context-
Представляет события, содержащие информацию, относящуюся к модификации буфера обмена, а именно
cut
,copy
иpaste
события. В спецификации называется 'Clipboard Event API (API событий буфера обмена)'. ClipboardItem
Secure context-
Представляет единый формат элемента, используемый при чтении или записи данных.
Спецификации
Specification |
---|
Clipboard API and events # clipboard-interface |
Clipboard API and events # clipboard-event-interfaces |
Clipboard API and events # clipboarditem |
Совместимость с браузерами
api.Clipboard
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Clipboard | ||||||||||||
read | ||||||||||||
formats.unsanitized parameter | ||||||||||||
readText | ||||||||||||
Supports image/png MIME type | ||||||||||||
Supports text/html MIME type | ||||||||||||
Supports text/plain MIME type | ||||||||||||
write | ||||||||||||
writeText |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- See implementation notes.
api.ClipboardEvent
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
ClipboardEvent | ||||||||||||
ClipboardEvent() constructor | ||||||||||||
clipboardData |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
api.ClipboardItem
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
ClipboardItem | ||||||||||||
ClipboardItem() constructor | ||||||||||||
getType() method | ||||||||||||
presentationStyle | ||||||||||||
supports() static method | ||||||||||||
Support for image/svg+xml MIME type. | ||||||||||||
Support for custom formats starting with web . | ||||||||||||
types |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- Partial support
- Partial support
- In development. Supported in a pre-release version.
- In development. Supported in a pre-release version.
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Has more compatibility info.
Смотрите также
- Async Clipboard API demo on Glitch (Демонстрация API асинхронного буфера на Glitch)
- Image support for Async Clipboard article (Поддержка изображений в асинхронном буфере обмена)
- Permissions API
- Using the Permissions API