Question

我将图像存储在我的Express Server应用程序中的静态文件夹中。到目前为止，这按预期工作。重要的代码如下

app.use('/uploads', express.static(Path.join(__dirname, `/../uploads`)))

现在，从客户端应用程序中，我需要对这些图像执行GET请求并显示它们，就目前情况而言，仅对图像执行请求会给我不可用的数据，我不知道该如何处理。这是我正在谈论的示例：

IHDRXZ��9�|iCCPICC Profile(�c``*I,(�aa``��+)
rwR���R`������ �`� ��\\��À|����/���J��yӦ�|�6��rV%:���wJjq2#���R��d

有没有办法获取这些数据并将其用作图像？

我还阅读了通过客户端和服务器之间的网络发送图像的另一种方法，即设置GET请求。从this thread开始，基本上使用express'.sendFile，但是由于找不到404，因此无法正常工作。还有其他问题吗？

无论如何，我想问题是如何获得可以在客户端应用程序上显示的文件格式？

这是我的客户代码的样子：

return isomorphicFetch(`${MY_URL}/${imageId}`, {
    headers: {
      Accept: 'application/json'
    }
    method: 'GET'
  })
.then(res => {
    console.log('My fetched image', res)
    return res
 })

Answer 1

为什么不只使用<img>元素？

const img = document.createElement('img');
img.src = `${MY_URL}/${imageId}`;
someplace.appendChild(img);

BTW 如果出于某种原因（例如发送自定义HTTP标头）而要使用fetch()：

fetch(`${MY_URL}/${imageId}` /*...*/)
  .then(res => res.blob())
  .then(blob => {
    const img = document.createElement('img');
    img.src = URL.createObjectURL(blob);
    somewhere.appendChild(img);
  });

从静态文件夹获取图像文件并将其显示在客户端应用程序中

1 个答案: