HTTP PUT a PNG with Fetch API

Question

我有一個名為imgBase64的 Base64 編碼圖像。

如何使用 Fetch API 從瀏覽器 HTTP PUT 這個 PNG？

const response = await fetch(url, {
    method: 'put',
    headers: {
        'Content-Type': 'image/png'
    },
    body: atob(imgBase64) // <--------- what should I be doing here?
});

Answer 1

如果imgBase64已經編碼，則可以添加Content-Transfer-Encoding header 並刪除atob方法：

const response = await fetch(url, {
    method: 'put',
    headers: {
        'Content-Type': 'image/png',
        'Content-Transfer-Encoding': 'base64'
    },
    body: imgBase64
});

Answer 2

這最終為我工作：

let imageResponse = await fetch(imgBase64); 

const putResponse = await fetch(url, {
    method: 'put',
    headers: {
        'Content-Type': 'image/png',
    },
    body: await imageResponse.blob()
});