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(), если на то пошло) возвращает пустую строку, если в буфере обмена нет текста.
Интерфейсы
ClipboardSecure context-
Предоставляет интерфейс для чтения/записи текста и данных в системный буфер обмена. В спецификации называется 'Async Clipboard API (API асинхронного буфера обмена)'.
ClipboardEventSecure context-
Представляет события, содержащие информацию, относящуюся к модификации буфера обмена, а именно
cut,copyиpasteсобытия. В спецификации называется 'Clipboard Event API (API событий буфера обмена)'. ClipboardItemSecure context-
Представляет единый формат элемента, используемый при чтении или записи данных.
Спецификации
| Specification |
|---|
| Clipboard API and events # clipboard-interface |
| Clipboard API and events # clipboard-event-interfaces |
| Clipboard API and events # clipboarditem |
Совместимость с браузерами
api.Clipboard
Loading…
api.ClipboardEvent
Loading…
api.ClipboardItem
Loading…
Смотрите также
- Async Clipboard API demo on Glitch (Демонстрация API асинхронного буфера на Glitch)
- Image support for Async Clipboard article (Поддержка изображений в асинхронном буфере обмена)
- Permissions API
- Using the Permissions API