Ninext

Przykład ze schowkiem

obraz.png

Ten przykład pokazuje, jak skopiować tekst do schowka. Pochodzi on z przykładu Copy / Paste data z przykładowej aplikacji Ninext.

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

Ograniczenia użycia navigator.clipboard.writeText()

Interfejs navigator.clipboard.writeText(text) podlega ograniczeniom bezpieczeństwa narzuconym przez przeglądarki. Musi zostać wyzwolony bezpośrednio przez działanie użytkownika (na przykład kliknięcie przycisku).

Jeśli między działaniem użytkownika a wywołaniem writeText() pojawi się opóźnienie lub przetwarzanie pośrednie (na przykład obliczenie), przeglądarka przestaje uznawać operację za zainicjowaną przez użytkownika i blokuje dostęp do schowka, aby zapobiec nadużyciom.

Dobre praktyki:

  • Wywoływać navigator.clipboard.writeText(text) bezpośrednio w obsłudze zdarzenia użytkownika (np. onclick).
  • Unikać wprowadzania operacji asynchronicznych lub opóźnień między działaniem użytkownika a wywołaniem funkcji.

Przykład poprawny:

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

Przykład niepoprawny (może nie zadziałać):

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