javascript - 无法发布消息(CanvasRenderingContext2D)

Question

作为自定义库的一部分，我隔离了以下代码片段，从主浏览器的线程运行，这会产生错误:DataCloneError:无法克隆对象。

该代码段的目标是为 worker 提供 CanvasRenderingContext2D 的实例。

canvas = document.createElement("canvas");
canvas.width = 1;
canvas.height = 1;

worker.postMessage(canvas.getContext("2d"));

postMessage 失败是否是由于 CanvasRenderingContext2D 的特定属性无法“克隆”而导致的？我可以考虑采取哪些解决方法？

Answer 1

Is postMessage failure due to a specific attribute of CanvasRenderingContext2D which cannot be "cloned"?

我猜这些就是所有的功能。

Things that don't work with structured clones:

Error and Function objects cannot be duplicated by the structured clone algorithm; attempting to do so will throw a DATA_CLONE_ERR exception.

这听起来像你所面临的。

您无法发送整个 <canvas>元素之一，因为

Attempting to clone DOM nodes will likewise throw a DATA_CLONE_ERR exception.

我不知道这是否有效，但您可能需要的只是属性中的上下文(fillStyle、lineHeight 等)。您可以提取这些( JSON.parse(JSON.stringify(canvas.getContext("2d"))) )并尝试发送它们。 :/