我已将 JPEG 图像动态加载到 2D html 画布中，我想访问原始 YCbCr 像素值。
据我了解，JPEG 在 YCbCr 中对像素数据进行编码，但 chrome 在使用 getImageData() 访问它时似乎将其转换为 RGB。
我曾尝试使用 RGB 到 YCbCr 转换计算，但它似乎是一种有损转换，因为它们不能完美地一对一映射。
是否可以在 JavaScript 中访问原始 YCbCr 像素值？
【问题讨论】：
标签： javascript canvas jpeg rgb yuv
是和不是。
当浏览器使用本机方法（即图像元素）加载图像时，浏览器会自动将 YCbCr（在 JPEG 的情况下）转换为 RGB 空间，并且支持它的浏览器会应用 ICC 和伽马校正。
这意味着当图像加载并准备好使用时，它已经在 RGB 空间中（这是正确的，因为显示器是 RGB）。画布在此过程中没有任何作用，并且将始终包含 RGBA 格式的像素。因此，所有支持画布的浏览器在使用getImageData()时都会以RGBA形式返回数据。
访问原始 YCbCr 的唯一方法是自己对原始文件进行低级解析。您可以使用任何可以迭代字节的语言（包括 JavaScript）来执行此操作。对于 JS，我建议使用类型化数组和 DataViews 来解析数据，但请注意：这很乏味且容易出错（因为它本身就是一个完整的项目），但如果您绝对需要原始数据，则完全可以这样做。
另一种方法是将 RGB 转换回 YCbCr，但色度以及上述颜色和伽马校正可能会影响结果，不会使其与原始原始数据（无论如何都是压缩形式）相同。您还可以使用 canvas 元素上的toDataURL() 方法将画布导出为 JPEG。
【讨论】：
我知道这是一个非常古老的问题，但想提供 Chrome now rasterizes 直接来自 YUV 平面的一些 JPEG 和 WebP 图像的更新。您必须启用 GPU 光栅化（并禁用 Metal），并且有时可能需要从 chrome://flags 启用该功能
您可以运行跟踪、解码图像并包含眨眼类别并查看是否弹出任何事件以进行 YUV 解码。如果是这样，那么您可以尝试尝试直接从 JavaScript 访问 YUV 平面，尽管我承认它是否会开箱即用（出于管道/安全原因）。
【讨论】：