tengo un boton
Cuando hice clic en COPIAR
copyImageLinkText({ mouseenter, mouseleave }, e) { this.showCopiedText = !this.showCopiedText navigator.clipboard.writeText(this.imageLink) clearTimeout(this._timerId) mouseenter(e) this._timerId = setTimeout(() => mouseleave(e), 1000) },Esta línea parece funcionar perfectamente localmente en mi MacBook Pro
navigator.clipboard.writeText(this.imageLink)No funciona cuando lo compilo y lo implemento en mi servidor de desarrollo.
TypeError: no se pueden leer las propiedades de undefined (leyendo 'writeText')
El uso de navigator.clipboard requiere un origen seguro. Entonces, si su entorno de desarrollo se sirve a través de HTTP, entonces el método del portapapeles no estará disponible.
De acuerdo con los documentos del Clipboard de MDN: "Esta función solo está disponible en contextos seguros (HTTPS)"
Tal vez podría verificar si este método está disponible con window.isSecureContext y deshabilitar el botón Copiar texto en consecuencia.
La mejor opción es usar HTTPS en su entorno de desarrollo.
Pero dado que solicitó una solución alternativa, aquí hay una muestra de trabajo (muy pirateada). Utiliza el comando Document.exec , que está en desuso en favor de ClipboardAPI .
function unsecuredCopyToClipboard(text) { const textArea = document.createElement("textarea"); textArea.value = text; document.body.appendChild(textArea); textArea.focus(); textArea.select(); try { document.execCommand('copy'); } catch (err) { console.error('Unable to copy to clipboard', err); } document.body.removeChild(textArea); } Luego, puede usar navigator.clipboard == undefined para usar el método alternativo; de lo contrario, use la función normal navigator.clipboard.writeText(...) donde se admita.
Es mejor usar un async y poner su código en el bloque try catch .
async copyCode() { try { await navigator.clipboard.writeText(this.input); } catch (e) { console.log(e); } }