【问题标题】:Clipboard Copy / Paste on Content script (Chrome Extension)剪贴板复制/粘贴内容脚本(Chrome 扩展)
【发布时间】:2015-08-06 00:34:52
【问题描述】:

我正在使用内容脚本来操作 DOM 中的数据。 我一直在一个弹出页面上成功使用 document.execCommand('copy');

我现在正在寻找一种让它在内容脚本上工作的方法。 我已经检查了内容脚本here 的限制,但我不明白剪贴板控件是否受到限制。 我也在这里检查了答案 - 在 stackoverflow 中,但似乎大多数都不确定,有些是几年前的,所以可能会有变化。

即使是有限的,是否有可能有某种解决方法?

谢谢!

我正在发布我拥有的当前脚本。

manifest.json

{
  "name": "Page action by URL",
  "version": "1.0",
  "description": "Прибавка за обработка на данните от НБДН.",
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "page_action" :
  {
    "default_icon" : "icon-19.png",
    "default_title" : "Приложение за НБД за PHP"
  },
  "permissions" : [
    "clipboardWrite",
    "clipboardRead",
    "declarativeContent",
    "activeTab",
    "tabs",
    "https://nbd.grao.government.bg/graoappshort/*"
  ],
  "icons" : {
    "48" : "icon-48.png",
    "128" : "icon-128.png"
  },
  "manifest_version": 2
}

background.js

chrome.runtime.onInstalled.addListener(function() {
  // Replace all rules ...
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    // With a new rule ...
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: { urlContains: 'nbd.grao.government.bg/graoappshort/' },
          })
        ],
        actions: [ new chrome.declarativeContent.ShowPageAction() ]
      }
    ]);
  });
});


chrome.pageAction.onClicked.addListener(function(tab) {
  chrome.tabs.executeScript(null, {file: 'page-editor.js'});
  chrome.tabs.insertCSS(null, {file: "style-inject.css"});
});

还有page-editor.js里面的函数

function(){
      var copyFrom = document.createElement("textarea");
      copyFrom.textContent = PoleIME.value;
      document.body.appendChild(copyFrom);
      copyFrom.focus();
      document.execCommand('SelectAll');
      document.execCommand('Copy');
      //document.body.removeChild(copyFrom);
      }

【问题讨论】:

  • 你能确认脚本完全被注入了吗?您也应该尝试传递 tab.id 而不是 null
  • 什么是PoleIME?它是包含在您的page-editor.js 中还是包含在页面自己的脚本中?
  • 是的,我确认脚本被注入并且 DOM 被成功操作。 PoleIME 是一个用数据填充的输入字段。它包含在脚本中。 textarea copyForm 成功附加到正文并成功填充和选择。我在页面上看到了结果,但是复制功能不起作用。整个脚本处于工作状态,未优化,有 6600 行 - 这就是我没有包含它的原因。
  • var PoleIME=document.createElement("input"); PoleIME.type="text"; PoleIME.name="IME"; PoleIME.id="IME"; PoleIME.size=60; PoleIME.value="whatever text i put inside";

标签: google-chrome-extension content-script


【解决方案1】:

内容脚本目前无法使用剪贴板。将来,一旦解决了crbug.com/395376,那么问题中显示的代码将按预期工作。

在修复该错误之前,您必须将数据发送到后台页面并从那里复制文本:

// content script
chrome.runtime.sendMessage({
    type: 'copy',
    text: 'some text to copy'
});

background pageevent page 上的脚本:

chrome.runtime.onMessage.addListener(function(message) {
    if (message && message.type == 'copy') {
        var input = document.createElement('textarea');
        document.body.appendChild(input);
        input.value = message.text;
        input.focus();
        input.select();
        document.execCommand('Copy');
        input.remove();
    }
});

【讨论】:

  • 非常感谢您的帮助。希望我明天能在办公室里把这件事弄好。届时将发表评论。
  • 完美运行!你太棒了:)
  • 自 2014 年 9 月起该错误已修复
  • 我无法在我的 Mac 上完成这项工作 [chrome 版本 49.0.2623.87(64 位)]
  • @Brook 它在这里工作(Linux),所以它可能是一个特定于 Mac 的错误。跟踪的问题有很多错误,例如crbug.com/467296。您的错误听起来像crbug.com/334062,“应用程序:写入剪贴板不能从背景页面工作,但可以从应用程序窗口页面工作”。某人suggested<html><body> 元素使用非零宽度。试试看!
猜你喜欢
  • 2010-10-18
  • 2011-05-13
  • 2012-11-27
  • 1970-01-01
  • 2023-01-31
  • 1970-01-01
  • 2020-03-30
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多