如何仅使用客户端 JS 创建电报帖子小部件（在生成的 iframe 内）的屏幕截图？-解网

问：

我想创建电报小部件的屏幕截图并将其放在页面上。代码链接在这里。;我还使用 devtools “创建节点屏幕截图”轻松地制作了 iframe 的屏幕截图，是否有任何 JS 方法可以从代码中做同样的事情？（我试过谷歌，但一无所获）。 HTML格式：


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Telegram widget</title>
</head>
<body>
      <script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>

  <script async src="https://telegram.org/js/telegram-widget.js?22" data-telegram-post="telegram/83" data-width="100%"></script>
</body>
</html>

JS：

window.onload = function() {
      var iframe = document.getElementById('telegram-post-telegram-83');
      var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

      html2canvas(iframeDocument.body).then(function(canvas) {
        document.body.appendChild(canvas);
      });
    };

我尝试访问 iframe body，但这不起作用。我收到错误：

"<a class='gotoLine' href='#61:75'>61:75</a> Uncaught SecurityError: Failed to read a named property 'document' from 'Window': Blocked a frame with origin \&quot;https://fiddle.jshell.net\&quot; from accessing a cross-origin frame."

javascript iframe 电报 html2canvas 网页-截图

如何仅使用客户端 JS 创建电报帖子小部件（在生成的 iframe 内）的屏幕截图？

How to create screenshot of a telegram post widget (inside generated iframe) only with client-side JS?

评论