API navigator.clipboard

Ler e gravar na área de transferência do usuário pode ser um recurso muito útil e perigoso. Se usado corretamente, é uma grande conveniência para o usuário; se usado de forma duvidosa, o usuário pode sofrer consequências catastróficas. Imagine um número de conta ou endereço de carteira errado sendo copiado. É por isso que a cópia e a colagem programática precisam ser protegidas e que a API JavaScript Clipboard exige permissão explícita do usuário para permitir que um site a utilize.

Para ler a área de transferência do usuário, o usuário usa a função readText :

const clipboardData = await navigator.clipboard.readText();

Para gravar na área de transferência do usuário, use o método writeText :

await navigator.clipboard.writeText('');

Obviamente, a API é muito fácil de usar: cada método retorna uma Promise para que o senhor possa usar async/await ou then callbacks. A parte difícil é encontrar o equilíbrio de quando usar cada um. Leituras desnecessárias parecerão invasivas, e gravações desnecessárias dissolverão significativamente a confiança do usuário.

Quando o senhor pode querer gravar na área de transferência? Possivelmente depois que o usuário colar uma frase-semente, uma senha ou um número de cartão de crédito em campos de formulário com o mesmo nome.

É claro que o senhor pode usar as várias bibliotecas disponíveis para simular essa API, mas saiba que existe uma API oficial. E, como sempre, estou ensinando como usá-la – cabe ao senhor garantir que seja o momento e a ferramenta certos para o trabalho!