本文共 3180 字，大约阅读时间需要 10 分钟。

������������������������������������

���������������������������������������������������������������������������������������������������������������������������������������������������blob���������������������������

���������������������������������

���������������������������������������������������JSON������������������������blob������������������������������������������������binary/octet-stream���

���blob���������������������������������������������������������������������**Failed to execute 'createObjectURL' on 'URL'**���������������������������������

���������������������

const contentType = response.headers.get('Content-Type');
if (contentType && contentType.indexOf('octet-stream') > -1) {
    return response.blob();
}
requestGetPicture(id).then((data) => {
    const img = document.createElement('img');
    img.onload = () => {
        window.URL.revokeObjectURL(img.src);
    };
    img.src = window.URL.createObjectURL(data);
    const b = document.getElementsByClassName('imgCode')[0];
    b.appendChild(img);
});

IMAGE_DISPLAY_TYPE:

������������������������������������URL���Base64���Blob���

• URL���Base64���������������������src���
• Blob������������������������

���������������������������

url���Base64���

function urlToBase64(url) {
    return new Promise((resolve, reject) => {
        const img = new Image();
        img.onload = () => {
            const canvas = document.createElement('canvas');
            canvas.width = img.naturalWidth;
            canvas.height = img.naturalHeight;
            const context = canvas.getContext('2d');
            context.drawImage(img, 0, 0);
            const result = canvas.toDataURL('image/png');
            resolve(result);
        };
        img.src = url;
        img.onerror = () => {
            reject(new Error('���������������'));
        };
        img.setAttribute('crossOrigin', 'Anonymous');
    });
}

Base64���Blob���

function base64ToBlob({ b64data, contentType = 'image/png', sliceSize = 512 }) {
    return new Promise((resolve, reject) => {
        const byteCharacters = atob(b64data);
        const byteArrays = [];
        for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
            const slice = byteCharacters.slice(offset, offset + sliceSize);
            const byteNumbers = [];
            for (let i = 0; i < slice.length; i++) {
                byteNumbers.push(slice.charCodeAt(i));
            }
            byteArrays.push(new Uint8Array(byteNumbers));
        }
        const result = new Blob(byteArrays, { type: contentType });
        const preview = URL.createObjectURL(result);
        const name = `������������.png`;
        resolve({ result, preview, name });
    });
}

Blob���Base64���

function blobToBase64(blob) {
    return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = (e) => {
            resolve(e.target.result);
        };
        reader.readAsDataURL(blob);
        reader.onerror = () => {
            reject(new Error('���������������'));
        };
    });
}

������������������������������������������������������������������������������������������������������������������