提供imageLink时使用FetchAPI显示图像-javascript

我一直在尝试使用后端服务器提供的imageLink获取图像

getImage(imageLink) {
    let result;
    const url = `https://company.com/internal/document/download?ID=${imageLink}`;
    const proxyurl = 'https://cors-anywhere-proxy.herokuapp.com/';
    const req = new Request(proxyurl + url, {
      method: 'GET',
      headers: {
        'mode': 'no-cors',
        'pragma': 'no-cache',
        'cache-control': 'no-cache'
      }
    });
     return fetch(req)
      .then(response => response.blob())
      .then(function(response) {
          console.log('response', response);
        var objectURL = URL.createObjectURL(response);
              return objectURL;
      });
  }

objectURL看起来像blob：当提供给img.src时，img src看起来像这样

<img _ngcontent-kab-c7="" class="img-fluid" width="60" src="[object Promise]">

在给定图像链接时，如何使用fetch api显示图像。非常感谢您的帮助

使用异步管道

<img class="img-fluid" width="60" [src]="objectURL | async">

从异步基本体中展开值

---

当我将src与src=“objectURL | async”绑定时，我得到了这个结果。createObjectURL（response）response.blob（）看起来像

blob{size:43849，键入：“text/html”}

当我在不执行URL.createObjectURL（response）的情况下将它提供给img时，它的src如下所示

为什么要下载图像并将其转换为blob？为什么不直接将其设置为IMG标记？提供的API用于下载图像