java - 在浏览器中显示来自字节数组的图像

Question

我有一个简单的 TCP 服务器套接字，它将获取一个字节数组。此 GET 来自于在此服务器上输入包含指向 gif 图像的 img src 链接的网站时，请求如下所示:

GET /myHome.htm HTTP/1.1
GET /house.gif HTTP/1.1

现在字节数组是这样完成的:

byte[] fileByte = Files.readAllBytes(filePath);

要打印包含此图像的网站，我这样做:

out.writeBytes(new String(fileByte));

输出:

DataOutputStream out= new DataOutputStream(socketClient.getOutputStream());

现在要显示图像，我想我必须使用其他东西

out.writeBytes()

但我不确定。任何人都知道如何使图像显示？现在图像根本不显示。

Answer 1

首先，请确保您的 GIF 文件没有损坏。 (我以前也遇到过)。

如果是这种情况，请尝试使用以下代码发送 GIF 文件:

byte[] fileByte = Files.readAllBytes(filePath);
writer.writeBytes("HTTP/1.1 200 OK\r\n");
writer.writeBytes("Content-Type: image/gif\r\n");
writer.writeBytes("Content-Length: "+fileByte.length+"\r\n");
writer.writeBytes("\r\n");
writer.write(fileByte, 0, fileByte.length);

然后尝试直接导航到“house.gif”而不是“myHome.htm”。在评论中让我知道这是做什么的。

以前的回答尝试:

我想我可能误解了你的问题。让我尝试不同的答案:

您不确定如何在服务器上确定何时返回 HTML 文件 myHome.htm 以及何时返回 house.gif？

我认为为此您需要简单地解析出请求的 URL。只需检查它是否包含“house.gif”。然后，根据这一点，您要么返回如上所述的 HTML 文件，要么发送 .gif 文件，确保使用

writer.write(fileByte, 0, fileByte.length);

发送二进制数据并且你设置了一个reply header of

Content-Type: image/gif

不过，在这两种情况下(对于 HTML 文件和 GIF 文件)，您都应该在发送的数据前加上正确的 HTTP 响应 header 。不要以错误的方式使用页面标题，但此站点可能会有所帮助:http://net.tutsplus.com/tutorials/other/http-headers-for-dummies/

并且只是为了确保:您的服务器将接收两个独立的请求。第一个会要求 HTML 文件，第二个会要求 GIF 文件。所以你发送一个或另一个。因此，没有“特殊方式”来发送 GIF 而不是 HTML 文件。您使用相同的 clientSocket。但这是不同的连接。

以前的回答:

我认为您可能缺少返回数据的 MIME 类型。尝试将以下 HTTP header 添加到您的回复中:

Content-Type: image/gif

实际上...您是否发送了正确的 HTTP 回复(包括 header ，特别是 Content-Length)？如果没有，请给我留言，我会发布您为此所需的代码。

如果出于某种原因，您无法设置内容类型 header 让浏览器知道您正在向它发送图像，您可以使用 XMLHttpRequest 将客户端上的二进制数据加载到 JavaScript 函数中，而不是而不是将其指定为 img 标签的源 Url。然后，您可以使用 JavaScript 将二进制数据编码为具有正确 mime 类型的 dataURI ( http://en.wikipedia.org/wiki/Data_URI_scheme)，并将其设置为图像的来源。

实际上，我刚刚注意到您的代码中的一些内容:

new String(fileByte)

可能将 fileBytes 解释为 unicode 字符而不是二进制。然后，当您将其写给作者时，它可能会搞砸，因为可能并非图像中的所有数据都是有效的 unicode。尝试用这个替换行:

writer.write(fileByte, 0, fileByte.length);

也许这就是您需要做的全部修复工作？？？