web-dev-qa-db-fra.com

l'utilisation correcte de execcommand ("paste") dans une extension chrome

J'essaie de coller des données de presse-papiers dans une zone de texte à l'aide de execcommand("paste") avec une extension chome, mais je n'arrive pas à le faire fonctionner. Les autorisations sont définies. J'ai essayé de définir focus() sur la zone de texte, mais document.execCommand("paste") ne fait rien et je ne reçois aucune erreur. Appeler execcommand("paste") à partir de la page d'arrière-plan ne fait également rien.

<form>
     <textarea id="ta"></textarea>    
</form>
<script type="text/javascript">
    document.findElemetById("ta").focus();
    document.execCommand("paste");
</script>
javascriptgoogle-chrome-extension
19
monopoint

La fonctionnalité du Presse-papiers est un élément clé de mon extension , donc j'ai vu tous les problèmes normaux. Sur ma page d’arrière-plan, j’expose une fonction copy et paste et la page elle-même contient <textarea id="sandbox"></textarea>;

function copy(str) {
    var sandbox = $('#sandbox').val(str).select();
    document.execCommand('copy');
    sandbox.val('');
}

function paste() {
    var result = '',
        sandbox = $('#sandbox').val('').select();
    if (document.execCommand('paste')) {
        result = sandbox.val();
    }
    sandbox.val('');
    return result;
}

J'utilise jQuery pour plus de simplicité, mais vous voyez l'idée. Maintenant, chaque fois que je veux utiliser la fonctionnalité de presse-papiers, j'appelle simplement la fonction correspondante. Les autres pages de mon extension peuvent accéder à cette API via chrome.extension.getBackgroundPage () mais vous pouvez également utiliser chrome.runtime.getBackgroundPage (rappel) si votre page d'arrière-plan est une page d'événement .

Je ne sais pas si c'est la meilleure pratique ou si une telle chose existe encore pour cette fonctionnalité, mais cela fonctionne vraiment pour moi et est très propre.

39
Alasdair

C'est trop long pour commenter l'excellente réponse d'Alasdair. Je crée donc une autre réponse. La réponse d'Alasdair est excellente et a très bien fonctionné pour moi, mais en tant que nouveau venu dans les extensions Chrome, il m'a encore fallu un certain temps pour que cela fonctionne. Pour quiconque occupant un poste similaire, voici une extension de sa réponse.

Les pages d'arrière-plan/événement peuvent interagir avec le Presse-papiers du système, à condition que vous ayez demandé les autorisations appropriées. Ils ne peuvent pas interagir avec le DOM des pages que l'utilisateur a chargées. Les scripts de contenu ne peuvent pas interagir avec le Presse-papiers du système, mais ils peuvent également interagir avec le DOM des pages que l'utilisateur a chargées. Jetez un coup d’œil à l’explication de l’architecture d’extension pour un bon aperçu de tout cela.

Cela signifie essentiellement que vous devez effectuer les actions copier/coller à partir du Presse-papiers du système dans les pages de votre événement/arrière-plan, comme décrit plus haut par Alasdair. Tout collage ou copie à partir du DOM de la page affichée par l'utilisateur doit avoir lieu dans votre script de contenu. Les deux scripts sont capables de communiquer assez facilement avec message en passant .

J'ai une extension dont le seul but est de coller, et l'architecture est en grande partie issue de ce post. Si vous voulez voir la technique ci-dessus dans la pratique, regardez le code . En particulier, background.html , background.js et contentscript.js .

Si vous êtes vraiment pressé, voici un Gist .

18
user1978019
  function PasteString() {
    var editor = document.getElementById("TemplateSubPage");
    editor.focus();
  //  editor.select();
    document.execCommand('Paste');
}

function CopyString() {
    var input = document.getElementById("TemplateSubPage");
    input.focus();
   // input..select();
    document.execCommand('Copy');
    if (document.selection) {
        document.selection.empty();
    } else if (window.getSelection) {
        window.getSelection().removeAllRanges();
    }
}

J'espère que cela fonctionnera pour vous

0
Nikhil Ghuse