圖片下載使用S3 url

Question

在我的項目中，我正在嘗試下載圖像，為此添加了以下幾行，

const downloadImage = (image: string) => {
    const a = window.document.createElement("a");
    const blob = new Blob([image], { type: "octet/stream" });
    console.log("blob", blob);
    const x = window.URL.createObjectURL(blob);
    console.log("x", x);
    a.href = window.URL.createObjectURL(blob);
    a.download = "image.png";
    document.body.appendChild(a);
    a.click();
  };

這里的圖像是下載的，但是當它打開時它看起來像這樣，

當我安慰價值觀時

請給我一些解決方案來解決這個問題。

Answer 1

我相信您使事情過於復雜，並且對多種方法進行了一些奇怪的融合。 如果image變量只是 A url 那么你可以直接在你的 JSX 中渲染一個帶有下載屬性的鏈接。

<a href={image} download>Download</a>