Question

我在chrome中面临一个奇怪的问题。我从服务器获取一个在Firefox中运行良好的图像，但在chrome中，图像加载一次然后显示为损坏的图像。

在Chrome控制台中，我收到以下消息：

Resource interpreted as Image but transferred with MIME type text/html: "http://46.137.249.133:8080/Smart/Request/query.htm?ReqType=SessionUnawareAttachmentDownloadReqType&Thumbnail=Yes&AttachmentRowID=344929138455741006"
GET http://46.137.249.133:8080/Smart/Request/query.htm?ReqType=SessionUnawareAttachmentDownloadReqType&Thumbnail=Yes&AttachmentRowID=344929138455741006

我还检查了mime类型，但是它的image / jpeg。这是getimagesize()

的输出

Array
(
    [0] => 289
    [1] => 202
    [2] => 2
    [3] => width="289" height="202"
    [bits] => 8
    [channels] => 3
    [mime] => image/jpeg
)

Answer 1

在query.html中，在输出任何内容之前（理想情况下，在脚本的最开头），添加：

header('Content-Type: image/jpeg');

它会告诉您的浏览器返回的内容是JPEG图像。

Answer 2

这是curl --verbose <your-url>的输出，您可以看到您的网络服务器（在端口8080上）正在将文件宣传为text/html。

< HTTP/1.1 200 OK
< Server: Apache-Coyote/1.1
[...]
< Content-Disposition: attachment; filename="Hall2.JPG"
< Content-Type: text/html;charset=ISO-8859-1

您可以通过在每个HTTP响应中添加Content-Type标题行来设置正确的媒体类型来解决此问题。

在PHP中，使用header函数执行此操作，例如：

header('Content-Type: image/jpeg');

对于Java Servlet页面非常相似：

HttpServletResponse res;
res.setContentType("image/jpeg");

无法为Chrome中的图片加载资源

2 个答案: