web-dev-qa-db-fra.com

navigator.clipboard n'est pas défini

Pourquoi est-ce navigator.clipboard toujours undefined dans l'extrait de code suivant?

var clipboard = navigator.clipboard;
if (clipboard == undefined) {
    console.log('clipboard is undefined');
} else {
    clipboard.writeText('stuff to write').then(function() {
        console.log('Copied to clipboard successfully!');
    }, function() {
        console.error('Unable to write to clipboard. :-(');
    });
}

Plus d'informations sur l'API du presse-papiers peuvent être trouvées ici .

Version Chrome: 68.0.3440.106.

Je suis sûr que cela fonctionnait à un moment donné, mais ce n'est plus le cas. C'est déroutant car ce tablea suggère que l'API Clipboard est implémentée dans Chrome (depuis un certain temps), mais ce tablea de spécifique Les méthodes de l'API suggèrent qu'aucune des méthodes de l'API n'est prise en charge ??

8
drmrbrewer

Cela nécessite une origine sécurisée - HTTPS ou localhost (ou désactivée en exécutant Chrome avec un indicateur). Tout comme pour ServiceWorker, cet état est indiqué par la présence ou l'absence de la propriété sur le navigateur objet.

https://developers.google.com/web/updates/2018/03/clipboardapi

Ceci est noté dans la spécification avec [SecureContext] sur l'interface: https://w3c.github.io/clipboard-apis/#dom-navigator-clipboard

Vous pouvez vérifier l'état de window.isSecureContext pour savoir si c'est la raison pour laquelle une fonctionnalité n'est pas disponible. Contextes sécurisés | MDN

Et oui, vous devez configurer HSTS pour vous assurer que les redirections HTTP vers HTTPS.

18
Josh Lee