javascript - 捕获我的 Canvas 下的内容作为图像的一部分

Question

我想要做的是在我保存 Canvas 内部的内容时，将页面中 Canvas 对象下的内容作为图像的一部分。

我有一个应用程序可以创建一个 Canvas 并让您用鼠标在上面绘图。此绘图功能已到位，因此您可以在页面上绘图，就好像它们是笔记一样，因此在我可以保存带有“笔记”的图像或页面后，我可以在上面绘图。

到目前为止，我能够保存淹没在 Canvas 中的内容，但因为背景不是 Canvas 的一部分，所以我无法将它们一起保存。我尝试使用 html2canvas.js 进行试验，但它在我的情况下不起作用，因为它需要 DOM 对象并将它们重新绘制到 Canvas 中，如果最终图像，它不只是 Canvas 下的部分。

我想知道是否有办法做到这一点，或者以某种方式捕获该区域中的像素并在我创建它时将它们重新绘制为 Canvas 的一部分。

提前致谢!

Answer 1

可能是重复的，但我会给你一个非常简短的答案； 你不能(除非你做类似 html2canvas 的事情，它将 DOM 转换到 Canvas 元素上)

这是设计使然。如果您可以，那将是一个安全漏洞。不允许脚本在个人屏幕上使用任意内容创建图像。如果您搜索“html canvas security rules”，您会找到有关为什么不允许这样做的更多信息。