websocket api - 图像编码在客户端不产生图像类型

Posted 2023-02-16

【中文标题】websocket api - 图像编码在客户端不产生图像类型

【英文标题】：websocket api - image encoding yields no image type on client side

【发布时间】：2016-04-06 13:59:03

【问题描述】：

我在 tomcat 8 上有一个 Web 套接字服务器，具有以下二进制用途：

sess.getBasicRemote().sendBinary(bf);

其中 bf 是一个简单的图像到字节的转换，如下所示：

BufferedImage img = ImageIO.read(...);
ByteArrayOutputStream baos = new ByteArrayOutputStream();
ImageIO.write( img, "png", baos );
ByteBuffer bf = ByteBuffer.wrap(baos.toByteArray());

此代码最终在客户端 (javascript) 作为 blob 并最终呈现为浏览器中的图像，这似乎工作得很好。 唯一奇怪的是图像被渲染为无类型： data:;base64,iVBORw0KGgoAAAA......== 没有类型 (image/png)。 如果我对相同的图像使用在线编码器，我会得到： data:image/png;base64,iVBORw0KGgoAAAA......==（注意 image/png 类型）

所以我的问题是为什么会这样？ 我的图像到字节转换错误吗？就像我说的那样，图像显示得很好，只是缺少类型。 请注意，从 java websocket 服务器发送的数据未使用 base 64 编码，这是我在客户端执行的操作（通过 JS 的 FileReader.readAsDataURL(blob) - 非常常见）。

非常感谢，很抱歉发了这么长的帖子

【参考方案1】：

不，您的图像到字节数组的转换没有错。字节数组转换将图像视为二进制流，与其中包含的MediaType无关。

您要查看的类型是Data URI 媒体类型。 用于将文件转换为字节数组的普通 java 代码不会为您提供符合 data URL scheme 的 URL。

来自 RFC

data:[][;base64],

是 Internet 媒体类型规范（带有 可选参数。）“;base64”的出现表示数据 被编码为base64。如果没有“;base64”，则数据（作为 octets) 使用 ASCII 编码来表示 安全 URL 字符范围并使用标准 %xx 十六进制编码 超出该范围的八位字节的 URL。如果 被省略，它 默认为 text/plain;charset=US-ASCII。作为速记， "text/plain" 可以省略，但提供 charset 参数。

RFC source

当您在 Javascript 中创建 Blob 对象时，您可以选择将 MediaType 传递给它，这样当您使用 FileReader.readAsDataURL 读取它时，它会填充适当的媒体类型。

示例如下

var blob = new Blob( [ arrayBufferView ],  type: "image/jpeg"  );

Source

您的代码中可能不需要BufferedImage，简单的文件读取就足够了。

以下等同于您的代码Apache FileUtils。

ByteBuffer bf = ByteBuffer.wrap(FileUtils.readFileToByteArray('test.jpg'));

【讨论】：

您好，感谢您详细而快速的回复。 blob 出现在 websocket 的客户端，检查这个 blob 那里没有媒体类型......所以我无法在客户端确定媒体类型是什么......我想我不应该使用二进制文件，我会使用java服务器端的json字符串并添加一个类型属性，并以base 64编码另一个属性中的字节数组。这是我能想到的唯一解决方案。再次感谢！

不客气，是的，这似乎是一种更好的方法，或者您可以使用适当的媒体类型在服务器上创建数据 URL 字符串。