On this page

Show all

Help Center/ Object Storage Service/ SDK Reference/ BrowserJS/ FAQs/ How Do I Upload a Base64-Encoded Image?

How Do I Upload a Base64-Encoded Image?

Updated on 2024-02-22 GMT+08:00

View PDF

You need to convert a Base64-encoded image into a specified format, and then call the OBS upload API to upload the image.

const base64ImgtoFile = function base64ImgtoFile(base64Content, filename) {
    const arr = base64Content.split(',');
    const mime = arr[0].match(/:(.*?);/)[1];
    const bstr = atob(arr[1]);
    let n = bstr.length;
    const u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    // If the environment supports file formats, you can also use return new File([u8arr], filename, { type: mime }).
    return new Blob([u8arr], { type: mime });
};
// obsClient indicates an instance of the OBS client.
const uploadBase64Img = function uploadBase64Img(obsClient) {
    // Specify the content in Base64 format.
    const base64Content = "data:image:xxxxxxxxxxxxx";
    const filename = 'img.png';
    const imgfile = base64ImgtoFile(base64Content, filename);
    obsClient.putObject({
        Bucket: 'bucketname',
        Key: filename,
        SourceFile: imgfile
    }, function (err, result) {
        if (err) {
            console.error('Error-->' + err);
        } else {
            console.log('Status-->' + result.CommonMsg.Status);
        }
    });
};

Parent topic: FAQs

Previous topic: How Do I Interact with OBS Without Exposing My AK and SK?

Next topic: What Do I Do If the Resumable Upload API Reports a "400 InvalidPart" Error?