我如何从HTML5视频播放器帧访问原始像素数据

How do I access raw pixel data from an HTML5 video player frame?

本文关键字：原始 访问 像素 像素数 数据 播放器 HTML5 视频      更新时间：2023-09-26

我对此做了一些谷歌搜索，但似乎找不到它是如何完成的结果。我想在它的核心实验图像识别，而不是一个库，我正试图弄清楚如何访问帧的原始像素数据。

怎么做?我想查看单个视频帧的像素网格数据结构，并在原始数据上运行公式，以明确我的要求。我很擅长JavaScript -我不是在寻找一些关于这方面的大教程，我只是想学习如何从视频帧访问图像数据。例如，使用什么方法或存在什么属性来访问像素数据。

您将视频帧绘制到html5画布中，然后使用getImageData从那里获得像素。

问题的主要来源是同源策略:只有当脚本和视频在同一个主机上时，它才会起作用。

本页有一些不使用库直接访问的例子:http://html5doctor.com/video-canvas-magic/

您可以将视频绘制到画布中。然后从画布上，使用getImageData。它返回一个具有data属性的ImageData对象。这是一个Uint8ClampedArray，它包含rgba序列的像素数据。

相关文章：