浏览器环境下如何从RGBA图像获取原始RGB值？

问题1：无需编写外部图像加载器能否获取原始RGB值？ #

不行。浏览器加载<img>或<canvas>时对RGBA图像的预乘处理是原生行为，一旦通过这两个元素加载图像，alpha≠255的像素RGB通道会被预乘，alpha=0的像素原始RGB值会直接丢失，没有办法通过原生API跳过这个过程拿到原始数据。如果要获取未被修改的原始RGB值，必须直接读取文件的原始字节数据，手动解析图像格式（比如PNG的文件结构），或者使用能直接读取原始像素数据的JS库——但这本质上还是需要自己实现或引入额外的加载逻辑，没法完全依赖浏览器原生的图像加载流程。

问题2：是否可忽略加载文件的alpha通道？ #

可以，但分两种情况：

• 如果只是想在后续处理中丢弃alpha通道，直接用opencv-js的Mat操作即可。比如加载图像后，将Mat转换为RGB格式：

  let src = cv.imread(document.getElementById("image"));
  let rgbMat = new cv.Mat();
  cv.cvtColor(src, rgbMat, cv.COLOR_RGBA2RGB);
  // 后续用rgbMat处理即可
  src.delete();
  

• 但如果是想忽略alpha通道同时保留原始未预乘的RGB值，那还是得绕开<img>的加载流程，直接读取文件原始数据解析，因为通过<img>加载后的RGB已经是被预乘修改过的，即使丢弃alpha也没法恢复原始值。

内容的提问来源于stack exchange，提问作者imakak