javascript - 对象到 Canvas javascript

Question

我正在智能电视上测试 javascript，
我尝试将对象视频放到 Canvas 上。使用 html5 视频标签，它可以在我的浏览器中使用，但不能在我的智能电视中使用。
但是当我尝试使用对象播放器时，我收到以下错误消息:

Failed to execute 'drawImage' on 'CanvasRenderingContext2D': Theprovided value is not of type '(HTMLImageElement or HTMLVideoElementor HTMLCanvasElement or ImageBitmap)'

在使用 (id, object id,object src..) 进行多次测试后，结果是一样的，我不知道如何将对象视频放到 Canvas 上。
这是一个简单的html测试:

<canvas id="test" width="300" height="300"></canvas>
<div id="test" style="left: 0%; top: 0%; width: 25%; height: 25%; position: fixed;">
    <object type="application/avplayer" style="width: 480px; height: 270px;"></object>
</div>

和js:

const canvas = document.querySelector("canvas");
const ctx = canvas.getContext("2d");
const video = document.getElementsByTagName('object');
//const video = document.getElementsById('idVideo');
ctx.drawImage(video, 0, 0, canvas.width, canvas.height)

这是我的目标示例，但我不能使用视频标签: http://jsfiddle.net/on1kh4o0/
任何想法或黑客获得与对象相同的结果？

Answer 1

您不能直接在 Canvas 上绘制 HTMLObjectElement ( <object> )，它未定义为 CanvasImageSource .
有关信息，目前唯一定义为这种类型的对象是

HTMLImageElement

SVGImageElement

HTMLVideoElement

HTMLCanvasElement

ImageBitmap

离屏 Canvas

尽管它仍然只是规范草案的一部分，但预计 CSSImageValue还有 gets added to this list .
但是 HTMLObjectElement 不是这个列表的一部分，而且肯定永远不会。
实际上，即使您可以在