jQuery ajax 从服务器获取图像数据

Posted 2023-03-28

【中文标题】jQuery ajax 从服务器获取图像数据

【英文标题】：jQuery ajax get image data from server

【发布时间】：2019-07-21 14:50:21

【问题描述】：

这是我的 Postman 测试请求：

这是标题：

这是我的 AJAX 请求：

var getAvatarData = new FormData();
getAvatarData.append('token', Cookies.get('user_token'));
$.ajax(
    method: "POST",
    data: getAvatarData,
    url: AppSettings.userData.photo_path + "s/" + AppSettings.userData.profile.photo,
     contentType: "multipart/form-data",
     processData: false,
).done(function (data) 
    console.log(data)
).fail(function (err) 
    console.log(err)
);

所以，我总是以 Not found 进入 Fail 块。

使用这些 ajax 设置：

method: "POST",
data: getAvatarData,
url: AppSettings.userData.photo_path + "s/" + AppSettings.userData.profile.photo,
dataType: "json",
mimeType: "multipart/form-data",
contentType: false,
processData: false,

我也失败了：

我错过了什么？这里有什么问题？

【参考方案1】：

我看到您已将 dataType 设置为 JSON，如果您将此值设置为 JSON，即使您得到 200 ok 并且响应文本格式不正确JSON 字符串，您将进入错误处理程序。您可以在失败对象中看到您获得了 200 ok，并且响应文本包含内容。

尝试将您的数据类型更改为 image/png，看看会发生什么。

另外，你可以试试这段代码，看看它是否适合你。

$.ajax(
  method: "GET",
  url: 'https://httpbin.org/image/jpeg',
  dataType: "image/jpeg",
).done(function(data) 
  console.log(data);
).fail(function(err) 
  console.log(err);
);

【讨论】：

您的代码与 2 场景中描述的相同 = 失败并返回 200

您是否尝试更改代码中的数据类型？您点击了失败处理程序，因为您的代码需要 JSON 数据，但它没有得到。您甚至可以出于测试目的将其删除，jquery 会尝试猜测它。