javascript 复制到剪贴板只在本地主机上工作

qojgxg4l 于 2023-02-02 发布在 Java

关注(0)|答案(1)|浏览(111)

我有以下功能复制到剪贴板：

function getScreenShot(target){

var src = document.getElementById(target);

html2canvas(src).then(function(canvas) {
    //document.src.appendChild(canvas);
    canvas.toBlob(function(blob) {
        navigator.clipboard
        .write([
            new ClipboardItem(
            Object.defineProperty({}, blob.type, {
                value: blob,
                enumerable: true
            })
            )
        ])
        .then(function() {
            // do something
        });
    });
}

这只适用于我的本地主机。当我在服务器上运行它，内容不被复制。我读到它与安全问题有关。我该如何解决它？

JavaScript

来源：https://stackoverflow.com/questions/75303999/copy-to-clipboard-only-works-on-localhost

1条答案

按热度按时间

cs7cruho1#

这是代码的一个工作版本。注意，图像需要在同一个源上，或者被代理。

const button = document.querySelector('button');

const createScreenshot = async (root) => {
  const canvas = await html2canvas(root);
  return new Promise((resolve) => {
    canvas.toBlob((blob) => {
      resolve(blob);
    });
  });
};

button.addEventListener('click', async () => {
  button.style.display = 'none';
  const blob = await createScreenshot(document.body);
  try {
    await navigator.clipboard.write([
      new ClipboardItem({
        [blob.type]: blob,
      }),
    ]);    
  } catch (err) {
    alert(`${err.name}: ${err.message}.`);
  } finally {
    button.style.display = '';
  }
});

您可以在https://sugary-hickory-pixie.glitch.me/中看到这段代码的运行情况。

赞(0）回复(0）举报 2023-02-02

我来回答

javascript 复制到剪贴板只在本地主机上工作

1条答案

相关问题

热门标签

最新问答