首页 > 解决方案 > iframe 内的画布不能从父级使用

问题描述

如何在来自父级和同一来源的沙盒 iframe 中使用画布。例如:

HTML:

<iframe id="myIframe" sandbox="allow-forms allow-same-origin" srcDoc='<canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;display: block"></canvas>'

JS:

var iframeDocument = document.getElementById("myIframe").contentDocument

var c = iframeDocument.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.moveTo(0,0);
ctx.lineTo(200,100);
ctx.stroke();

上面的代码不起作用,但代码在常规画布上工作,而不是在 iframe 内。

标签: javascript

解决方案


推荐阅读