Ninext

Пример работы с буфером обмена

image.png

Этот пример показывает, как скопировать текст в буфер обмена. Он взят из примера Copy / Paste data в демонстрационном приложении Ninext.

function copyToClipboard(text : text) do
 #{:text navigator.clipboard.writeText(text);}#
end;

Ограничения на использование navigator.clipboard.writeText()

API navigator.clipboard.writeText(text) подчиняется правилам безопасности браузеров. Он должен вызываться непосредственно в ответ на действие пользователя (например, нажатие кнопки).

Если между действием пользователя и вызовом writeText() возникает задержка или промежуточная обработка (например, вычисление), браузер перестаёт считать операцию инициированной пользователем и блокирует доступ к буферу обмена во избежание злоупотреблений.

Рекомендации:

  • Вызывайте navigator.clipboard.writeText(text) прямо в обработчике пользовательского события (например, onclick).
  • Не вводите асинхронных операций и задержек между действием пользователя и вызовом функции.

Правильный пример:

document.getElementById("copyButton").addEventListener("click", () => {
    navigator.clipboard.writeText("Copied text!")
        .then(() => console.log("Text copied successfully!"))
        .catch(err => console.error("Error copying text:", err));
});

Неправильный пример (может не работать):

document.getElementById("copyButton").addEventListener("click", () => {
    setTimeout(() => { // Introducing a delay may prevent copying
        navigator.clipboard.writeText("Copied text!");
    }, 100);
});