Question

在我的项目中，有一个URL通常会响应带有Content-Type:image/png的图像，该图像由Java用户的数据动态绘制。

但有时会导致某些原因，用户不应该看到图像，或者无法使用用户的数据绘制图像。在这种情况下，服务器将响应包含错误信息的JSON结果 Content-Type:application/json; charset=utf-8

这是否可以在服务器响应Content-Type:image/png时显示图像，否则在服务器响应Content-Type:application/json; charset=utf-8时提醒错误信息？

我可以处理任何一种响应内容类型，但在一个请求中处理两种内容类型时都很困难。这有可能吗？

修改

我尝试使用像

这样的AJAX

<img id="preview-img"/>

$.ajax({
    url: "/preview",
    type: "GET",
    dataType: "JSON",
    success: function(data) {
        if (!data.success) {
            alert(data.msg);
        }
    },
    error: function() {
        alert("occur error");
    }
});

使用上面的代码，当服务器响应带有错误消息的JSON结果时，alert(data.msg)可用，但是当服务器响应正确图像时将触发alert("occur error")。

我重新尝试删除dataType：

$.ajax({
    url: "/preview",
    type: "GET",
    success: function(data) {
        if (!data.success) {
            alert(data.msg);
        }
    },
    error: function() {
        alert("occur error");
    }
});

很高兴看到success功能被触发，无论是服务器响应图像还是JSON
但我不知道如何使用看起来像

的响应数据来显示Image

ÿØÿàJFIFÿÛC     
 $.' ",#(7),01444'9=82<.342ÿÛC          
2!!22222222222222222222222222222222222222222222222222ÿÀ%a"ÿÄ    
ÿÄµ}!1AQa"q2¡#B±ÁRÑð$3br    
%&'()*456789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz¢£¤¥¦§¨©ª²³´µ¶·¸¹ºÂÃÄÅÆÇÈÉÊÒÓÔÕÖ×ØÙÚáâãäåæçèéêñòóôõö÷øùúÿÄ 
ÿÄµw!1AQaq"2B¡±Á    #3RðbrÑ
$4á%ñ&'()*56789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz¢£¤¥¦§¨©ª²³´µ¶·¸¹ºÂÃÄÅÆÇÈÉÊÒÓÔÕÖ×ØÙÚâãäåæçèéêòóôõö÷øùúÿÚ?÷ú(¢
......

一堆垃圾。

现在我暂时不处理JSON结果

<img id="preview-img"/>

var image = new Image();
image.onload = function () {
    $("#preview-img").attr("src", "/preview");
};
image.onerror = function() {
    alert("could not load image");
};

image.src = "/preview";

Answer 1

请求失败且设置了“dataType”，因为JQuery尝试将响应解析为JSON，但如果服务器响应了图像，则无法执行此操作。因此，将调用错误回调。

在我看来，首选解决方案是在服务器无法提供图像的情况下设置HTTP代码！= 200（例如404，未找到）。在这种情况下将调用错误回调，您可以向用户显示错误对话框。否则，您可以继续在成功回调中显示图像。

关于“我不知道如何使用看起来像”的响应数据来显示图像：Using jQuery's ajax method to retrieve images as a blob

JavaScript在一个请求中处理不同的Content-Type

1 个答案: