ReactJS：无法通过REST API响应在UI中呈现图像

Question

我已经构建了一个返回图像的REST API，并且我通过PostMan代理成功获得了响应。 在我的React Code中，我有这个：

return fetch(url, sInit)
  .then((response) => {
    let blb = new Blob([response.body], { type: 'image/jpeg' });
    let fileUrl = (window.URL || window.webkitURL).createObjectURL(blb);
    window.open(fileUrl);
  })

生成的blob网址没有图片。我错过了什么？

Answer 1

您可能希望fetch使用内置的blob()方法：

＆＃13;

＆＃13;

fetch(
  'https://images.unsplash.com/35/SRkdurVYQFSFkMyHVwSu_spinnenweb-9536.jpg?dpr=2&auto=compress,format&fit=crop&w=376&h=251&q=80&cs=tinysrgb&crop='
)
  .then(res => res.blob())
  .then(blob => {
    let fileUrl = (window.URL || window.webkitURL).createObjectURL(blob);

    const img = document.createElement('img');
    img.src = fileUrl;
    document.querySelector('body').appendChild(img);
  });

＆＃13;

＆＃13;

＆＃13;